kubbo/dvcp_v2_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BUG 30003

Browse Source
This commit is contained in:
aixianling
2022-06-06 11:22:15 +08:00
parent 34dd2fcbcc
commit 94331d6ba0
9 changed files with 274 additions and 322 deletions
Download Patch File Download Diff File Expand all files Collapse all files

289
project/grid/AppGridMember/components/add.vue
View File

@@ -6,22 +6,24 @@
</template>
<template #content>
<el-form
ref="rules"
:model="forms"
:rules="formRules"
size="small"
label-suffix="："
label-width="136px">
<ai-card title="基础信息" >
<template #right v-if="title=='网格员详情'">
ref="rules"
:model="forms"
:rules="formRules"
size="small"
label-suffix="："
label-width="136px">
<ai-edit-card
<ai-card title="基础信息">
<template #right v-if="title=='网格员详情'">
<span style="color:#2266FF;cursor: pointer;font-size: 12px;" class="iconfont iconEdit" v-if="editOne==false" @click="editOne=true">修改</span>
<span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editOne==true" @click="searchDetail(),editOne=false">取消</span>
<span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editOne==true"
@click="searchDetail(),editOne=false">取消</span>
<span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editOne==true" @click="save()">保存</span>
</template>
<template slot="content">
<div class="above" v-if="editOne==true">
<div class="left">
<el-form-item label="网格员姓名" prop="name" >
<el-form-item label="网格员姓名" prop="name">
<el-input v-model="forms.name" placeholder="请选择网格员" disabled>
<template #append>
<ai-wechat-selecter :isMultiple="false" refs="addTags" :instance="instance" v-model="users" @change="getSelectPerson">
@@ -30,30 +32,30 @@
</template>
</el-input>
</el-form-item>
<el-form-item label="选用日期" prop="selectionDate" >
<el-form-item label="选用日期" prop="selectionDate">
<el-date-picker
v-model="forms.selectionDate"
type="date"
style="width: 100%"
value-format="yyyy-MM-dd"
size="medium"
placeholder="选择日期">
v-model="forms.selectionDate"
type="date"
style="width: 100%"
value-format="yyyy-MM-dd"
size="medium"
placeholder="选择日期">
</el-date-picker>
</el-form-item>
<el-form-item label="身份证号" prop="idNumber" >
<el-input v-model="forms.idNumber" placeholder="请输入…" maxlength="18" show-word-limit></el-input>
<el-form-item label="身份证号" prop="idNumber">
<el-input v-model="forms.idNumber" placeholder="请输入…" maxlength="18" show-word-limit></el-input>
</el-form-item>
</div>
<div class="right">
<el-form-item label="照片" prop="photo">
<!-- <ai-uploader :instance="instance" v-model="photoList" :limit="1" @change="photoChange"></ai-uploader> -->
<ai-avatar :instance="instance" v-model="forms.photo"/>
<ai-avatar :instance="instance" v-model="forms.photo"/>
</el-form-item>
</div>
</div>
<div class="above" v-if="editOne==true">
<div class="left">
<el-form-item label="出生日期" prop="birthday" >
<el-form-item label="出生日期" prop="birthday">
<el-date-picker
v-model="forms.birthday"
type="date"
@@ -63,70 +65,72 @@
placeholder="选择日期">
</el-date-picker>
</el-form-item>
<el-form-item label="联系电话" prop="phone" >
<el-form-item label="联系电话" prop="phone">
<el-input v-model.number="forms.phone" placeholder="请输入…" maxlength="11" show-word-limit></el-input>
</el-form-item>
</div>
<div class="right">
<el-form-item label="性别" prop="sex" >
<el-form-item label="性别" prop="sex">
<el-select size="medium" style="width: 100%" v-model="forms.sex" placeholder="请选择..." clearable>
<el-option
v-for="(item,i) in dict.getDict('sex')"
:key="i"
:label="item.dictName"
:value="item.dictValue"
v-for="(item,i) in dict.getDict('sex')"
:key="i"
:label="item.dictName"
:value="item.dictValue"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="电子邮箱" prop="mail" >
<el-input v-model="forms.mail" placeholder="请输入…"></el-input>
<el-form-item label="电子邮箱" prop="mail">
<el-input v-model="forms.mail" placeholder="请输入…"></el-input>
</el-form-item>
</div>
</div>
<template v-if="editOne==false">
<template v-if="editOne==false">
<div class="above">
<div class="left">
<ai-wrapper label-width="120px" :columnsNumber="1" style="margin-top: 16px;">
<ai-info-item label="网格员姓名："><span >{{forms.name}}</span></ai-info-item>
<ai-info-item label="选用日期："><span >{{forms.selectionDate}}</span></ai-info-item>
<ai-info-item label="身份证号："><span >{{forms.idNumber}}</span></ai-info-item>
<ai-info-item label="性别："><span >{{dict.getLabel('sex', forms.sex)}}</span></ai-info-item>
<ai-info-item label="出生日期："><span >{{forms.birthday}}</span></ai-info-item>
<ai-info-item label="电子邮箱："><span >{{forms.mail}}</span></ai-info-item>
<ai-wrapper label-width="120px" :columnsNumber="1" style="margin-top: 16px;">
<ai-info-item label="网格员姓名："><span>{{ forms.name }}</span></ai-info-item>
<ai-info-item label="选用日期："><span>{{ forms.selectionDate }}</span></ai-info-item>
<ai-info-item label="身份证号："><span>{{ forms.idNumber }}</span></ai-info-item>
<ai-info-item label="性别："><span>{{ dict.getLabel('sex', forms.sex) }}</span></ai-info-item>
<ai-info-item label="出生日期："><span>{{ forms.birthday }}</span></ai-info-item>
<ai-info-item label="电子邮箱："><span>{{ forms.mail }}</span></ai-info-item>
</ai-wrapper>
</div>
<div class="right">
<ai-wrapper label-width="120px" :columnsNumber="1" style="margin-top: 16px;">
<ai-wrapper label-width="120px" :columnsNumber="1" style="margin-top: 16px;">
<ai-info-item label="照片：" v-if="forms.photo">
<span >
<span>
<ai-uploader :instance="instance" v-model="photoList" disabled :limit="1" @change="photoChange"></ai-uploader>
</span>
</ai-info-item>
<ai-info-item label="联系电话："><span >{{forms.phone}}</span></ai-info-item>
<ai-info-item label="联系电话："><span>{{ forms.phone }}</span></ai-info-item>
</ai-wrapper>
</div>
</div>
</template>
</template>
</ai-card>
<ai-card title="关联信息" >
<template #right v-if="title=='网格员详情'">
<ai-card title="关联信息">
<template #right v-if="title=='网格员详情'">
<span style="color:#2266FF;cursor: pointer;font-size: 12px;" class="iconfont iconEdit" v-if="editTwo==false" @click="editTwo=true">修改</span>
<span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editTwo==true" @click="searchDetail(),editTwo=false">取消</span>
<span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editTwo==true"
@click="searchDetail(),editTwo=false">取消</span>
<span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="editTwo==true" @click="save()">保存</span>
</template>
<template slot="content">
<template v-if="editTwo==true">
<el-form-item label="责任网格" prop="girdInfoList" style="margin-top: 8px;">
<el-form-item style="width: 100%" label-width="80px" :label="'网格' + (index + 1)" v-for="(item, index) in forms.girdInfoList" :key="'选项' + (index + 1)">
<el-form-item style="width: 100%" label-width="80px" :label="'网格' + (index + 1)" v-for="(item, index) in forms.girdInfoList"
:key="'选项' + (index + 1)">
<div class="form-flex">
<el-select v-model="item.checkType" placeholder="请选择网格角色">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-input disabled v-model="item.girdName" :maxlength="200" size="small" placeholder="请选择责任网格">
@@ -142,13 +146,13 @@
</el-form-item>
<div class="above">
<div class="left">
<el-form-item label="是否特殊网格员" prop="isGirdMember" >
<el-form-item label="是否特殊网格员" prop="isGirdMember">
<el-radio-group v-model="forms.isGirdMember">
<el-radio label="0">否</el-radio>
<el-radio label="1">是</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="政治面貌" prop="politicsStatus" >
<el-form-item label="政治面貌" prop="politicsStatus">
<el-select v-model="forms.politicsStatus" size="small" style="width: 100%" placeholder="请选择..." clearable>
<el-option v-for="(item,i) in dict.getDict('politicsStatus')" :key="i" :label="item.dictName" :value="item.dictValue"></el-option>
</el-select>
@@ -160,31 +164,31 @@
<el-option v-for="(item,i) in dict.getDict('girdMemberType')" :key="i" :label="item.dictName" :value="item.dictValue"></el-option>
</el-select>
</el-form-item>
<el-form-item label="学历" prop="education" >
<el-form-item label="学历" prop="education">
<el-select v-model="forms.education" style="width: 100%" size="small" placeholder="请选择..." clearable>
<el-option v-for="(item,i) in dict.getDict('education')" :key="i" :label="item.dictName" :value="item.dictValue"></el-option>
</el-select>
</el-form-item>
</div>
</div>
<el-form-item label="个人简介" prop="introduction" >
<el-form-item label="个人简介" prop="introduction">
<el-input
type="textarea"
maxlength="200"
show-word-limit
:rows="4"
placeholder="请输入内容"
v-model="forms.introduction">
type="textarea"
maxlength="200"
show-word-limit
:rows="4"
placeholder="请输入内容"
v-model="forms.introduction">
</el-input>
</el-form-item>
<el-form-item label="人生格言" prop="motto" >
<el-form-item label="人生格言" prop="motto">
<el-input
type="textarea"
maxlength="200"
show-word-limit
:rows="4"
placeholder="请输入内容"
v-model="forms.motto">
type="textarea"
maxlength="200"
show-word-limit
:rows="4"
placeholder="请输入内容"
v-model="forms.motto">
</el-input>
</el-form-item>
</template>
@@ -194,39 +198,40 @@
<ai-info-item label="是否特殊网格员：">
<span>{{ !forms.isGirdMember ? '-' : forms.isGirdMember === '0' ? '否' : '是' }}</span>
</ai-info-item>
<ai-info-item label="特殊网格员：" v-if="forms.isGirdMember==1"><span >{{dict.getLabel('girdMemberType', forms.girdMemberType)}}</span></ai-info-item>
<ai-info-item label="政治面貌："><span >{{dict.getLabel('politicsStatus', forms.politicsStatus)}}</span></ai-info-item>
<ai-info-item label="学历："><span >{{dict.getLabel('education', forms.education)}}</span></ai-info-item>
<ai-info-item label="人生格言：" style="width: 100%;"><span >{{forms.motto}}</span></ai-info-item>
<ai-info-item label="个人简介：" style="width: 100%;"><span >{{forms.introduction}}</span></ai-info-item>
<ai-info-item label="特殊网格员：" v-if="forms.isGirdMember==1"><span>{{ dict.getLabel('girdMemberType', forms.girdMemberType) }}</span>
</ai-info-item>
<ai-info-item label="政治面貌："><span>{{ dict.getLabel('politicsStatus', forms.politicsStatus) }}</span></ai-info-item>
<ai-info-item label="学历："><span>{{ dict.getLabel('education', forms.education) }}</span></ai-info-item>
<ai-info-item label="人生格言：" style="width: 100%;"><span>{{ forms.motto }}</span></ai-info-item>
<ai-info-item label="个人简介：" style="width: 100%;"><span>{{ forms.introduction }}</span></ai-info-item>
</ai-wrapper>
</template>
</template>
</ai-card>
</el-form>
<ai-dialog title="选择网格" :visible.sync="showGrid" :customFooter="true" :destroyOnClose="true" border width="720px">
<ai-dialog title="选择网格" :visible.sync="showGrid" :customFooter="true" :destroyOnClose="true" border width="720px">
<div class="grid">
<el-tree
:data="treeObj.treeList"
:props="treeObj.defaultProps"
node-key="id"
ref="tree"
:check-strictly="true"
show-checkbox
:default-checked-keys="currCheckedKeys"
default-expand-all
@check="onCheckChange">
:data="treeObj.treeList"
:props="treeObj.defaultProps"
node-key="id"
ref="tree"
:check-strictly="true"
show-checkbox
:default-checked-keys="currCheckedKeys"
default-expand-all
@check="onCheckChange">
</el-tree>
</div>
<div class="dialog-footer" slot="footer" >
<el-button size="medium" @click="showGrid=false">取消</el-button>
<el-button type="primary" size="medium" @click="getCheckedTree()">确认</el-button>
<div class="dialog-footer" slot="footer">
<el-button size="medium" @click="showGrid=false">取消</el-button>
<el-button type="primary" size="medium" @click="getCheckedTree()">确认</el-button>
</div>
</ai-dialog>
</template>
<template #footer v-if="title=='添加网格员'">
<el-button @click="cancel(false)" class="delete-btn footer-btn" >取 消</el-button>
<el-button type="primary" @click="save()" class="footer-btn">提 交</el-button>
<el-button @click="cancel(false)" class="delete-btn footer-btn">取 消</el-button>
<el-button type="primary" @click="save()" class="footer-btn">提 交</el-button>
</template>
</ai-detail>
</section>
@@ -239,7 +244,6 @@ export default {
instance: Function,
dict: Object,
permissions: Function,
params: Object,
},
data() {
return {
@@ -290,7 +294,7 @@ export default {
},
created() {
this.beforeSelectTree()
if (this.params.id) {
if (this.$route.query.id) {
this.searchDetail();
this.title = "网格员详情";
this.editOne = false;
@@ -302,7 +306,7 @@ export default {
}
},
computed: {
currCheckedKeys () {
currCheckedKeys() {
if (this.forms && this.forms.girdInfoList && this.forms.girdInfoList[this.currIndex] && this.forms.girdInfoList[this.currIndex].id) {
return [this.forms.girdInfoList[this.currIndex].id]
}
@@ -324,14 +328,14 @@ export default {
};
return {
name: [
{ required: true, message: "请输入网格员姓名", trigger: "change" },
{required: true, message: "请输入网格员姓名", trigger: "change"},
],
selectionDate: [
{ required: true, message: "请选择选用日期", trigger: "change" },
{required: true, message: "请选择选用日期", trigger: "change"},
],
phone: [{ required: true, validator: phonePass, trigger: "blur" }],
phone: [{required: true, validator: phonePass, trigger: "blur"}],
girdInfoList: [
{ required: true, message: "请选择责任网络", trigger: "change" },
{required: true, message: "请选择责任网络", trigger: "change"},
],
mail: [
{
@@ -344,14 +348,14 @@ export default {
},
},
methods: {
cancel (isRefresh) {
cancel(isRefresh) {
this.$emit('change', {
type: 'list',
isRefresh: !!isRefresh,
})
},
onCheckChange (e) {
onCheckChange(e) {
this.$nextTick(() => {
this.$refs.tree.getCheckedKeys().forEach(v => {
this.$refs.tree.setChecked(v, false)
@@ -360,11 +364,11 @@ export default {
})
},
removeGrid (index) {
removeGrid(index) {
this.forms.girdInfoList.splice(index, 1)
},
addGrid () {
addGrid() {
this.forms.girdInfoList.push({
id: '',
girdName: '',
@@ -375,7 +379,7 @@ export default {
this.forms.photo = val[0].url;
},
getSelectPerson(val) {
if(val.length){
if (val.length) {
this.forms.name = val[0].name;
this.forms.phone = val[0].phone;
this.forms.userId = val[0].sysUserId
@@ -428,7 +432,7 @@ export default {
}
}
this.instance.post(`/app/appgirdmemberinfo/addOrUpdate`,{
this.instance.post(`/app/appgirdmemberinfo/addOrUpdate`, {
...this.forms,
girdInfoListStr: this.forms.girdInfoList.map(v => v.girdName).join(',')
}).then((res) => {
@@ -448,31 +452,30 @@ export default {
});
},
searchDetail() {
this.instance
.post(`/app/appgirdmemberinfo/queryDetailById`, null, {
params: { id: this.params.id },
})
.then((res) => {
if (res.code == 0) {
this.forms = {
...res.data,
girdInfoList: res.data.girdInfoList || []
};
this.users = [{
name: res.data.name,
phone: res.data.phone,
userId: res.data.id,
id: res.data.wxUserId
}]
this.girdInfoStr = ''
this.photoList = [{ url: this.forms.photo }];
if (res.data.girdInfoList) {
res.data.girdInfoList.forEach((e) => {
this.girdInfoStr = this.girdInfoStr + `${e.checkType === '1' ? '网格员' : '网格长'}-${e.girdName}&emsp;`
})
}
let {id} = this.$route.query
this.instance.post(`/app/appgirdmemberinfo/queryDetailById`, null, {
params: {id}
}).then((res) => {
if (res.code == 0) {
this.forms = {
...res.data,
girdInfoList: res.data.girdInfoList || []
};
this.users = [{
name: res.data.name,
phone: res.data.phone,
userId: res.data.id,
id: res.data.wxUserId
}]
this.girdInfoStr = ''
this.photoList = [{url: this.forms.photo}];
if (res.data.girdInfoList) {
res.data.girdInfoList.forEach((e) => {
this.girdInfoStr = this.girdInfoStr + `${e.checkType === '1' ? '网格员' : '网格长'}-${e.girdName}&emsp;`
})
}
});
}
});
},
},
};
@@ -482,26 +485,28 @@ export default {
.add {
height: 100%;
.form-flex {
display: flex;
align-items: center;
.form-flex {
display: flex;
align-items: center;
& > .el-button {
margin-left: 20px;
}
.el-input {
width: 300px;
margin-left: 20px;
}
::v-deep .el-form-item__content {
margin-left: 0!important;
}
& > .el-button {
margin-left: 20px;
}
.el-input {
width: 300px;
margin-left: 20px;
}
::v-deep .el-form-item__content {
margin-left: 0 !important;
}
}
.ai-detail__title {
background-color: #fff;
}
.ai-detail__content {
.ai-detail__content--wrapper {
.el-form {
@@ -511,9 +516,11 @@ export default {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.el-form-item {
width: 48%;
}
.buildingTypes {
width: 100%;
}
@@ -521,16 +528,20 @@ export default {
}
}
}
::v-deep .el-tag {
margin-right: 8px;
color: #333333;
}
.footer-btn {
width: 92px;
}
.above{
.above {
display: flex;
.left, .right{
.left, .right {
flex: 1;
}
}