zhxg/zhxg_app_v1.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

移动端V1.0

Browse Source
This commit is contained in:
18154758993
2025-07-16 15:34:34 +08:00
commit 194b0750fd
1083 changed files with 178295 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
uni_modules/address-picker/changelog.md Normal file
View File

@@ -0,0 +1,25 @@
## 1.1.1（2024-01-05）
添加监听，优化网络请求返回数据不回显
## 1.1.0（2023-09-25）
修改数据回显的bug
## 1.0.9（2023-07-11）
感谢评论区小伙伴的纠正，粗心把indexPop写成indexsPop了，已修改，欢迎大家进入群聊一起摸鱼，也可以一起学习进步
## 1.0.8（2023-07-06）
修复评论区719***@qq.com小伙伴提出的问题，增加了参数默认值
## 1.0.7（2023-07-04）
新增根据type选择省、省市、省市区，修复历史遗留bug
## 1.0.6（2023-07-04）
新增根据type选择省、省市、省市区，修复历史遗留bug
## 1.0.5（2023-04-29）
新增选择器根据地区Id和地区索引回显，优先级addressData > indexs > areaId
## 1.0.4（2023-04-09）
返回了地址id，可以将地址id存到数据库，地址回显时使用地址索引
不会使用可以咨询我，2375659037@qq.com
## 1.0.3（2022-12-18）
三级联动地区选择器，根据uView的picker选择器二次封装，所以使用时记得安装uVIew和scss
## 1.0.2（2022-12-18）
三级联动地区选择器，根据uView的picker选择器二次封装，所以使用时记得安装uVIew和scss
## 1.0.1（2022-12-18）
基于uView封装的地区选择器，内置了地区数据，只在vue2的微信小程序做了测试，所以其余平台全部是X
## 1.0.0（2022-12-18）
基于uView封装的地区选择器，内置了地区数据，只在vue2的微信小程序做了测试，所以其余平台全部是X

261
uni_modules/address-picker/components/address-picker/address-picker.vue Normal file
View File

@@ -0,0 +1,261 @@
<template>
<view class="">
<u-picker :show="show" ref="uPicker" :title="title" :showToolbar="showToolbar" :itemHeight="itemHeight"
:cancelText="cancelText" :cancelColor="cancelColor" :confirmText="confirmText" :confirmColor="confirmColor"
:loading="loading" :visibleItemCount="visibleItemCount" :defaultIndex="indexPop" :columns="columns"
:closeOnClickOverlay="closeOnClickOverlay" @confirm="confirm" @close="close" @cancel="cancel"
@change="changeHandler">
</u-picker>
</view>
</template>
<script>
import area from "../../province-city-county.json"
export default {
props: {
show: {
type: Boolean,
default: () => false
},
title: {
type: String,
default: () => ""
},
showToolbar: {
type: Boolean,
default: () => true
},
itemHeight: {
type: [String, Number],
default: () => 44
},
cancelText: {
type: String,
default: () => "取消"
},
closeOnClickOverlay: {
type: Boolean,
default: () => false
},
cancelColor: {
type: String,
default: () => "#909193"
},
confirmText: {
type: String,
default: () => "确认"
},
confirmColor: {
type: String,
default: () => "#3c9cff"
},
visibleItemCount: {
type: [String, Number],
default: () => 5
},
loading: {
type: Boolean,
default: () => false
},
type: {
type: Number,
default: () => 3
},
indexs: {
type: Array,
default: () => [0, 0, 0],
},
areaId: {
type: Array,
default: () => [1, 110000, 110101],
},
addressData: {
type: Array,
default: () => ['北京市', '北京市', '东城区'],
},
},
data() {
return {
columns: [],
province: [],
city: [],
area: [],
indexPop:[]
}
},
mounted() {
this.formatData()
},
watch:{
addressData: 'formatData',
indexs: 'formatData',
areaId:'formatData',
},
methods: {
changeHandler(e) {
const {
columnIndex,
value,
values, // values为当前变化列的数组内容
indexs,
picker = this.$refs.uPicker
} = e
switch (this.type) {
case 1:
break;
case 2:
if (columnIndex === 0) {
picker.setColumnValues(1, this.city[indexs[0]].map(v => v.name))
}
break;
default:
if (columnIndex === 0) {
picker.setColumnValues(1, this.city[indexs[0]].map(v => v.name))
picker.setColumnValues(2, this.area[indexs[0]][0].map(v => v.name))
}
if (columnIndex === 1) {
picker.setColumnValues(2, this.area[indexs[0]][indexs[1]].map(v => v.name))
}
}
},
formatData() {
this.indexPop = this.indexs
this.province = area.map(t => {
return {
name: t.name,
areaId: t.areaId
}
})
this.city = area.map(t => t.children.map(v => {
return {
name: v.name,
areaId: v.areaId
}
}))
this.area = area.map(t => t.children.map(v => v.children.map(i => {
return {
name: i.name,
areaId: i.areaId
}
})))
switch (this.type) {
case 1:
this.columns = [
this.province.map(res => res.name),
];
this.type1()
break;
case 2:
this.columns = [
this.province.map(res => res.name),
this.city[0].map(res => res.name),
]
this.type2()
break;
default:
//默认显示数据
this.columns = [
this.province.map(res => res.name),
this.city[0].map(res => res.name),
this.area[0][0].map(res => res.name)
]
this.type3()
}
},
type1() {
//数据回显
if (this.addressData.length > 0) {
//省索引
let pIdx = this.province.findIndex(v => v.name == this.addressData[0]);
this.indexPop = [pIdx];
} else if (this.areaId.length > 0) {
//省索引
let pIdx = this.province.findIndex(v => v.areaId === this.areaId[0]);
this.indexPop = [pIdx];
}
},
type2() {
//数据回显
if (this.addressData.length > 0) {
//省索引
let pIdx = this.province.findIndex(v => v.name == this.addressData[0]);
//根据省索引设置默认市数据
this.columns[1] = this.city[pIdx].map(res => res.name)
//市索引
let cIdx = this.city[pIdx].findIndex(v => v.name == this.addressData[1]);
this.indexPop = [pIdx, cIdx];
} else if (this.indexPop.length > 0) {
this.columns[1] = this.city[this.indexPop[0]].map(res => res.name)
} else if (this.areaId.length > 0) {
//省索引
let pIdx = this.province.findIndex(v => v.areaId === this.areaId[0]);
//根据省索引设置默认市数据
this.columns[1] = this.city[pIdx].map(res => res.name)
//市索引
let cIdx = this.city[pIdx].findIndex(v => v.areaId == this.areaId[1]);
this.indexPop = [pIdx, cIdx];
}
},
type3() {
//数据回显
if (this.addressData.length > 0) {
//省索引
let pIdx = this.province.findIndex(v => v.name == this.addressData[0]);
//根据省索引设置默认市数据
this.columns[1] = this.city[pIdx].map(res => res.name)
//市索引
let cIdx = this.city[pIdx].findIndex(v => v.name == this.addressData[1]);
//根据市索引设置默认区数据
this.columns[2] = this.area[pIdx][cIdx].map(res => res.name)
//区索引
let aIdx = this.area[pIdx][cIdx].findIndex(v => v.name == this.addressData[2]);
this.indexPop = [pIdx, cIdx, aIdx];
} else if (this.indexPop.length > 0) {
this.columns[1] = this.city[this.indexPop[0]].map(res => res.name)
this.columns[2] = this.area[this.indexPop[0]][this.indexPop[1]].map(res => res.name)
} else if (this.areaId.length > 0) {
//省索引
let pIdx = this.province.findIndex(v => v.areaId === this.areaId[0]);
//根据省索引设置默认市数据
this.columns[1] = this.city[pIdx].map(res => res.name)
//市索引
let cIdx = this.city[pIdx].findIndex(v => v.areaId == this.areaId[1]);
//根据市索引设置默认区数据
this.columns[2] = this.area[pIdx][cIdx].map(res => res.name)
//区索引
let aIdx = this.area[pIdx][cIdx].findIndex(v => v.areaId == this.areaId[2]);
this.indexPop = [pIdx, cIdx, aIdx];
}
},
confirm(e) {
let provinceId,cityId,districtId
switch (this.type) {
case 1:
provinceId = area[e.indexs[0]].areaId;
e.areaId = [provinceId]
e.indexs = e.indexs.slice(0,1)
break;
case 2:
provinceId = area[e.indexs[0]].areaId;
cityId = area[e.indexs[0]].children[e.indexs[1]].areaId;
e.areaId = [provinceId, cityId]
e.indexs = e.indexs.slice(0,2)
break;
default:
provinceId = area[e.indexs[0]].areaId;
cityId = area[e.indexs[0]].children[e.indexs[1]].areaId;
districtId = area[e.indexs[0]].children[e.indexs[1]].children[e.indexs[2]].areaId;
e.areaId = [provinceId, cityId, districtId]
}
this.$emit("confirm", e)
},
close() {
this.$emit("close")
},
cancel() {
this.$emit("cancel")
}
}
}
</script>
<style>
</style>

85
uni_modules/address-picker/package.json Normal file
View File

@@ -0,0 +1,85 @@
{
"id": "address-picker",
"displayName": "三级联动地区选择器，address-picker，包含港澳台",
"version": "1.1.1",
"description": "三级联动地区选择器，根据uView的picker选择器二次封装，所以使用时记得安装uVIew和scss",
"keywords": [
"address-picker",
"address",
"picker",
"地区",
"地区选择器"
],
"repository": "",
"engines": {
"HBuilderX": "^3.5.0"
},
"dcloudext": {
"type": "component-vue",
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "插件不采集任何数据",
"permissions": "无"
},
"npmurl": ""
},
"uni_modules": {
"dependencies": [],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"Vue": {
"vue2": "y",
"vue3": "u"
},
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y",
"钉钉": "y",
"快手": "y",
"飞书": "y",
"京东": "y"
},
"快应用": {
"华为": "y",
"联盟": "y"
}
}
}
}
}

22686
uni_modules/address-picker/province-city-county.json Normal file
View File

File diff suppressed because it is too large Load Diff

56
uni_modules/address-picker/readme.md Normal file
View File

@@ -0,0 +1,56 @@
# address-picker：基于uView的地区选择器组件
支持省市区三级联动，支持省，省市，省市区的选择，支持通过地区名、索引和地区id回显数据（优先级：地区名>索引>地区id）,欢迎加入摸鱼交流群：469187546,一起来摸鱼啊🚀
直接下载插件导入hbuilder后可直接使用,下载示例项目解读会更加清晰
```html
<template>
<view class="content">
<u-form>
<u-form-item label="地址" prop="address" @click="addressShow = true;">
<u--input v-model="address" disabled disabledColor="#ffffff" border="none"
placeholder='请输入家庭地址'></u--input>
</u-form-item>
</u-form>
<address-picker :show="addressShow" closeOnClickOverlay @confirm='confirmAddress' @cancel='addressShow=false'
@close='addressShow = false' :address-data="addressData" :indexs="indexs" :areaId="areaId" :type="type"></address-picker>
</view>
</template>
```
通过传入type控制选择器，1：省，2：省市，3：省市区
```javascript
<script>
export default {
data() {
return {
address: '',
addressShow: false,
indexs: [0, 0, 0],
areaId: [1, 110000, 110101],
addressData: ['北京市', '北京市', '东城区'],
type: 3, //1-省，2-省市，3-省市区
}
},
onLoad() {
},
methods: {
confirmAddress(val) {
console.log(val);
this.address = val.value.join('')
this.addressShow = false
}
}
}
</script>
```
使用的uView的picker组件二次封装，所以props和方法都和picker组件一样，看不懂的可以去[picker组件查看](https://www.uviewui.com/components/picker.html)
![https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/d2ce6dd2894c4539a4cb6a9ada0319d0~tplv-k3u1fbpfcp-watermark.image?](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/d2ce6dd2894c4539a4cb6a9ada0319d0~tplv-k3u1fbpfcp-watermark.image?)
![https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/acc5ac565eb342ccb2ed7eb54cdf0d21~tplv-k3u1fbpfcp-watermark.image?](https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/acc5ac565eb342ccb2ed7eb54cdf0d21~tplv-k3u1fbpfcp-watermark.image?)