new-ruoyi-geek/ruoyi-geek-app/pages_template/pages/address/index.ts

import { ref, reactive, computed } from 'vue';
import { onShow } from '@dcloudio/uni-app';

/**
 * 地址信息接口
 */
export interface AddressInfo {
    id: string;          // 地址ID
    name: string;        // 收货人姓名
    phone: string;       // 手机号码(已脱敏)
    region: string;      // 地区(如: 广东省深圳市南山区)
    address: string;     // 详细地址
    tag: string;         // 地址标签(如: 家、公司、学校)
    isDefault: boolean;  // 是否为默认地址
}

/**
 * 示例地址数据
 */
const sampleAddresses: AddressInfo[] = [
    {
        id: '1',
        name: '张三',
        phone: '13712348888',
        region: '广东省深圳市南山区',
        address: '科技园南路888号创新大厦A座10楼',
        tag: '公司',
        isDefault: true
    },
    {
        id: '2',
        name: '李四',
        phone: '13912345678',
        region: '广东省深圳市福田区',
        address: '福中路1000号海城大厦B座20楼2001室',
        tag: '家',
        isDefault: false
    },
    {
        id: '3',
        name: '王五',
        phone: '15812342233',
        region: '广东省广州市天河区',
        address: '天河路100号天河城购物中心附近小区A栋3单元701室',
        tag: '学校',
        isDefault: false
    }
];

// 共享的地址数据
const addressStore = {
    list: ref<AddressInfo[]>([]),
    tags: ref(['家', '公司', '学校'])
};

/**
 * 格式化手机号，中间4位用星号代替
 */
export function formatPhoneNumber(phone: string): string {
    return phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
}

/**
 * 地址列表页面Hook
 * @description 提供地址列表页面所需的状态和方法
 */
export function useAddressListPage() {
    // 从共享store获取响应式数据
    const addressList = addressStore.list;

    // 使用计算属性计算是否为空状态
    const emptyStatus = computed(() => addressList.value.length === 0);

    // 更新地址列表
    function refreshAddressList() {
        addressList.value = sampleAddresses
        // 实际项目中，这里应该调用API获取最新的地址列表
        // const response = await api.getAddressList();
        // addressList.value = response.data;
    }

    // 设置默认地址
    function setDefaultAddress(id: string): boolean {
        const index = addressList.value.findIndex(item => item.id === id);

        if (index === -1) return false;

        // 更新所有地址的默认状态
        addressList.value = addressList.value.map(item => ({
            ...item,
            isDefault: item.id === id
        }));

        return true;
    }

    // 删除地址
    function deleteAddress(id: string): boolean {
        const initialLength = addressList.value.length;
        addressList.value = addressList.value.filter(item => item.id !== id);
        return addressList.value.length !== initialLength;
    }

    // 页面显示时刷新数据
    onShow(() => {
        refreshAddressList();
    });

    return {
        // 响应式状态
        addressList,
        emptyStatus,
        // 方法
        setDefaultAddress,
        deleteAddress,
        refreshAddressList
    };
}

/**
 * 地址编辑页面Hook
 * @description 提供地址编辑页面所需的状态和方法
 */
export function useAddressEditPage() {
    // 从共享store获取响应式数据
    const addressList = addressStore.list;
    const addressTags = addressStore.tags;

    // 页面状态
    const isEdit = ref(false);
    const editId = ref('');
    const defaultAddress = ref(false);
    const selectedTag = ref('家');

    // 表单数据
    const form = reactive({
        name: '',
        phone: '',
        region: '',
        address: ''
    });

    // 加载编辑数据
    function loadAddressData(id: string): boolean {
        const address = addressList.value.find(item => item.id === id);

        if (!address) return false;

        // 填充表单数据
        form.name = address.name;
        form.phone = address.phone;
        form.region = address.region;
        form.address = address.address;
        selectedTag.value = address.tag;
        defaultAddress.value = address.isDefault;

        return true;
    }

    // 初始化页面
    function initEditPage(id?: string) {
        // 重置状态
        isEdit.value = !!id;
        editId.value = id || '';
        defaultAddress.value = false;
        selectedTag.value = '家';

        form.name = '';
        form.phone = '';
        form.region = '';
        form.address = '';

        // 如果是编辑模式，加载地址数据
        if (id) {
            loadAddressData(id);
        }
    }

    // 保存地址
    function saveAddress(): boolean {
        if (isEdit.value) {
            // 编辑现有地址
            const index = addressList.value.findIndex(item => item.id === editId.value);
            if (index === -1) return false;

            // 如果设为默认，更新其他地址
            if (defaultAddress.value) {
                addressList.value = addressList.value.map(item => {
                    if (item.id !== editId.value) {
                        return { ...item, isDefault: false };
                    }
                    return item;
                });
            }

            // 更新当前地址
            addressList.value[index] = {
                ...addressList.value[index],
                name: form.name,
                phone: form.phone,
                region: form.region,
                address: form.address,
                tag: selectedTag.value,
                isDefault: defaultAddress.value
            };
        } else {
            // 添加新地址
            const newId = Date.now().toString();

            // 如果设为默认，更新其他地址
            if (defaultAddress.value) {
                addressList.value = addressList.value.map(item => ({
                    ...item,
                    isDefault: false
                }));
            }

            // 添加新地址
            addressList.value.push({
                id: newId,
                name: form.name,
                phone: form.phone,
                region: form.region,
                address: form.address,
                tag: selectedTag.value,
                isDefault: defaultAddress.value
            });
        }

        return true;
    }

    // 删除地址
    function deleteAddress(): boolean {
        if (!isEdit.value) return false;

        const initialLength = addressList.value.length;
        addressList.value = addressList.value.filter(item => item.id !== editId.value);

        return addressList.value.length !== initialLength;
    }

    return {
        // 响应式状态
        isEdit,
        editId,
        form,
        defaultAddress,
        selectedTag,
        addressTags,
        // 方法
        initEditPage,
        saveAddress,
        deleteAddress
    };
}