1 line
6.7 KiB
Plaintext
1 line
6.7 KiB
Plaintext
{"version":3,"file":"AddAddress.js","sources":["../../../../../../src/pages/address/components/AddAddress.vue","../../../../../../uniComponent:/RDovQXBwL1dvcmsvYWRkci9hY2RyLXVpL3NyYy9wYWdlcy9hZGRyZXNzL2NvbXBvbmVudHMvQWRkQWRkcmVzcy52dWU"],"sourcesContent":["<template>\r\n <view class=\"add-address\">\r\n <wd-form ref=\"addressForm\">\r\n <wd-input label=\"姓名\" v-model=\"address.name\" required />\r\n <wd-input label=\"电话\" v-model=\"address.phone\" required type=\"tel\" />\r\n\r\n <!-- 使用 WotDesign 的选择器 -->\r\n <wd-picker\r\n :columns=\"typeOptions\"\r\n label=\"地址类型\"\r\n v-model=\"address.type\"\r\n @confirm=\"handleTypeChange\"\r\n />\r\n\r\n <!-- 如果选择了自定义类型，显示输入框 -->\r\n <wd-input v-if=\"isCustomType\" label=\"自定义类型\" v-model=\"address.customType\" required />\r\n\r\n <wd-col-picker\r\n label=\"选择地址\"\r\n v-model=\"value\"\r\n :columns=\"area\"\r\n :column-change=\"columnChange\"\r\n :display-format=\"displayFormat\"\r\n @confirm=\"handleConfirm\"\r\n ></wd-col-picker>\r\n <view\r\n style=\"width: 100%; padding-left: 15px; color: #bebebe\"\r\n v-if=\"address.address.length && address.address && !value.length\"\r\n >\r\n 当前地址：{{ address.address }}\r\n </view>\r\n <wd-input label=\"详细地址\" v-model=\"address.detailAddress\" required />\r\n <button class=\"add-address-button\" type=\"primary\" @click=\"submitAddress\">保存</button>\r\n </wd-form>\r\n </view>\r\n</template>\r\n<script setup>\r\nimport { ref, watch } from 'vue'\r\nimport { useColPickerData } from '@/hooks/useColPickerData'\r\n\r\nconst { colPickerData, findChildrenByCode } = useColPickerData()\r\n\r\nconst value = ref([])\r\nconst props = defineProps({\r\n initialAddress: {\r\n type: Object,\r\n default: () => ({\r\n name: '',\r\n phone: '',\r\n address: '',\r\n detailAddress: '',\r\n type: '',\r\n customType: '',\r\n }),\r\n },\r\n})\r\n\r\nconst initArea = ref([])\r\nconst area = ref([\r\n colPickerData.map((item) => {\r\n return {\r\n value: item.value,\r\n label: item.text,\r\n }\r\n }),\r\n])\r\n\r\nconst typeOptions = ref(['家', '公司', '自定义'])\r\n\r\nconst isCustomType = ref(false)\r\n\r\nconst columnChange = ({ selectedItem, resolve, finish }) => {\r\n const areaData = findChildrenByCode(colPickerData, selectedItem.value)\r\n if (areaData && areaData.length) {\r\n resolve(areaData.map((item) => ({ value: item.value, label: item.text })))\r\n } else {\r\n finish()\r\n }\r\n}\r\n\r\nconst displayFormat = (selectedItems) => {\r\n return selectedItems.map((v) => v.label).join('-')\r\n}\r\n\r\nfunction handleConfirm({ value, selectedItems }) {\r\n address.value.address = selectedItems.map((v) => v.label).join('-')\r\n console.log(address.value.address)\r\n}\r\n\r\nfunction handleTypeChange({ value }) {\r\n isCustomType.value = value === '自定义'\r\n if (!isCustomType.value) {\r\n address.value.customType = ''\r\n }\r\n}\r\n\r\nconst emit = defineEmits(['save-address'])\r\nconst address = ref({ ...props.initialAddress })\r\n\r\nconst initAddress = () => {\r\n console.log('ddd', area.value)\r\n const initAddress = props.initialAddress.address.split('-')\r\n const pcode = area.value[0].filter((area) => area.label == initAddress[0])\r\n const areaData = findChildrenByCode(colPickerData, pcode[0].value)\r\n const ccode = areaData.filter((area) => area.text == initAddress[1])\r\n const areaDataTwo = findChildrenByCode(colPickerData, ccode[0].value)\r\n const dcode = areaDataTwo.filter((area) => area.text == initAddress[2])\r\n value.value = [pcode[0].value, ccode[0].value, dcode[0].value]\r\n}\r\n\r\nwatch(\r\n () => props.initialAddress,\r\n (newVal) => {\r\n address.value = { ...newVal }\r\n isCustomType.value = newVal.type === '自定义'\r\n },\r\n)\r\n\r\nconst submitAddress = () => {\r\n if (\r\n address.value.name &&\r\n address.value.phone &&\r\n address.value.detailAddress &&\r\n (address.value.type !== '自定义' || address.value.customType)\r\n ) {\r\n emit('save-address', address.value)\r\n resetForm()\r\n } else {\r\n uni.showToast({ title: '请填写完整的地址信息', icon: 'error' })\r\n }\r\n}\r\n\r\nconst resetForm = () => {\r\n address.value = { name: '', phone: '', address: '', detailAddress: '', type: '', customType: '' }\r\n value.value = []\r\n isCustomType.value = false\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.add-address {\r\n padding: 20px;\r\n}\r\n.add-address-button {\r\n width: 100%;\r\n font-size: 18px !important;\r\n background-color: #fcd038 !important;\r\n}\r\n\r\n.picker {\r\n padding: 10px;\r\n margin-top: 10px;\r\n border: 1px solid #ddd;\r\n border-radius: 5px;\r\n}\r\n</style>\r\n","import Component from 'D:/App/Work/addr/acdr-ui/src/pages/address/components/AddAddress.vue'\nwx.createComponent(Component)"],"names":["useColPickerData","ref","value","watch","uni"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA,UAAM,EAAE,eAAe,mBAAoB,IAAGA,wCAAkB;AAEhE,UAAM,QAAQC,cAAG,IAAC,EAAE;AACpB,UAAM,QAAQ;AAcGA,kBAAG,IAAC,EAAE;AACvB,UAAM,OAAOA,cAAAA,IAAI;AAAA,MACf,cAAc,IAAI,CAAC,SAAS;AAC1B,eAAO;AAAA,UACL,OAAO,KAAK;AAAA,UACZ,OAAO,KAAK;AAAA,QACb;AAAA,MACL,CAAG;AAAA,IACH,CAAC;AAED,UAAM,cAAcA,cAAAA,IAAI,CAAC,KAAK,MAAM,KAAK,CAAC;AAE1C,UAAM,eAAeA,cAAG,IAAC,KAAK;AAE9B,UAAM,eAAe,CAAC,EAAE,cAAc,SAAS,OAAM,MAAO;AAC1D,YAAM,WAAW,mBAAmB,eAAe,aAAa,KAAK;AACrE,UAAI,YAAY,SAAS,QAAQ;AAC/B,gBAAQ,SAAS,IAAI,CAAC,UAAU,EAAE,OAAO,KAAK,OAAO,OAAO,KAAK,KAAI,EAAG,CAAC;AAAA,MAC7E,OAAS;AACL,eAAQ;AAAA,MACT;AAAA,IACH;AAEA,UAAM,gBAAgB,CAAC,kBAAkB;AACvC,aAAO,cAAc,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG;AAAA,IACnD;AAEA,aAAS,cAAc,EAAE,OAAAC,QAAO,iBAAiB;AAC/C,cAAQ,MAAM,UAAU,cAAc,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,GAAG;AAClE,cAAQ,IAAI,QAAQ,MAAM,OAAO;AAAA,IACnC;AAEA,aAAS,iBAAiB,EAAE,OAAAA,UAAS;AACnC,mBAAa,QAAQA,WAAU;AAC/B,UAAI,CAAC,aAAa,OAAO;AACvB,gBAAQ,MAAM,aAAa;AAAA,MAC5B;AAAA,IACH;AAEA,UAAM,OAAO;AACb,UAAM,UAAUD,cAAAA,IAAI,mBAAK,MAAM,eAAgB;AAa/CE,kBAAK;AAAA,MACH,MAAM,MAAM;AAAA,MACZ,CAAC,WAAW;AACV,gBAAQ,QAAQ,mBAAK;AACrB,qBAAa,QAAQ,OAAO,SAAS;AAAA,MACtC;AAAA,IACH;AAEA,UAAM,gBAAgB,MAAM;AAC1B,UACE,QAAQ,MAAM,QACd,QAAQ,MAAM,SACd,QAAQ,MAAM,kBACb,QAAQ,MAAM,SAAS,SAAS,QAAQ,MAAM,aAC/C;AACA,aAAK,gBAAgB,QAAQ,KAAK;AAClC,kBAAW;AAAA,MACf,OAAS;AACLC,sBAAG,MAAC,UAAU,EAAE,OAAO,cAAc,MAAM,SAAS;AAAA,MACrD;AAAA,IACH;AAEA,UAAM,YAAY,MAAM;AACtB,cAAQ,QAAQ,EAAE,MAAM,IAAI,OAAO,IAAI,SAAS,IAAI,eAAe,IAAI,MAAM,IAAI,YAAY,GAAI;AACjG,YAAM,QAAQ,CAAE;AAChB,mBAAa,QAAQ;AAAA,IACvB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACvIA,GAAG,gBAAgB,SAAS;"} |