Hooke / data-table

Go to a project
Toggle navigation Toggle navigation pinning
You need to sign in or sign up before continuing.
hookehuyr
1303eee2 1 parent 8316f741

✨ feat: 地址输入模块新增详细地址录入功能

Inline Side-by-side
Showing 2 changed files with 22 additions and 17 deletions
1 <!-- 1 <!--
2 * @Date: 2022-08-30 14:32:11 2 * @Date: 2022-08-30 14:32:11
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-08-30 17:56:04 4 + * @LastEditTime: 2022-09-06 15:53:10
5 * @FilePath: /data-table/src/components/AreaPickerField/index.vue 5 * @FilePath: /data-table/src/components/AreaPickerField/index.vue
6 * @Description: 文件描述 6 * @Description: 文件描述
7 --> 7 -->
...@@ -10,8 +10,10 @@ ...@@ -10,8 +10,10 @@
10 <div class="label">{{ item.label }}<span v-if="item.required">&nbsp;*</span></div> 10 <div class="label">{{ item.label }}<span v-if="item.required">&nbsp;*</span></div>
11 <van-field v-model="item.value" is-link readonly :name="item.key" :required="item.required" 11 <van-field v-model="item.value" is-link readonly :name="item.key" :required="item.required"
12 :placeholder="item.placeholder" :rules="item.rules" @click="showPicker = true" /> 12 :placeholder="item.placeholder" :rules="item.rules" @click="showPicker = true" />
13 + <van-field name="address" v-model="item.address" placeholder="详细地址" />
13 <van-popup v-model:show="showPicker" position="bottom"> 14 <van-popup v-model:show="showPicker" position="bottom">
14 - <van-area v-model="item.code" title="" :area-list="areaList" @confirm="onConfirm" @cancel="showPicker = false" /> 15 + <van-area name="city_code" v-model="item.city_code" title="" :area-list="areaList" @confirm="onConfirm"
16 + @cancel="showPicker = false" />
15 </van-popup> 17 </van-popup>
16 </div> 18 </div>
17 </template> 19 </template>
...@@ -21,7 +23,9 @@ import { areaList } from '@vant/area-data'; ...@@ -21,7 +23,9 @@ import { areaList } from '@vant/area-data';
21 23
22 const props = defineProps({ 24 const props = defineProps({
23 item: Object 25 item: Object
24 -}) 26 +});
27 +
28 +const address = ref('')
25 29
26 const showPicker = ref(false); 30 const showPicker = ref(false);
27 const fieldValue = ref(''); 31 const fieldValue = ref('');
......
1 <!-- 1 <!--
2 * @Date: 2022-07-18 10:22:22 2 * @Date: 2022-07-18 10:22:22
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2022-09-06 15:24:52 4 + * @LastEditTime: 2022-09-06 15:53:40
5 * @FilePath: /data-table/src/views/index.vue 5 * @FilePath: /data-table/src/views/index.vue
6 * @Description: 首页 6 * @Description: 首页
7 --> 7 -->
...@@ -55,17 +55,17 @@ onMounted(() => { ...@@ -55,17 +55,17 @@ onMounted(() => {
55 }, 55 },
56 required: true, 56 required: true,
57 }, 57 },
58 - { 58 + // {
59 - key: 'email', 59 + // key: 'email',
60 - value: '', 60 + // value: '',
61 - label: '邮箱', 61 + // label: '邮箱',
62 - placeholder: '请输入邮箱', 62 + // placeholder: '请输入邮箱',
63 - component: '', 63 + // component: '',
64 - component_props: { 64 + // component_props: {
65 - name: 'email' 65 + // name: 'email'
66 - }, 66 + // },
67 - required: true, 67 + // required: true,
68 - }, 68 + // },
69 // { 69 // {
70 // key: 'age', 70 // key: 'age',
71 // value: '', 71 // value: '',
...@@ -141,7 +141,8 @@ onMounted(() => { ...@@ -141,7 +141,8 @@ onMounted(() => {
141 key: 'city', 141 key: 'city',
142 value: '天津市/天津市/和平区', 142 value: '天津市/天津市/和平区',
143 city_code: '120101', 143 city_code: '120101',
144 - label: '省市区', 144 + label: '地址',
145 + address: '',
145 placeholder: '请选择省市区', 146 placeholder: '请选择省市区',
146 component_props: { 147 component_props: {
147 name: 'area_picker' 148 name: 'area_picker'
...@@ -176,7 +177,7 @@ onMounted(() => { ...@@ -176,7 +177,7 @@ onMounted(() => {
176 177
177 const onSubmit = (values) => { 178 const onSubmit = (values) => {
178 console.log('submit', values); 179 console.log('submit', values);
179 - // console.warn(mockData.value); 180 + console.warn(mockData.value);
180 }; 181 };
181 182
182 </script> 183 </script>
......