Commit 2e7486729c502558ed80a317499ec0bc88a985b0
1 parent
0b1c327a
Exists in
charge
feat:选择框添加搜索功能
Showing
3 changed files
with
218 additions
and
46 deletions
Show diff stats
pages/charge/visitsAndFees/createaVisit.vue
| @@ -199,12 +199,12 @@ | @@ -199,12 +199,12 @@ | ||
| 199 | <!-- 字典选择 --> | 199 | <!-- 字典选择 --> |
| 200 | <u-picker :show="pickerShow" :showSearch="currentName === 'vlgOrCmty' || currentName === 'userName'" ref="uPicker" | 200 | <u-picker :show="pickerShow" :showSearch="currentName === 'vlgOrCmty' || currentName === 'userName'" ref="uPicker" |
| 201 | closeOnClickOverlay :columns="columns" @cancel="pickerShow = false" @close="pickerShow = false" keyName="label" | 201 | closeOnClickOverlay :columns="columns" @cancel="pickerShow = false" @close="pickerShow = false" keyName="label" |
| 202 | - @confirm="confirm"></u-picker> | 202 | + @confirm="confirm" @keywordChange="keywordChange"></u-picker> |
| 203 | 203 | ||
| 204 | <!-- 公司选择 --> | 204 | <!-- 公司选择 --> |
| 205 | <u-picker showSearch :show="gsShow" ref="gsPicker" closeOnClickOverlay :title="gsName" :columns="companyList" | 205 | <u-picker showSearch :show="gsShow" ref="gsPicker" closeOnClickOverlay :title="gsName" :columns="companyList" |
| 206 | - @cancel="gsShow = false" @close="gsShow = false" keyName="label" @confirm="gsConfirm" | ||
| 207 | - @change="changeHandler"></u-picker> | 206 | + @cancel="gsShow = false" @close="gsShow = false" keyName="label" @confirm="gsConfirm" placeholder="输入公司名称查询" |
| 207 | + @change="changeHandler" @keywordChange="gsKeyWordChange" @clear="gsKeyWordClear"></u-picker> | ||
| 208 | 208 | ||
| 209 | <!-- 时间选择 --> | 209 | <!-- 时间选择 --> |
| 210 | <u-datetime-picker :show="datetimeShow" v-model="dataTimeValue" closeOnClickOverlay @confirm="dateConfirm" | 210 | <u-datetime-picker :show="datetimeShow" v-model="dataTimeValue" closeOnClickOverlay @confirm="dateConfirm" |
| @@ -255,7 +255,7 @@ | @@ -255,7 +255,7 @@ | ||
| 255 | userPhone: "", | 255 | userPhone: "", |
| 256 | companyCode: "", | 256 | companyCode: "", |
| 257 | address: "", | 257 | address: "", |
| 258 | - userDetailedAddress: "", | 258 | + userDetailedAddress: "123", |
| 259 | isVisited: "", | 259 | isVisited: "", |
| 260 | isIntent: "", | 260 | isIntent: "", |
| 261 | houseCondition: "", | 261 | houseCondition: "", |
| @@ -397,17 +397,20 @@ | @@ -397,17 +397,20 @@ | ||
| 397 | trigger: ['blur', 'change'] | 397 | trigger: ['blur', 'change'] |
| 398 | }], | 398 | }], |
| 399 | userCode: [{ | 399 | userCode: [{ |
| 400 | - required: false, | ||
| 401 | - message: '请填写用户编号', | ||
| 402 | - trigger: ['blur', 'change'] | ||
| 403 | - }, | ||
| 404 | - // { | ||
| 405 | - // validator: (rule, value, callback) => { | ||
| 406 | - // return uni.$u.test.digits(value) | ||
| 407 | - // }, | ||
| 408 | - // message: '用户编号不正确', | ||
| 409 | - // trigger: ['change', 'blur'], | ||
| 410 | - // } | 400 | + required: false, |
| 401 | + message: '请填写用户编号', | ||
| 402 | + trigger: ['blur', 'change'] | ||
| 403 | + }, | ||
| 404 | + { | ||
| 405 | + validator: (rule, value, callback) => { | ||
| 406 | + if (!value) { | ||
| 407 | + return true | ||
| 408 | + } | ||
| 409 | + return uni.$u.test.enOrNum(value) | ||
| 410 | + }, | ||
| 411 | + message: '用户编号不正确', | ||
| 412 | + trigger: ['change', 'blur'], | ||
| 413 | + } | ||
| 411 | ], | 414 | ], |
| 412 | userIdCard: [{ | 415 | userIdCard: [{ |
| 413 | required: true, | 416 | required: true, |
| @@ -462,11 +465,16 @@ | @@ -462,11 +465,16 @@ | ||
| 462 | datetimeShow: false, | 465 | datetimeShow: false, |
| 463 | dataTimeValue: Number(new Date()), | 466 | dataTimeValue: Number(new Date()), |
| 464 | columns: [], | 467 | columns: [], |
| 468 | + copyColumns: [], | ||
| 465 | gsColumns: [], | 469 | gsColumns: [], |
| 466 | regionName: [], | 470 | regionName: [], |
| 467 | groupName: [], | 471 | groupName: [], |
| 468 | companyName: [], | 472 | companyName: [], |
| 469 | companyCode: [], | 473 | companyCode: [], |
| 474 | + // 还原类 | ||
| 475 | + regionNames: [], | ||
| 476 | + groupNames: [], | ||
| 477 | + companyNames: [], | ||
| 470 | currentName: "", //弹窗后赋值name | 478 | currentName: "", //弹窗后赋值name |
| 471 | companyOption: [], | 479 | companyOption: [], |
| 472 | fileList: [], | 480 | fileList: [], |
| @@ -480,6 +488,10 @@ | @@ -480,6 +488,10 @@ | ||
| 480 | regionLoading: false, | 488 | regionLoading: false, |
| 481 | pickerValue: [0, 0, 0, 0], | 489 | pickerValue: [0, 0, 0, 0], |
| 482 | defaultValue: [11, 1101, 110101, 110101001], | 490 | defaultValue: [11, 1101, 110101, 110101001], |
| 491 | + defaultRegion: "", | ||
| 492 | + defaultGroup: "", | ||
| 493 | + openKeyword: false, //是否输入公司名称查询 | ||
| 494 | + gsChangeIndexs: [], | ||
| 483 | // 基本信息 | 495 | // 基本信息 |
| 484 | basisData: [{ | 496 | basisData: [{ |
| 485 | label: '财年', | 497 | label: '财年', |
| @@ -696,7 +708,7 @@ | @@ -696,7 +708,7 @@ | ||
| 696 | type: "input", | 708 | type: "input", |
| 697 | key: "userCode", | 709 | key: "userCode", |
| 698 | show: true, | 710 | show: true, |
| 699 | - mode: "number", | 711 | + mode: "text", |
| 700 | max: '10' | 712 | max: '10' |
| 701 | }, { | 713 | }, { |
| 702 | label: '身份证号', | 714 | label: '身份证号', |
| @@ -953,16 +965,34 @@ | @@ -953,16 +965,34 @@ | ||
| 953 | }, | 965 | }, |
| 954 | async getCompanyCascader() { | 966 | async getCompanyCascader() { |
| 955 | this.companyOption = (await getCompanyCascader()).data; | 967 | this.companyOption = (await getCompanyCascader()).data; |
| 956 | - this.companyOption.forEach(item1 => { | 968 | + this.companyOption.forEach((item1, index1) => { |
| 957 | this.regionName.push(item1); | 969 | this.regionName.push(item1); |
| 958 | - item1.children.forEach(item2 => { | 970 | + item1.children.forEach((item2, index2) => { |
| 959 | this.groupName.push(item2); | 971 | this.groupName.push(item2); |
| 960 | - item2.children.forEach(item3 => { | 972 | + item2.children.forEach((item3, index3) => { |
| 961 | this.companyName.push(item3); | 973 | this.companyName.push(item3); |
| 962 | }); | 974 | }); |
| 963 | }); | 975 | }); |
| 964 | }); | 976 | }); |
| 977 | + | ||
| 978 | + this.regionName.map((item1, index1) => { | ||
| 979 | + item1.index = index1; | ||
| 980 | + item1.children.map((item2, index2) => { | ||
| 981 | + item2.index = index2; | ||
| 982 | + item2.children.map((item3, index3) => { | ||
| 983 | + item3.index = index3; | ||
| 984 | + }) | ||
| 985 | + }) | ||
| 986 | + }) | ||
| 987 | + this.regionNames = this.regionName; | ||
| 988 | + this.groupNames = this.groupName; | ||
| 989 | + this.companyNames = this.companyName; | ||
| 990 | + this.defaultRegion = this.regionName[0].label; | ||
| 991 | + this.defaultGroup = this.groupName[0].label; | ||
| 965 | console.log("当前公司类", this.companyOption); | 992 | console.log("当前公司类", this.companyOption); |
| 993 | + console.log("区域", this.regionNames); | ||
| 994 | + console.log("集团", this.groupNames); | ||
| 995 | + console.log("公司", this.companyNames); | ||
| 966 | }, | 996 | }, |
| 967 | // 选择弹出层 | 997 | // 选择弹出层 |
| 968 | async handleSelect(item) { | 998 | async handleSelect(item) { |
| @@ -973,10 +1003,14 @@ | @@ -973,10 +1003,14 @@ | ||
| 973 | this.currentName = item.key; | 1003 | this.currentName = item.key; |
| 974 | // 项目公司单独弹窗 | 1004 | // 项目公司单独弹窗 |
| 975 | if (item.key === 'company') { | 1005 | if (item.key === 'company') { |
| 976 | - this.gsColumns = [this.regionName, this.groupName, this.companyName]; | ||
| 977 | - if (this.regionName.length) { | 1006 | + // this.gsColumns = [this.regionName, this.groupName, this.companyName]; |
| 1007 | + if (this.regionName.length || this.regionName) { | ||
| 978 | this.gsName = `${this.regionName[0].label}`; | 1008 | this.gsName = `${this.regionName[0].label}`; |
| 979 | this.gsShow = true; | 1009 | this.gsShow = true; |
| 1010 | + let defaultIndex = this.defaultIndex[this.currentName]; | ||
| 1011 | + console.log("选择公司默认值", defaultIndex) | ||
| 1012 | + this.$refs.gsPicker.setIndexs(defaultIndex ? defaultIndex : [0, 0, 0], true) | ||
| 1013 | + this.$refs.gsPicker.handleClear(); | ||
| 980 | } else { | 1014 | } else { |
| 981 | uni.$u.toast('未查询到项目公司'); | 1015 | uni.$u.toast('未查询到项目公司'); |
| 982 | } | 1016 | } |
| @@ -999,7 +1033,7 @@ | @@ -999,7 +1033,7 @@ | ||
| 999 | uni.$u.toast('未查询相关小区'); | 1033 | uni.$u.toast('未查询相关小区'); |
| 1000 | return | 1034 | return |
| 1001 | } | 1035 | } |
| 1002 | - let col = result.data.map(item => ({ | 1036 | + let col = result.data.map((item, index) => ({ |
| 1003 | value: item.vlgOrCmty, | 1037 | value: item.vlgOrCmty, |
| 1004 | label: `${item.vlgOrCmty}(${item.urbRurCls})`, | 1038 | label: `${item.vlgOrCmty}(${item.urbRurCls})`, |
| 1005 | urbRurCls: item.urbRurCls, | 1039 | urbRurCls: item.urbRurCls, |
| @@ -1007,9 +1041,11 @@ | @@ -1007,9 +1041,11 @@ | ||
| 1007 | city: item.city, | 1041 | city: item.city, |
| 1008 | district: item.district, | 1042 | district: item.district, |
| 1009 | street: item.street, | 1043 | street: item.street, |
| 1010 | - address: `${item.province}${item.city}${item.district}${item.street}` | 1044 | + address: `${item.province}${item.city}${item.district}${item.street}`, |
| 1045 | + index: index | ||
| 1011 | })); | 1046 | })); |
| 1012 | this.columns = [col]; | 1047 | this.columns = [col]; |
| 1048 | + this.copyColumns = this.columns; | ||
| 1013 | } else if (item.key === 'userName') { | 1049 | } else if (item.key === 'userName') { |
| 1014 | if (!this.model.vlgOrCmty) { | 1050 | if (!this.model.vlgOrCmty) { |
| 1015 | uni.$u.toast('请先选择村(小区)'); | 1051 | uni.$u.toast('请先选择村(小区)'); |
| @@ -1024,12 +1060,14 @@ | @@ -1024,12 +1060,14 @@ | ||
| 1024 | uni.$u.toast('未查询相关用户'); | 1060 | uni.$u.toast('未查询相关用户'); |
| 1025 | return | 1061 | return |
| 1026 | } | 1062 | } |
| 1027 | - let col = result.rows.map(item => ({ | 1063 | + let col = result.rows.map((item, index) => ({ |
| 1028 | value: item.userName, | 1064 | value: item.userName, |
| 1029 | label: item.userName, | 1065 | label: item.userName, |
| 1030 | - obj: item | 1066 | + obj: item, |
| 1067 | + index: index | ||
| 1031 | })); | 1068 | })); |
| 1032 | this.columns = [col]; | 1069 | this.columns = [col]; |
| 1070 | + this.copyColumns = this.columns; | ||
| 1033 | // 省市区单独弹窗 | 1071 | // 省市区单独弹窗 |
| 1034 | } else if (item.key === 'address') { | 1072 | } else if (item.key === 'address') { |
| 1035 | this.provinces = cityData.sort((left, right) => (Number(left.code) > Number(right.code) ? 1 : -1)); | 1073 | this.provinces = cityData.sort((left, right) => (Number(left.code) > Number(right.code) ? 1 : -1)); |
| @@ -1041,6 +1079,7 @@ | @@ -1041,6 +1079,7 @@ | ||
| 1041 | let dict = item.dict; | 1079 | let dict = item.dict; |
| 1042 | let dictArr = this.getDictDatas(dict); | 1080 | let dictArr = this.getDictDatas(dict); |
| 1043 | this.columns = [dictArr]; | 1081 | this.columns = [dictArr]; |
| 1082 | + this.copyColumns = this.columns; | ||
| 1044 | } | 1083 | } |
| 1045 | let defaultIndex = this.defaultIndex[this.currentName]; | 1084 | let defaultIndex = this.defaultIndex[this.currentName]; |
| 1046 | console.log("是否有默认值", defaultIndex) | 1085 | console.log("是否有默认值", defaultIndex) |
| @@ -1070,11 +1109,123 @@ | @@ -1070,11 +1109,123 @@ | ||
| 1070 | this.model.userStreet = ""; | 1109 | this.model.userStreet = ""; |
| 1071 | this.model.userDetailedAddress = ""; | 1110 | this.model.userDetailedAddress = ""; |
| 1072 | }, | 1111 | }, |
| 1112 | + // 关键词搜索 | ||
| 1113 | + keywordChange(keyword) { | ||
| 1114 | + console.log("关键词", keyword) | ||
| 1115 | + console.log("columns", this.copyColumns) | ||
| 1116 | + let data = this.copyColumns[0] | ||
| 1117 | + let queryData = data.filter(item => item.value && item.value.includes(keyword)); | ||
| 1118 | + console.log("筛选", queryData) | ||
| 1119 | + this.columns = [queryData]; | ||
| 1120 | + }, | ||
| 1121 | + // 关键词搜索 | ||
| 1122 | + gsKeyWordChange(keyword) { | ||
| 1123 | + if (!keyword) { | ||
| 1124 | + this.regionName = this.regionNames; | ||
| 1125 | + this.groupName = this.groupNames; | ||
| 1126 | + this.companyName = this.companyNames; | ||
| 1127 | + this.defaultRegion = this.regionNames[0].label; | ||
| 1128 | + this.defaultGroup = this.groupNames[0].label; | ||
| 1129 | + this.openKeyword = false; | ||
| 1130 | + return; | ||
| 1131 | + } | ||
| 1132 | + this.gsChangeIndexs = []; | ||
| 1133 | + this.openKeyword = true; | ||
| 1134 | + console.log("公司关键词", keyword); | ||
| 1135 | + console.log("regionNames", this.regionNames) | ||
| 1136 | + const hierarchies = this.findCompanyHierarchy(keyword, this.regionNames); | ||
| 1137 | + console.log("返回结果", hierarchies); | ||
| 1138 | + if (hierarchies[2].length > 0) { // 如果找到了至少一个公司 | ||
| 1139 | + this.regionName = hierarchies[0]; | ||
| 1140 | + this.groupName = hierarchies[1]; | ||
| 1141 | + this.companyName = hierarchies[2]; | ||
| 1142 | + } else { | ||
| 1143 | + uni.$u.toast('未查询到该公司'); | ||
| 1144 | + this.regionName = [{ | ||
| 1145 | + value: this.defaultRegion, | ||
| 1146 | + label: this.defaultRegion | ||
| 1147 | + }]; | ||
| 1148 | + this.groupName = [{ | ||
| 1149 | + value: this.defaultGroup, | ||
| 1150 | + label: this.defaultGroup | ||
| 1151 | + }]; | ||
| 1152 | + // this.companyName = this.companyNames; | ||
| 1153 | + } | ||
| 1154 | + }, | ||
| 1155 | + // 关键词清空后 | ||
| 1156 | + gsKeyWordClear() { | ||
| 1157 | + console.log("清除关键词触发") | ||
| 1158 | + this.defaultRegion = this.regionNames[0].label | ||
| 1159 | + this.defaultGroup = this.groupNames[0].label | ||
| 1160 | + }, | ||
| 1161 | + // 查找公司对应关系 | ||
| 1162 | + findCompanyHierarchy(keyword, nodes = data) { | ||
| 1163 | + const regionHierarchy = []; | ||
| 1164 | + const groupHierarchy = []; | ||
| 1165 | + const companyHierarchy = []; | ||
| 1166 | + // console.log(1, this.regionNames) | ||
| 1167 | + // console.log(2, this.groupNames) | ||
| 1168 | + // console.log(3, this.companyNames) | ||
| 1169 | + console.log("当前选择区域", this.defaultRegion); | ||
| 1170 | + console.log("当前选择集团", this.defaultGroup); | ||
| 1171 | + nodes.forEach(item1 => { | ||
| 1172 | + item1.children.forEach(item2 => { | ||
| 1173 | + item2.children.forEach(item3 => { | ||
| 1174 | + if (item1.label == this.defaultRegion && item2.label == this.defaultGroup) { | ||
| 1175 | + if (item3.label.includes(keyword)) { | ||
| 1176 | + if (!regionHierarchy.some(region => region.label === item1.label)) { | ||
| 1177 | + regionHierarchy.push(item1); | ||
| 1178 | + } | ||
| 1179 | + if (!groupHierarchy.some(group => group.label === item2.label)) { | ||
| 1180 | + groupHierarchy.push(item2); | ||
| 1181 | + } | ||
| 1182 | + companyHierarchy.push(item3); | ||
| 1183 | + } | ||
| 1184 | + } | ||
| 1185 | + }); | ||
| 1186 | + }); | ||
| 1187 | + }); | ||
| 1188 | + return [regionHierarchy, groupHierarchy, companyHierarchy]; | ||
| 1189 | + }, | ||
| 1190 | + // 项目公司独立弹窗,防止共用报错 | ||
| 1191 | + gsConfirm(e) { | ||
| 1192 | + console.log("公司", e); | ||
| 1193 | + // this.$refs.gsPicker.handleClear(); | ||
| 1194 | + if (this.currentName === 'company') { | ||
| 1195 | + this.emptyFill(1); | ||
| 1196 | + this.model[this.currentName] = `${e.value[2].label}`; | ||
| 1197 | + this.model.regionName = e.value[0]?.value; | ||
| 1198 | + this.model.groupName = e.value[1]?.value; | ||
| 1199 | + this.model.companyName = e.value[2]?.label; | ||
| 1200 | + this.model.companyCode = e.value[2]?.value; | ||
| 1201 | + // if (this.openKeyword) { | ||
| 1202 | + // console.log("关键词查询后的原始index", this.gsChangeIndexs) | ||
| 1203 | + // this.defaultIndex[this.currentName] = this.gsChangeIndexs; | ||
| 1204 | + // } else { | ||
| 1205 | + this.defaultIndex[this.currentName] = e.indexs; | ||
| 1206 | + // } | ||
| 1207 | + this.regionName = this.regionNames; | ||
| 1208 | + this.groupName = this.groupNames; | ||
| 1209 | + this.companyName = this.companyNames; | ||
| 1210 | + // this.regionName = this.regionNames; | ||
| 1211 | + // this.groupName = [{ | ||
| 1212 | + // value: e.value[1]?.value, | ||
| 1213 | + // label: e.value[1]?.value | ||
| 1214 | + // }]; | ||
| 1215 | + // this.companyName = [{ | ||
| 1216 | + // value: e.value[2]?.value, | ||
| 1217 | + // label: e.value[2]?.label | ||
| 1218 | + // }]; | ||
| 1219 | + } | ||
| 1220 | + this.openKeyword = false; | ||
| 1221 | + this.gsShow = false; | ||
| 1222 | + }, | ||
| 1073 | handleSFSelect(item) { | 1223 | handleSFSelect(item) { |
| 1074 | this.currentName = item.key; | 1224 | this.currentName = item.key; |
| 1075 | let dict = item.dict; | 1225 | let dict = item.dict; |
| 1076 | let dictArr = this.getDictDatas(dict); | 1226 | let dictArr = this.getDictDatas(dict); |
| 1077 | this.columns = [dictArr]; | 1227 | this.columns = [dictArr]; |
| 1228 | + this.copyColumns = this.columns; | ||
| 1078 | let defaultIndex = this.defaultIndex[this.currentName]; | 1229 | let defaultIndex = this.defaultIndex[this.currentName]; |
| 1079 | console.log("是否有默认值", defaultIndex) | 1230 | console.log("是否有默认值", defaultIndex) |
| 1080 | this.$refs.uPicker.setIndexs(defaultIndex ? [defaultIndex] : [0], true) | 1231 | this.$refs.uPicker.setIndexs(defaultIndex ? [defaultIndex] : [0], true) |
| @@ -1120,7 +1271,12 @@ | @@ -1120,7 +1271,12 @@ | ||
| 1120 | } else { | 1271 | } else { |
| 1121 | this.model[this.currentName] = e.value[0].value | 1272 | this.model[this.currentName] = e.value[0].value |
| 1122 | } | 1273 | } |
| 1123 | - this.defaultIndex[this.currentName] = e.indexs[0]; | 1274 | + if (this.currentName === 'vlgOrCmty' || this.currentName === 'userName') { |
| 1275 | + this.defaultIndex[this.currentName] = e.value[0].index; | ||
| 1276 | + this.$refs.uPicker.handleClear(); | ||
| 1277 | + } else { | ||
| 1278 | + this.defaultIndex[this.currentName] = e.indexs[0]; | ||
| 1279 | + } | ||
| 1124 | console.log("默认值", this.defaultIndex) | 1280 | console.log("默认值", this.defaultIndex) |
| 1125 | this.pickerShow = false; | 1281 | this.pickerShow = false; |
| 1126 | }, | 1282 | }, |
| @@ -1134,21 +1290,25 @@ | @@ -1134,21 +1290,25 @@ | ||
| 1134 | indexs | 1290 | indexs |
| 1135 | // 微信小程序无法将picker实例传出来，只能通过ref操作 | 1291 | // 微信小程序无法将picker实例传出来，只能通过ref操作 |
| 1136 | } = e | 1292 | } = e |
| 1137 | - console.log(e); | 1293 | + console.log("公司切换", e); |
| 1138 | // 当第一列值发生变化时，变化第二列(后一列)对应的选项 | 1294 | // 当第一列值发生变化时，变化第二列(后一列)对应的选项 |
| 1295 | + // this.gsChangeIndexs = [value[0].index,value[1].index,value[2].index]; | ||
| 1139 | let [regionIndex, groupIndex, companyIndex] = indexs; | 1296 | let [regionIndex, groupIndex, companyIndex] = indexs; |
| 1140 | if (columnIndex === 0) { | 1297 | if (columnIndex === 0) { |
| 1141 | this.gsName = value[0].label; | 1298 | this.gsName = value[0].label; |
| 1142 | - console.log(0, this.regionName) | 1299 | + // console.log(0, this.regionName) |
| 1143 | // this.regionName = this.regionName[index]?.children || []; | 1300 | // this.regionName = this.regionName[index]?.children || []; |
| 1144 | this.groupName = this.regionName[index]?.children || []; | 1301 | this.groupName = this.regionName[index]?.children || []; |
| 1145 | this.companyName = this.groupName[0]?.children || []; | 1302 | this.companyName = this.groupName[0]?.children || []; |
| 1146 | - console.log(1, this.regionName) | ||
| 1147 | - console.log(2, this.groupName) | ||
| 1148 | - console.log(3, this.companyName) | 1303 | + this.defaultRegion = this.regionName[index].label; |
| 1304 | + this.defaultGroup = this.groupName[0].label; | ||
| 1305 | + // console.log(1, this.regionName) | ||
| 1306 | + // console.log(2, this.groupName) | ||
| 1307 | + // console.log(3, this.companyName) | ||
| 1149 | this.$refs.gsPicker.setIndexs([index, 0, 0], true) | 1308 | this.$refs.gsPicker.setIndexs([index, 0, 0], true) |
| 1150 | } else if (columnIndex === 1) { | 1309 | } else if (columnIndex === 1) { |
| 1151 | this.gsName = value[1].label; | 1310 | this.gsName = value[1].label; |
| 1311 | + this.defaultGroup = this.regionName[index].label; | ||
| 1152 | this.groupName = this.regionName[index]?.children || []; | 1312 | this.groupName = this.regionName[index]?.children || []; |
| 1153 | this.companyName = this.groupName[0]?.children || []; | 1313 | this.companyName = this.groupName[0]?.children || []; |
| 1154 | this.$refs.gsPicker.setIndexs(indexs, true) | 1314 | this.$refs.gsPicker.setIndexs(indexs, true) |
| @@ -1159,20 +1319,7 @@ | @@ -1159,20 +1319,7 @@ | ||
| 1159 | // let data3 = data2[0].children; | 1319 | // let data3 = data2[0].children; |
| 1160 | // picker为选择器this实例，变化第二列对应的选项 | 1320 | // picker为选择器this实例，变化第二列对应的选项 |
| 1161 | // this.gsColumns = [this.regionName, data2, data3] | 1321 | // this.gsColumns = [this.regionName, data2, data3] |
| 1162 | - console.log("选择后", this.gsColumns); | ||
| 1163 | - }, | ||
| 1164 | - // 项目公司独立弹窗,防止共用报错 | ||
| 1165 | - gsConfirm(e) { | ||
| 1166 | - console.log("公司", e); | ||
| 1167 | - if (this.currentName === 'company') { | ||
| 1168 | - this.emptyFill(1); | ||
| 1169 | - this.model[this.currentName] = `${e.value[2].label}`; | ||
| 1170 | - this.model.regionName = e.value[0]?.value; | ||
| 1171 | - this.model.groupName = e.value[1]?.value; | ||
| 1172 | - this.model.companyName = e.value[2]?.label; | ||
| 1173 | - this.model.companyCode = e.value[2]?.value; | ||
| 1174 | - } | ||
| 1175 | - this.gsShow = false; | 1322 | + // console.log("选择后", this.gsColumns); |
| 1176 | }, | 1323 | }, |
| 1177 | // 设置默认省市区街道 | 1324 | // 设置默认省市区街道 |
| 1178 | handlePickValueDefault() { | 1325 | handlePickValueDefault() { |
uni_modules/uview-ui/components/u-picker/props.js
| @@ -10,6 +10,15 @@ export default { | @@ -10,6 +10,15 @@ export default { | ||
| 10 | type: Boolean, | 10 | type: Boolean, |
| 11 | default: uni.$u.props.picker.showToolbar | 11 | default: uni.$u.props.picker.showToolbar |
| 12 | }, | 12 | }, |
| 13 | + placeholder:{ | ||
| 14 | + type: String, | ||
| 15 | + default: '输入关键词可自动查询' | ||
| 16 | + }, | ||
| 17 | + // 是否展示顶部的搜索栏 | ||
| 18 | + showSearch: { | ||
| 19 | + type: Boolean, | ||
| 20 | + default: uni.$u.props.picker.showSearch | ||
| 21 | + }, | ||
| 13 | // 顶部标题 | 22 | // 顶部标题 |
| 14 | title: { | 23 | title: { |
| 15 | type: String, | 24 | type: String, |
uni_modules/uview-ui/components/u-picker/u-picker.vue
| @@ -14,6 +14,9 @@ | @@ -14,6 +14,9 @@ | ||
| 14 | @cancel="cancel" | 14 | @cancel="cancel" |
| 15 | @confirm="confirm" | 15 | @confirm="confirm" |
| 16 | ></u-toolbar> | 16 | ></u-toolbar> |
| 17 | + <u-search style="margin: 10px;" :showAction="false" v-model="keyword" @change="handleChange" | ||
| 18 | + @custom="handleCustom" :clearabled="true" :placeholder="placeholder" | ||
| 19 | + @clear="handleClear" v-if="showSearch"></u-search> | ||
| 17 | <picker-view | 20 | <picker-view |
| 18 | class="u-picker__view" | 21 | class="u-picker__view" |
| 19 | :indicatorStyle="`height: ${$u.addUnit(itemHeight)}`" | 22 | :indicatorStyle="`height: ${$u.addUnit(itemHeight)}`" |
| @@ -58,6 +61,7 @@ | @@ -58,6 +61,7 @@ | ||
| 58 | * @description 选择器 | 61 | * @description 选择器 |
| 59 | * @property {Boolean} show 是否显示picker弹窗（默认 false ） | 62 | * @property {Boolean} show 是否显示picker弹窗（默认 false ） |
| 60 | * @property {Boolean} showToolbar 是否显示顶部的操作栏（默认 true ） | 63 | * @property {Boolean} showToolbar 是否显示顶部的操作栏（默认 true ） |
| 64 | + * @property {Boolean} showToolbar 是否显示顶部的搜索栏（默认 false ） | ||
| 61 | * @property {String} title 顶部标题 | 65 | * @property {String} title 顶部标题 |
| 62 | * @property {Array} columns 对象数组，设置每一列的数据 | 66 | * @property {Array} columns 对象数组，设置每一列的数据 |
| 63 | * @property {Boolean} loading 是否显示加载中状态（默认 false ） | 67 | * @property {Boolean} loading 是否显示加载中状态（默认 false ） |
| @@ -90,6 +94,8 @@ export default { | @@ -90,6 +94,8 @@ export default { | ||
| 90 | innerColumns: [], | 94 | innerColumns: [], |
| 91 | // 上一次的变化列索引 | 95 | // 上一次的变化列索引 |
| 92 | columnIndex: 0, | 96 | columnIndex: 0, |
| 97 | + // 搜索关键词 | ||
| 98 | + keyword:"", | ||
| 93 | } | 99 | } |
| 94 | }, | 100 | }, |
| 95 | watch: { | 101 | watch: { |
| @@ -228,7 +234,17 @@ export default { | @@ -228,7 +234,17 @@ export default { | ||
| 228 | await uni.$u.sleep() | 234 | await uni.$u.sleep() |
| 229 | })() | 235 | })() |
| 230 | return this.innerColumns.map((item, index) => item[this.innerIndex[index]]) | 236 | return this.innerColumns.map((item, index) => item[this.innerIndex[index]]) |
| 231 | - } | 237 | + }, |
| 238 | + handleChange(e){ | ||
| 239 | + this.$emit("keywordChange",e) | ||
| 240 | + }, | ||
| 241 | + handleCustom(e){ | ||
| 242 | + this.$emit("keywordChange",e) | ||
| 243 | + }, | ||
| 244 | + handleClear(){ | ||
| 245 | + this.keyword = ""; | ||
| 246 | + this.$emit('clear') | ||
| 247 | + } | ||
| 232 | }, | 248 | }, |
| 233 | } | 249 | } |
| 234 | </script> | 250 | </script> |