修改小队
This commit is contained in:
parent
dfbb94c029
commit
e50e2f51f0
@ -17,7 +17,7 @@
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="left">
|
||||
<uni-icons type="location" color="#666666" size="13"></uni-icons>
|
||||
<uni-icons type="location" color="#666666" size="14"></uni-icons>
|
||||
<view class="location">区域:</view>
|
||||
</view>
|
||||
<view style="flex: 1;">{{company.address}}</view>
|
||||
|
@ -1,14 +1,30 @@
|
||||
<template>
|
||||
<view class="component">
|
||||
<view class="title">地区信息</view>
|
||||
|
||||
<u--form labelPosition="left" :model="formData" :rules="rules" ref="districtForm">
|
||||
<u-form-item v-if="datas && datas.street" label="村社" :required="!readonly" prop="village" @click="changeCity()" borderBottom>
|
||||
<u-form-item label="地址" :required="!readonly" prop="street" @click="changeCity('street')" borderBottom>
|
||||
<u--textarea :value="nowAddress" autoHeight readonly></u--textarea>
|
||||
</u-form-item>
|
||||
<u-form-item v-if="!formDataRead.street" label="乡镇" :required="!readonly" prop="street" @click="changeCity('street')" borderBottom>
|
||||
<u--input :value="formDataText.street" disabled disabledColor="#fff" placeholder="请选择镇"></u--input>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
</u-form-item>
|
||||
<u-form-item v-if="!formDataRead.village" label="村社" :required="!readonly" prop="village" @click="changeCity('village')" borderBottom>
|
||||
<u--input :value="formDataText.village" type="text" disabled disabledColor="#fff" placeholder="请选择村"></u--input>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
</u-form-item>
|
||||
<u-form-item label="小队" :required="!readonly" prop="brigade" @click="changeCity('brigade')" borderBottom>
|
||||
<u--input :value="formDataText.brigade" disabled disabledColor="#fff" placeholder="请选择小队"></u--input>
|
||||
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||
<u-form-item v-if="!formDataRead.brigade" label="小队" :required="!readonly" prop="brigade" borderBottom>
|
||||
<u-checkbox-group
|
||||
placement="row"
|
||||
@change="changeBrigade"
|
||||
>
|
||||
<view class="box">
|
||||
<view class="box_item" v-for="item in brigadeList" :key="item.id">
|
||||
<u-checkbox style="checkbox" :customStyle="{marginBottom: '12px',marginRight: '12px'}" activeColor="#3175f9" :label="item.brigade_name" :name="item.id"></u-checkbox>
|
||||
</view>
|
||||
</view>
|
||||
</u-checkbox-group>
|
||||
</u-form-item>
|
||||
</u--form>
|
||||
<u-picker :show="showProvince" :columns="[changeList()]" :keyName="changeType+'_name'" @confirm="confirm"
|
||||
@ -20,13 +36,13 @@
|
||||
import { commonProvince, commonCity, commonArea, commonStreet, commonVillage, commonBrigade } from "@/api/oaPbulic.js"
|
||||
import { Toast } from "../../libs/uniApi"
|
||||
export default {
|
||||
name:"districtSelector",
|
||||
props:{
|
||||
name: "districtSelector",
|
||||
props: {
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
datas:{
|
||||
datas: {
|
||||
type: Object,
|
||||
default: null
|
||||
}
|
||||
@ -35,78 +51,150 @@
|
||||
return {
|
||||
showProvince: false,
|
||||
formData: {
|
||||
province: '',
|
||||
city: '',
|
||||
area: '',
|
||||
street: '',
|
||||
village: '',
|
||||
brigade: '',
|
||||
},
|
||||
formDataText: {
|
||||
province: '',
|
||||
city: '',
|
||||
area: '',
|
||||
street: '',
|
||||
village: '',
|
||||
brigade: '',
|
||||
},
|
||||
rules:{
|
||||
formDataRead: {
|
||||
province: false,
|
||||
city: false,
|
||||
area: false,
|
||||
street: false,
|
||||
village: false,
|
||||
brigade: false,
|
||||
},
|
||||
rules: {
|
||||
street: {
|
||||
required: true,
|
||||
message: '不能为空',
|
||||
trigger: ['change', 'blur']
|
||||
},
|
||||
village: {
|
||||
required: true,
|
||||
message: '不能为空',
|
||||
trigger: ['change', 'blur']
|
||||
},
|
||||
brigade: {
|
||||
validator: (rule, value, callback )=>{
|
||||
value?callback():callback('不能为空')
|
||||
validator: (rule, value, callback) => {
|
||||
value ? callback() : callback('不能为空')
|
||||
},
|
||||
trigger: ['change', 'blur']
|
||||
},
|
||||
},
|
||||
streetList: [],
|
||||
villageList: [],
|
||||
brigadeList: [],
|
||||
changeType: '', //当前选择的城市类型
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
datas(newValue, oldValue) {
|
||||
if (this.$props.readonly && newValue) {
|
||||
this.formDataText.street = this.$props.datas.street_name;
|
||||
this.formDataText.village = this.$props.datas.village_name;
|
||||
this.formDataText.brigade = this.$props.datas.brigade_name;
|
||||
|
||||
this.formData.street = this.$props.datas.street_id;
|
||||
this.formData.village = this.$props.datas.village_id;
|
||||
this.formData.brigade = this.$props.datas.brigade_id;
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if(!this.$props.readonly) {
|
||||
if (!this.$props.readonly) {
|
||||
this.initProvinceAndCity();
|
||||
}else{
|
||||
} else {
|
||||
this.rules = {};
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
async validate(){
|
||||
computed:{
|
||||
nowAddress(){
|
||||
let address = this.$store.state.app.userInfo;
|
||||
let str = '';
|
||||
address.province_name?str+=address.province_name:null;
|
||||
address.city_name?str+=address.city_name:null;
|
||||
address.area_name?str+=address.area_name:null;
|
||||
address.street_name?str+=address.street_name:null;
|
||||
address.village_name?str+=address.village_name:null;
|
||||
return str;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async validate() {
|
||||
return await this.$refs.districtForm.validate();
|
||||
},
|
||||
// 初始化
|
||||
async initProvinceAndCity() {
|
||||
if(this.$store.state.app.userInfo.village)this.loadBrigade(this.$store.state.app.userInfo.village);
|
||||
else if(this.$store.state.app.userInfo?.street)this.loadVillage(this.$store.state.app.userInfo.street);
|
||||
let user = this.$store.state.app.userInfo;
|
||||
Object.keys(this.formData).forEach(key => {
|
||||
this.formData[key] = user[key];
|
||||
this.formDataText[key] = user[key + '_name'];
|
||||
if (user[key]&&key!='brigade') {
|
||||
this.formDataRead[key] = true;
|
||||
// 获取选择的列表
|
||||
switch (key) {
|
||||
case 'street':
|
||||
this.loadVillage(this.formData['street']);
|
||||
break;
|
||||
case 'village':
|
||||
this.loadBrigade(this.formData['village']);
|
||||
break;
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 选择城市
|
||||
changeCity(type) {
|
||||
if(this.$props.readonly)return ;
|
||||
if (type&&this[type + 'List'].length == 0) return Toast('请先选择上一级地区');
|
||||
if (this.$props.readonly) return;
|
||||
if (this[type + 'List'].length == 0) return Toast('请先选择上一级地区');
|
||||
this.changeType = type;
|
||||
this.showProvince = true;
|
||||
},
|
||||
// 多选小队
|
||||
changeBrigade(e){
|
||||
this.formData.brigade = e;
|
||||
},
|
||||
// 选择列表
|
||||
changeList() {
|
||||
return this[this.changeType + 'List'];
|
||||
},
|
||||
// 选中城市
|
||||
confirm(e) {
|
||||
let flag = false;//清空所选标记
|
||||
if(this.formData[this.changeType] != e.value[0][this.changeType + '_code'])flag = true;
|
||||
let flag = false; //清空所选标记
|
||||
if (this.formData[this.changeType] != e.value[0][this.changeType + '_code']) flag = true;
|
||||
if (this.changeType == 'brigade') {
|
||||
this.formData.brigade = e.value[0].id;
|
||||
this.formDataText.brigade = e.value[0].brigade_name;
|
||||
this.showProvince = false;
|
||||
return ;
|
||||
return;
|
||||
}
|
||||
this.formData[this.changeType] = e.value[0][this.changeType + '_code'];
|
||||
this.formDataText[this.changeType] = e.value[0][this.changeType + '_name'];
|
||||
// 加载下一级城市信息
|
||||
switch (this.changeType) {
|
||||
case 'area':
|
||||
this.loadStreet(this.formData['area']);
|
||||
break;
|
||||
case 'street':
|
||||
this.loadVillage(this.formData['street']);
|
||||
break;
|
||||
case 'village':
|
||||
this.loadBrigade(this.formData['village']);
|
||||
break;
|
||||
}
|
||||
// 清空之前所选信息
|
||||
if(flag) switch (this.changeType) {
|
||||
case 'province':
|
||||
this.formData.city = '';
|
||||
this.formDataText.city = ''
|
||||
case 'city':
|
||||
this.formData.area = '';
|
||||
this.formDataText.area = ''
|
||||
if (flag) switch (this.changeType) {
|
||||
case 'area':
|
||||
this.formData.street = '';
|
||||
this.formDataText.street = ''
|
||||
@ -119,6 +207,13 @@
|
||||
}
|
||||
this.showProvince = false;
|
||||
},
|
||||
loadStreet(code) {
|
||||
commonStreet({
|
||||
street: code
|
||||
}).then(res => {
|
||||
this.streetList = res.data;
|
||||
})
|
||||
},
|
||||
loadVillage(code) {
|
||||
commonVillage({
|
||||
village: code
|
||||
@ -138,20 +233,30 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.component{
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 34rpx;
|
||||
|
||||
&::before {
|
||||
width: 8rpx;
|
||||
height: 26rpx;
|
||||
border-radius: 4rpx;
|
||||
background-color: #3175f9;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 8rpx;
|
||||
.component {
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 34rpx;
|
||||
|
||||
&::before {
|
||||
width: 8rpx;
|
||||
height: 26rpx;
|
||||
border-radius: 4rpx;
|
||||
background-color: #3175f9;
|
||||
content: "";
|
||||
display: inline-block;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
}
|
||||
// .checkbox{
|
||||
// margin: 28rpx;
|
||||
// }
|
||||
.box{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
}
|
||||
}
|
||||
.u-checkbox-group--row[data-v-2ef8bac9]{
|
||||
flex: 1;
|
||||
}
|
||||
</style>
|
@ -46,7 +46,10 @@
|
||||
分管片区:
|
||||
</text>
|
||||
<view class="item">
|
||||
<view class="location">{{ item.city_name+item.area_name+item.street_name }}</view>
|
||||
<view class="location">
|
||||
<text>{{ item.street_name+item.village_name }}</text>
|
||||
<text v-for="brigade in item.brigade_name">{{ brigade.brigade_name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="company">
|
||||
@ -337,17 +340,18 @@
|
||||
|
||||
text {
|
||||
margin-right: 30rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.itm {
|
||||
width: 320rpx;
|
||||
white-space: nowrap;
|
||||
/* 不换行 */
|
||||
overflow: hidden;
|
||||
/* 将超出文本隐藏 */
|
||||
text-overflow: ellipsis;
|
||||
/* 使用省略号表示被隐藏的文本 */
|
||||
color: #000;
|
||||
// white-space: nowrap;
|
||||
// /* 不换行 */
|
||||
// overflow: hidden;
|
||||
// /* 将超出文本隐藏 */
|
||||
// text-overflow: ellipsis;
|
||||
// /* 使用省略号表示被隐藏的文本 */
|
||||
// color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -229,7 +229,14 @@
|
||||
computed:{
|
||||
nowAddress(){
|
||||
let address = this.$store.state.app.userInfo;
|
||||
return address.province_name+address.city_name+address.area_name+address.street_name+address.village_name+address.brigade_name;
|
||||
let str = '';
|
||||
address.province_name?str+=address.province_name:null;
|
||||
address.city_name?str+=address.city_name:null;
|
||||
address.area_name?str+=address.area_name:null;
|
||||
address.street_name?str+=address.street_name:null;
|
||||
address.village_name?str+=address.village_name:null;
|
||||
address.brigade_name?str+=address.brigade_name:null;
|
||||
return str;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
@ -103,23 +103,23 @@
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
account: '', //账号
|
||||
account: '17685151643', //账号
|
||||
password: '123456', //密码
|
||||
password_confirm: '', //确认密码
|
||||
// channel: 6, //注册渠道[1-微信小程序 2-微信公众号 3-手机H5 4-电脑PC 5-苹果APP 6-安卓APP]
|
||||
id_card: '',
|
||||
id_card: '522636199812121212',
|
||||
is_captain: '',// 队长标识
|
||||
sex: '',
|
||||
avatar: '',
|
||||
nickname: '',
|
||||
avatar: 'sdgdgxgxfxxxfg',
|
||||
nickname: 'dddd',
|
||||
address: '测试地址',
|
||||
qualification: {
|
||||
id_card: "",
|
||||
id_card_b: "",
|
||||
car_card: "",
|
||||
car_card_b: "",
|
||||
bank_account: "",
|
||||
bank_account_b: ""
|
||||
id_card: "sdgsdgds",
|
||||
id_card_b: "sdgdsgdsg",
|
||||
car_card: "sdgsd",
|
||||
car_card_b: "gsdgds",
|
||||
bank_account: "sdgdsgsd",
|
||||
bank_account_b: "sdgsdgdg"
|
||||
},
|
||||
},
|
||||
rules: {
|
||||
@ -228,7 +228,7 @@
|
||||
title: "添加成功",
|
||||
success: () => {
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
// uni.navigateBack()
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
|
Loading…
x
Reference in New Issue
Block a user