无等级网格版合并
| @@ -1,42 +1,31 @@ | ||||
| <template> | ||||
|   <div class="AddGird"> | ||||
|     <div class="item-flex"> | ||||
|       <div class="label"> | ||||
|         <span class="tips">*</span>网格名称 | ||||
|       </div> | ||||
|       <div class="value"> | ||||
|         <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="form.girdName" maxlength="50" /> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="item-flex"> | ||||
|       <div class="label"> | ||||
|         <span class="tips"></span>网格长 | ||||
|       </div> | ||||
|       <div class="value" @click="toAddUser('manage')"> | ||||
|          | ||||
|         <span v-if="form.girdMemberManageList && form.girdMemberManageList.length"> | ||||
|           <span v-for="(item, index) in form.girdMemberManageList" :key="index"><span v-if="index>0">,</span>{{item.name}}</span> | ||||
|         </span> | ||||
|         <span style="color:#999;" v-else>请选择</span> | ||||
|         <img src="./components/img/right-icon.png" alt="" /></div> | ||||
|     </div> | ||||
|     <div class="item-flex" v-if="form.girdLevel == 2"> | ||||
|       <div class="label"> | ||||
|         <span class="tips"></span>网格员 | ||||
|       </div> | ||||
|       <div class="value" @click="toAddUser('Member')"> | ||||
|         <span v-if="form.girdMemberList && form.girdMemberList.length"> | ||||
|           <span v-for="(item, index) in form.girdMemberList" :key="index"><span v-if="index>0">,</span>{{item.name}}</span> | ||||
|         </span> | ||||
|         <span style="color:#999;" v-else>请选择</span> | ||||
|         <img src="./components/img/right-icon.png" alt="" /> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="footer" @click="confirm">确认添加</div> | ||||
|     <AiGroup> | ||||
|       <AiItem label="网格名称" required> | ||||
|         <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="form.girdName" | ||||
|                  maxlength="50"/> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <AiGroup> | ||||
|       <AiItem label="网格长" topLabel> | ||||
|         <AiPagePicker type="sysUser" :selected.sync="form.girdMemberManageList" action="/app/wxcp/wxuser/list?status=1" nodeKey="id"> | ||||
|           <AiMore :value="getArrayLabel(form.girdMemberManageList)"/> | ||||
|         </AiPagePicker> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <AiGroup> | ||||
|       <AiItem label="网格员" topLabel> | ||||
|         <AiPagePicker type="sysUser" :selected.sync="form.girdMemberList" action="/app/wxcp/wxuser/list?status=1" nodeKey="id"> | ||||
|           <AiMore :value="getArrayLabel(form.girdMemberList)"/> | ||||
|         </AiPagePicker> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <div class="footer" @click="$u.debounce(confirm)">{{ fromType == 'add' ? '确认添加' : '确认修改' }}</div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|  | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
| @@ -45,100 +34,72 @@ export default { | ||||
|         girdMemberManageList: [], | ||||
|         girdMemberList: [] | ||||
|       }, | ||||
|       detailInfo: {}, | ||||
|       fromType: 'add', //add新增 edit编辑, | ||||
|       addUserType: 'manage', //manage网格长 Member管理员 | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.id = option.id | ||||
|     this.fromType = option.fromType | ||||
|     this.getDetail() | ||||
|     uni.$on('selectUser', res => { | ||||
|       if(this.addUserType == 'manage') { | ||||
|         this.form.girdMemberManageList = res | ||||
|       }else { | ||||
|         this.form.girdMemberList = res | ||||
|       } | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '添加网格' | ||||
|     if (this.fromType == 'add') { | ||||
|       document.title = '添加网格' | ||||
|     } else { | ||||
|       document.title = '编辑网格' | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     getDetail() { | ||||
|       this.$http.post(`/app/appgirdinfo/queryDetailById?id=${this.id}`).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.detailInfo = res.data | ||||
|           if(this.fromType == 'edit') { | ||||
|         if (res?.data) { | ||||
|           if (this.fromType == 'edit') { | ||||
|             this.form = res.data | ||||
|             this.form.girdMemberList?.map(e => e.id = e.wxUserId) | ||||
|             this.form.girdMemberManageList?.map(e => e.id = e.wxUserId) | ||||
|           } | ||||
|           if(this.fromType == 'add') { | ||||
|             this.form.parentGirdId = this.detailInfo.id | ||||
|             this.form.parentGirdName = this.detailInfo.girdName | ||||
|             this.form.girdLevel = Number(this.detailInfo.girdLevel)+1 | ||||
|             this.form.girdType = Number(this.detailInfo.girdType)+1 | ||||
|             this.form.isLastLevel = this.form.girdLevel == 2 ? '1' : '0' | ||||
|           if (this.fromType == 'add') { | ||||
|             this.form.parentGirdId = res.data.id | ||||
|             this.form.parentGirdName = res.data.girdName | ||||
|             this.$forceUpdate() | ||||
|           } | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     toAddUser(type) { | ||||
|       this.addUserType = type | ||||
|       var selectUserList = [] | ||||
|       if(type == 'manage') { | ||||
|         selectUserList = this.form.girdMemberManageList | ||||
|       }else { | ||||
|         selectUserList = this.form.girdMemberList | ||||
|       } | ||||
|       uni.setStorageSync('selectUserList', selectUserList) | ||||
|       uni.navigateTo({url: `./SelectUser`}) | ||||
|     }, | ||||
|     confirm() { | ||||
|       if(!this.form.girdName){ | ||||
|       if (!this.form.girdName) { | ||||
|         return this.$u.toast('请输入网格名称') | ||||
|       } | ||||
|  | ||||
|       var girdMemberManageList = [] | ||||
|       if(this.form.girdMemberManageList && this.form.girdMemberManageList.length) { | ||||
|         girdMemberManageList = this.form.girdMemberManageList.map((item) => { | ||||
|           return { | ||||
|             wxUserId: item.id, | ||||
|             phone: item.mobile, | ||||
|             photo: item.avatar, | ||||
|             name: item.name | ||||
|           } | ||||
|         }) | ||||
|       } | ||||
|  | ||||
|       var girdMemberList = [] | ||||
|       if(this.form.girdMemberList && this.form.girdMemberList.length) { | ||||
|         girdMemberList = this.form.girdMemberList.map((item) => { | ||||
|           return { | ||||
|             wxUserId: item.id, | ||||
|             phone: item.mobile, | ||||
|             photo: item.avatar, | ||||
|             name: item.name | ||||
|           } | ||||
|         }) | ||||
|       } | ||||
|        | ||||
|       let girdMemberManageList = this.form.girdMemberManageList?.map((item) => { | ||||
|         return { | ||||
|           wxUserId: item.id, | ||||
|           phone: item.mobile, | ||||
|           photo: item.avatar, | ||||
|           name: item.name | ||||
|         } | ||||
|       }) | ||||
|       let girdMemberList = this.form.girdMemberList?.map((item) => { | ||||
|         return { | ||||
|           wxUserId: item.id, | ||||
|           phone: item.mobile, | ||||
|           photo: item.avatar, | ||||
|           name: item.name | ||||
|         } | ||||
|       }) | ||||
|       this.$http.post(`/app/appgirdinfo/addOrUpdateByEw`, {...this.form, girdMemberManageList, girdMemberList}).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|         if (res?.code == 0) { | ||||
|           this.$u.toast('提交成功') | ||||
|           uni.$emit('update') | ||||
|           setTimeout(() => { | ||||
|             uni.navigateBack() | ||||
|             uni.navigateBack({}) | ||||
|           }, 600) | ||||
|         } | ||||
|       }).catch((err) => { | ||||
|         this.$u.toast(err) | ||||
|       }) | ||||
|  | ||||
|     }, | ||||
|     getArrayLabel(arr, key = 'name', separation = ',') { | ||||
|       return arr?.map(e => e[key])?.join(separation) | ||||
|     } | ||||
|   } | ||||
| } | ||||
| @@ -146,42 +107,47 @@ export default { | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .AddGird { | ||||
|   .item-flex{ | ||||
|   .item-flex { | ||||
|     display: flex; | ||||
|     padding: 34px 32px; | ||||
|     background-color: #fff; | ||||
|     font-size: 32px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     margin-bottom: 16px; | ||||
|     .label{ | ||||
|  | ||||
|     .label { | ||||
|       font-weight: 400; | ||||
|       color: #333333; | ||||
|       line-height: 22px; | ||||
|       width: 150px; | ||||
|       .tips{ | ||||
|  | ||||
|       .tips { | ||||
|         display: inline-block; | ||||
|         width: 16px; | ||||
|         color: #F46; | ||||
|         line-height: 44px; | ||||
|       } | ||||
|     } | ||||
|     .value{ | ||||
|  | ||||
|     .value { | ||||
|       width: calc(100% - 150px); | ||||
|       line-height: 44px; | ||||
|       text-align: right; | ||||
|       color: #666; | ||||
|       img{ | ||||
|         width: 32px; | ||||
|         height: 32px; | ||||
|  | ||||
|       img { | ||||
|         width: 44px; | ||||
|         height: 44px; | ||||
|         vertical-align: middle; | ||||
|         margin-left: 8px; | ||||
|       } | ||||
|     } | ||||
|     .color-999{ | ||||
|  | ||||
|     .color-999 { | ||||
|       color: #999; | ||||
|     } | ||||
|   } | ||||
|   .footer{ | ||||
|  | ||||
|   .footer { | ||||
|     width: 100%; | ||||
|     height: 112px; | ||||
|     line-height: 112px; | ||||
|   | ||||
| @@ -1,11 +1,11 @@ | ||||
| <template> | ||||
|   <div class="AddGird"> | ||||
|   <section class="AddGird"> | ||||
|     <div class="item-flex"> | ||||
|       <div class="label"> | ||||
|         <span class="tips">*</span>姓名 | ||||
|       </div> | ||||
|       <div class="value"> | ||||
|         <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="name" maxlength="50" /> | ||||
|         <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="name" maxlength="50"/> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="item-flex"> | ||||
| @@ -13,25 +13,26 @@ | ||||
|         <span class="tips">*</span>手机号 | ||||
|       </div> | ||||
|       <div class="value"> | ||||
|         <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="phone" maxlength="50" /> | ||||
|         <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="phone" maxlength="50"/> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="item-flex"> | ||||
|       <div class="label"> | ||||
|         <span class="tips">*</span>所属网格 | ||||
|       </div> | ||||
|       <div class="value" @click="linkTo('./SelectGird?formType=2')"> | ||||
|          | ||||
|         <span v-if="selectGird.girdName">{{selectGird.girdName}}</span> | ||||
|         <span style="color:#999;" v-else>请选择</span> | ||||
|         <img src="./components/img/right-icon.png" alt="" /></div> | ||||
|       <div class="value"> | ||||
|         <AiPagePicker type="custom" v-model="selectGird" valueObj nodeKey="id" :ops="{url:'./SelectGird',label: 'girdName'}" formType="2"> | ||||
|           <AiMore v-model="selectGird.girdName"/> | ||||
|         </AiPagePicker> | ||||
|       </div> | ||||
|       <div class="footer" @click="confirm">确认添加</div> | ||||
|     </div> | ||||
|     <div class="footer" @click="confirm">确认添加</div> | ||||
|   </div> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
| @@ -42,25 +43,21 @@ export default { | ||||
|   }, | ||||
|   computed: {...mapState(['user'])}, | ||||
|   onLoad() { | ||||
|     console.log(this.user) | ||||
|     this.name = this.user.name || '' | ||||
|     this.phone = this.user.phone || '' | ||||
|     uni.$on('goback', (res) => { | ||||
|       this.selectGird = res | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '网格员信息申报' | ||||
|   }, | ||||
|   methods: { | ||||
|     confirm() { | ||||
|       if(!this.name){ | ||||
|       if (!this.name) { | ||||
|         return this.$u.toast('请输入姓名') | ||||
|       } | ||||
|       if(!this.phone){ | ||||
|       if (!this.phone) { | ||||
|         return this.$u.toast('请输入手机号') | ||||
|       } | ||||
|       if(!this.selectGird.girdName){ | ||||
|       if (!this.selectGird.girdName) { | ||||
|         return this.$u.toast('请选择所属网格') | ||||
|       } | ||||
|       this.$http.post(`/app/appgirdmemberapply/girdMemberCheck?name=${this.name}&phone=${this.phone}&girdName=${this.selectGird.girdName}`).then((res) => { | ||||
| @@ -74,7 +71,7 @@ export default { | ||||
|     }, | ||||
|  | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({ url }) | ||||
|       uni.navigateTo({url}) | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| @@ -82,42 +79,48 @@ export default { | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .AddGird { | ||||
|   .item-flex{ | ||||
|   .item-flex { | ||||
|     display: flex; | ||||
|     padding: 34px 32px; | ||||
|     background-color: #fff; | ||||
|     font-size: 32px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     margin-bottom: 16px; | ||||
|     .label{ | ||||
|  | ||||
|     .label { | ||||
|       font-weight: 400; | ||||
|       color: #333333; | ||||
|       line-height: 22px; | ||||
|       width: 150px; | ||||
|       .tips{ | ||||
|  | ||||
|       .tips { | ||||
|         display: inline-block; | ||||
|         width: 16px; | ||||
|         color: #F46; | ||||
|         line-height: 44px; | ||||
|       } | ||||
|     } | ||||
|     .value{ | ||||
|  | ||||
|     .value { | ||||
|       width: calc(100% - 150px); | ||||
|       line-height: 44px; | ||||
|       text-align: right; | ||||
|       color: #666; | ||||
|       img{ | ||||
|  | ||||
|       img { | ||||
|         width: 32px; | ||||
|         height: 32px; | ||||
|         vertical-align: middle; | ||||
|         margin-left: 8px; | ||||
|       } | ||||
|     } | ||||
|     .color-999{ | ||||
|  | ||||
|     .color-999 { | ||||
|       color: #999; | ||||
|     } | ||||
|   } | ||||
|   .footer{ | ||||
|  | ||||
|   .footer { | ||||
|     width: 100%; | ||||
|     height: 112px; | ||||
|     line-height: 112px; | ||||
|   | ||||
| @@ -2,14 +2,17 @@ | ||||
|   <div class="success"> | ||||
|     <img src="./components/img/success.png" alt="" v-if="status"> | ||||
|     <img src="./components/img/fail.png" alt="" v-else> | ||||
|     <p>{{status == 1 ? '信息申报成功!' : '信息申报失败!'}}</p> | ||||
|     <p class="text">{{status == 1 ? '重新进入即可开始正常使用' : '系统无法匹配该申报信息,请联系管理人员进行处理'}}</p> | ||||
|     <div class="footer" @click="back">{{status == 1 ? '确定' : '我知道了'}}</div> | ||||
|     <p>{{ status == 1 ? '信息申报成功!' : '信息申报失败!' }}</p> | ||||
|     <p class="text">{{ status == 1 ? '重新进入即可开始正常使用' : '系统无法匹配该申报信息,请联系管理人员进行处理' }}</p> | ||||
|     <div class="footer" @click="back">{{ status == 1 ? '确定' : '我知道了' }}</div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapActions} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   name: "AddUserSuccess", | ||||
|   data() { | ||||
|     return { | ||||
|       status: 1 | ||||
| @@ -22,26 +25,32 @@ export default { | ||||
|     this.status = option.status | ||||
|   }, | ||||
|   methods: { | ||||
|     ...mapActions(['getAccount']), | ||||
|     back() { | ||||
|       uni.navigateBack({delta: 2}) | ||||
|       this.getAccount().then(() => { | ||||
|         uni.reLaunch({url: './AppGridManagement'}) | ||||
|       }) | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| uni-page-body{ | ||||
| uni-page-body { | ||||
|   height: 100%; | ||||
|   background-color: #fff; | ||||
| } | ||||
|  | ||||
| .success { | ||||
|   text-align: center; | ||||
|   img{ | ||||
|  | ||||
|   img { | ||||
|     width: 192px; | ||||
|     height: 192px; | ||||
|     margin: 96px 0 16px 0; | ||||
|   } | ||||
|   p{ | ||||
|  | ||||
|   p { | ||||
|     line-height: 50px; | ||||
|     color: #333; | ||||
|     font-size: 36px; | ||||
| @@ -49,7 +58,8 @@ uni-page-body{ | ||||
|     text-align: center; | ||||
|     margin-bottom: 16px; | ||||
|   } | ||||
|   .footer{ | ||||
|  | ||||
|   .footer { | ||||
|     width: calc(100% - 96px); | ||||
|     height: 88px; | ||||
|     line-height: 88px; | ||||
| @@ -63,7 +73,8 @@ uni-page-body{ | ||||
|     border-radius: 8px; | ||||
|     margin-left: 48px; | ||||
|   } | ||||
|   .text{ | ||||
|  | ||||
|   .text { | ||||
|     line-height: 44px; | ||||
|     font-size: 28px; | ||||
|     width: 500px; | ||||
|   | ||||
| @@ -1,26 +1,28 @@ | ||||
| <template> | ||||
|   <div class="AppGridManagement"> | ||||
|     <!-- <div class="header" v-if="component != 'Map' && isAdmin"> --> | ||||
|       <div class="pad-t32"  v-if="component != 'Map' && isAdmin"></div> | ||||
|       <div class="select-gird"  v-if="component != 'Map' && isAdmin"> | ||||
|         <img src="./components/img/gird-icon.png" alt="" class="gird-icon"> | ||||
|         <div @click="linkTo('./SelectGird')"> | ||||
|           {{params.girdName}} | ||||
|           <img src="./components/img/down-icon.png" alt="" class="down-icon"> | ||||
|     <template v-if="isGridMember"> | ||||
|       <div class="pad-t32" v-if="component != 'Map'"/> | ||||
|       <div class="select-gird" v-if="component != 'Map'" flex> | ||||
|         <AiPagePicker type="custom" class="fill" @select="handleSelectGird" | ||||
|                       :ops="{url:'./SelectGird',label: 'girdName'}"> | ||||
|           <div flex> | ||||
|             <img src="./components/img/gird-icon.png" alt="" class="gird-icon"> | ||||
|             <AiMore v-model="params.girdName" icon="arrow-down"/> | ||||
|           </div> | ||||
|         </AiPagePicker> | ||||
|         <span @click="linkTo('./SetGird?id='+params.id)" v-if="isGridAdmin&&!!params.id">网格配置</span> | ||||
|       </div> | ||||
|       <component v-if="refresh" :is="component" @change="onChange" :params="params"/> | ||||
|       <div class="tabs" v-if="isTab"> | ||||
|         <div class="item" @click="tabClick(index, item.component)" v-for="(item, index) in tabs" :key="index"> | ||||
|           <img :src="tabIndex == index ? item.activeImg : item.img" alt=""/> | ||||
|           <p :class="{'color-3267F0':tabIndex == index}" v-text="item.text"/> | ||||
|         </div> | ||||
|         <span @click="linkTo('./SetGird')" v-if="checkType == 2">网格配置</span> | ||||
|       </div> | ||||
|     <!-- </div> --> | ||||
|     <component v-if="refresh && isAdmin" :is="component" @change="onChange" :params="params"> </component> | ||||
|     <div class="tabs" v-if="isTab && isAdmin"> | ||||
|       <div class="item" @click="tabClick(index, item.component)" v-for="(item, index) in tabs" :key="index"> | ||||
|         <img :src="tabIndex == index ? item.activeImg : item.img" alt="" /> | ||||
|         <p :class="tabIndex == index ? 'color-3267F0' : ''">{{ item.text }}</p> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div v-if="!isAdmin" class="empty"> | ||||
|     </template> | ||||
|     <div v-if="!isGridMember" class="empty"> | ||||
|       <img src="./components/img/no-admin.png" alt=""> | ||||
|       <p>没有网格员权限<br />无法查看网格信息哦~</p> | ||||
|       <p>没有网格员权限<br/>无法查看网格信息哦~</p> | ||||
|       <div class="add-btn" @click="linkTo('./AddUser')">网格员信息申报</div> | ||||
|     </div> | ||||
|   </div> | ||||
| @@ -30,11 +32,11 @@ | ||||
| import Statistics from './Statistics.vue' | ||||
| import Organization from './Organization.vue' | ||||
| import Map from './Map.vue' | ||||
| import {mapState} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   name: 'AppGridManagement', | ||||
|   appName: '网格管理', | ||||
|  | ||||
|   data() { | ||||
|     return { | ||||
|       component: 'Statistics', | ||||
| @@ -62,48 +64,48 @@ export default { | ||||
|         } | ||||
|       ], | ||||
|       isTab: true, | ||||
|       isAdmin: false, | ||||
|       checkType: 0, | ||||
|     } | ||||
|   }, | ||||
|  | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     isGridMember() { | ||||
|       return this.user.girdCheckType > 0 | ||||
|     }, | ||||
|     isGridAdmin() { | ||||
|       return this.user.girdCheckType == 2 | ||||
|     } | ||||
|   }, | ||||
|   components: { | ||||
|     Organization, | ||||
|     Statistics, | ||||
|     Map, | ||||
|   }, | ||||
|  | ||||
|   methods: { | ||||
|     onChange(e) { | ||||
|       this.params = e.params | ||||
|       this.component = e.type | ||||
|     }, | ||||
|     tabClick(index, component) { | ||||
|       this.tabIndex = index | ||||
|       this.component = component | ||||
|     refreshHome() { | ||||
|       this.refresh = false | ||||
|       this.$nextTick(() => { | ||||
|         this.refresh = true | ||||
|       }) | ||||
|     }, | ||||
|     isGirdUser() { | ||||
|       this.isAdmin = false | ||||
|       this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           if (res.data.checkType != '0') { | ||||
|             this.isAdmin = true | ||||
|             this.checkType = res.data.checkType | ||||
|             this.params = res.data.appGirdInfo | ||||
|           } | ||||
|         } | ||||
|       }) | ||||
|     tabClick(index, component) { | ||||
|       this.tabIndex = index | ||||
|       this.component = component | ||||
|       this.refreshHome(); | ||||
|     }, | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({ url }) | ||||
|       uni.navigateTo({url}) | ||||
|     }, | ||||
|     handleSelectGird(v) { | ||||
|       this.params = v || {} | ||||
|       this.refreshHome() | ||||
|     } | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '网格管理' | ||||
|   onLoad() { | ||||
|     this.handleSelectGird(this.user.gridInfo) | ||||
|     uni.$on('hideTab', () => { | ||||
|       this.isTab = false | ||||
|     }) | ||||
| @@ -111,17 +113,11 @@ export default { | ||||
|       this.isTab = true | ||||
|     }) | ||||
|   }, | ||||
|   onLoad() { | ||||
|     this.isGirdUser() | ||||
|     uni.$on('goback', (res) => { | ||||
|       this.params = res | ||||
|     }) | ||||
|     uni.$on('updateGird', (res) => { | ||||
|       this.isGirdUser() | ||||
|     }) | ||||
|   onShow() { | ||||
|     document.title = '网格管理' | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     if(!this.tabIndex) { | ||||
|     if (!this.tabIndex) { | ||||
|       uni.$emit('nextList') | ||||
|     } | ||||
|   }, | ||||
| @@ -133,43 +129,29 @@ export default { | ||||
|   height: 100vh; | ||||
| } | ||||
|  | ||||
| .pad-t32{ | ||||
| .pad-t32 { | ||||
|   padding-top: 32px; | ||||
| } | ||||
| .header{ | ||||
|   position: fixed; | ||||
|   top: 0; | ||||
|   left: 0; | ||||
|   z-index: 9; | ||||
|   width: 100%; | ||||
|  | ||||
| .gird-icon { | ||||
|   margin-right: 8px; | ||||
| } | ||||
| .select-gird{ | ||||
|  | ||||
| .select-gird { | ||||
|   width: calc(100% - 60px); | ||||
|   padding: 24px 32px; | ||||
|   background: #FFFFFF; | ||||
|   border-radius: 16px; | ||||
|   margin: 0 30px 32px; | ||||
|   box-sizing: border-box; | ||||
|   img{ | ||||
|  | ||||
|   img { | ||||
|     width: 32px; | ||||
|     height: 32px; | ||||
|     vertical-align: middle; | ||||
|   } | ||||
|   div{ | ||||
|     display: inline-block; | ||||
|     width: calc(100% - 144px); | ||||
|     padding-left: 20px; | ||||
|     box-sizing: border-box; | ||||
|     font-size: 32px; | ||||
|     font-family: PingFangSC-Medium, PingFang SC; | ||||
|     font-weight: 500; | ||||
|     color: #333; | ||||
|     line-height: 48px; | ||||
|     img{ | ||||
|       margin-left: 8px; | ||||
|     } | ||||
|   } | ||||
|   span{ | ||||
|  | ||||
|   span { | ||||
|     display: inline-block; | ||||
|     width: 112px; | ||||
|     height: 48px; | ||||
| @@ -180,6 +162,7 @@ export default { | ||||
|     line-height: 48px; | ||||
|   } | ||||
| } | ||||
|  | ||||
| .tabs { | ||||
|   width: 100%; | ||||
|   height: 98px; | ||||
| @@ -189,14 +172,17 @@ export default { | ||||
|   bottom: 0; | ||||
|   left: 0; | ||||
|   display: flex; | ||||
|  | ||||
|   .item { | ||||
|     flex: 1; | ||||
|     text-align: center; | ||||
|  | ||||
|     img { | ||||
|       width: 56px; | ||||
|       height: 56px; | ||||
|       margin-top: 8px; | ||||
|     } | ||||
|  | ||||
|     p { | ||||
|       font-size: 22px; | ||||
|       font-family: PingFangSC-Medium, PingFang SC; | ||||
| @@ -204,25 +190,30 @@ export default { | ||||
|       color: #c4cad4; | ||||
|       line-height: 8px; | ||||
|     } | ||||
|  | ||||
|     .color-3267F0 { | ||||
|       color: #3267f0; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| .empty{ | ||||
|  | ||||
| .empty { | ||||
|   text-align: center; | ||||
|   img{ | ||||
|  | ||||
|   img { | ||||
|     width: 282px; | ||||
|     height: 306px; | ||||
|     margin: 136px auto 0; | ||||
|   } | ||||
|   p{ | ||||
|  | ||||
|   p { | ||||
|     font-size: 28px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     color: #999; | ||||
|     line-height: 40px; | ||||
|   } | ||||
|   .add-btn{ | ||||
|  | ||||
|   .add-btn { | ||||
|     width: 400px; | ||||
|     height: 88px; | ||||
|     line-height: 88px; | ||||
|   | ||||
| @@ -1,7 +1,7 @@ | ||||
| <template> | ||||
|   <div class="FamilyList"> | ||||
|     <div class="title"> | ||||
|       <div>户主列表</div> | ||||
|       <div>户主列表({{ total }})</div> | ||||
|       <div v-if="list.length"> | ||||
|         <span style="font-size: 14px; color: #2979ff;" @click="changeType" v-if="edit">修改</span> | ||||
|         <span style="font-size: 14px; color: #2979ff;" @click="edit = true" v-else>取消</span> | ||||
| @@ -11,7 +11,7 @@ | ||||
|       <ul v-for="(item,index) in list" :key="index"> | ||||
|         <li> | ||||
|           <div class="user"> | ||||
|              <div v-if="!edit"> | ||||
|             <div v-if="!edit"> | ||||
|               <img src="./components/img/xz.png" alt="" class="checkbox" v-if="!item.checked" @click="userClick(index)"> | ||||
|               <img src="./components/img/xzh.png" alt="" class="checkbox" v-else @click="userClick(index)"> | ||||
|             </div> | ||||
| @@ -22,11 +22,11 @@ | ||||
|               </div> | ||||
|               <div class="userInfo"> | ||||
|                 <div class="name"> | ||||
|                   <span class="user-name">{{item.name}}</span> | ||||
|                   <span class="user-tel">{{item.phone}}</span> | ||||
|                   <span class="user-name">{{ item.name }}</span> | ||||
|                   <span class="user-tel">{{ item.phone }}</span> | ||||
|                 </div> | ||||
|                 <div class="idCard">{{item.idNumber && item.idNumber.replace(/(.{6}).*(.{4})/,"$1********$2")}}</div> | ||||
|                 <div class="address">{{item.currentAreaName || ''}}{{ item.currentAddress || '' }}</div> | ||||
|                 <div class="idCard">{{ item.idNumber && item.idNumber.replace(/(.{6}).*(.{4})/, "$1********$2") }}</div> | ||||
|                 <div class="address">{{ item.currentAreaName || '' }}{{ item.currentAddress || '' }}</div> | ||||
|               </div> | ||||
|             </div> | ||||
|           </div> | ||||
| @@ -44,8 +44,9 @@ | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
|       list:[], | ||||
|       current:1, | ||||
|       list: [], | ||||
|       total: 0, | ||||
|       current: 1, | ||||
|       userId: '', | ||||
|       edit: true, | ||||
|       checked: true, | ||||
| @@ -53,14 +54,15 @@ export default { | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     getList(){ | ||||
|        this.$http.post(`/app/appgirdmemberresident/listByGirdMember?current=${this.current}&girdMemberId=${this.userId}&girdId=${this.girdId}`).then((res) => { | ||||
|     getList() { | ||||
|       this.$http.post(`/app/appgirdmemberresident/listByGirdMember?current=${this.current}&girdMemberId=${this.userId}&girdId=${this.girdId}`).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|          this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records | ||||
|           this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records | ||||
|           this.total = res.data.total | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     toAddFamily(){ | ||||
|     toAddFamily() { | ||||
|       uni.navigateTo({url: `./AddFamily?id=${this.userId}&girdId=${this.girdId}`}) | ||||
|     }, | ||||
|     userClick(index) { | ||||
| @@ -68,14 +70,14 @@ export default { | ||||
|       this.$forceUpdate() | ||||
|     }, | ||||
|     // 点击删除 | ||||
|     delFamily(){ | ||||
|     delFamily() { | ||||
|       var ids = [] | ||||
|       this.list.map((item) => { | ||||
|         if(item.checked) { | ||||
|         if (item.checked) { | ||||
|           ids.push(item.gmrId) | ||||
|         } | ||||
|       }) | ||||
|       if(!ids.length) { | ||||
|       if (!ids.length) { | ||||
|         return this.$u.toast('请选中需要删除的家庭户主') | ||||
|       } | ||||
|       this.$confirm(`是否删除这些关联家庭信息?`).then(() => { | ||||
| @@ -117,78 +119,93 @@ export default { | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .FamilyList { | ||||
|   min-height: 100vh; | ||||
|   .title { | ||||
|     display: flex; | ||||
|     justify-content: space-between; | ||||
|     padding: 24px 32px; | ||||
|     background-color: #F3F6F9; | ||||
|     background-color: #fff; | ||||
|     font-size: 34px; | ||||
|     font-weight: 800; | ||||
|   } | ||||
|  | ||||
|   .main { | ||||
|     padding-bottom: 112px; | ||||
|  | ||||
|     ul { | ||||
|       padding-left: 32px; | ||||
|       background-color: #fff; | ||||
|  | ||||
|       li { | ||||
|       list-style-type: none; | ||||
|       .user { | ||||
|         display: flex; | ||||
|         justify-content: flex-start; | ||||
|         padding-top: 24px; | ||||
|           .checkbox{ | ||||
|           margin-top: 20px; | ||||
|           margin-right: 32px; | ||||
|           width: 48px; | ||||
|           height: 48px; | ||||
|         } | ||||
|         .info { | ||||
|         list-style-type: none; | ||||
|  | ||||
|         .user { | ||||
|           display: flex; | ||||
|           justify-content: flex-start; | ||||
|            width: 100%; | ||||
|           .userImg { | ||||
|           margin-right: 32px; | ||||
|           width: 80px; | ||||
|           height: 80px; | ||||
|           border-radius: 50%; | ||||
|         } | ||||
|           .userInfo { | ||||
|             width: 100%; | ||||
|             padding-right: 32px; | ||||
|             border-bottom: 1px solid #E4E5E6; | ||||
|             .name { | ||||
|             display: flex; | ||||
|             justify-content: space-between; | ||||
|             font-size: 32px; | ||||
|             margin-bottom: 8px; | ||||
|             .user-name { | ||||
|               font-weight: 800; | ||||
|             } | ||||
|             .user-tel { | ||||
|               font-size: 26px; | ||||
|               color: #999999 ; | ||||
|             } | ||||
|          } | ||||
|          .idCard { | ||||
|            margin-bottom: 16px; | ||||
|            font-size: 26px; | ||||
|            color: #999999; | ||||
|          } | ||||
|          .address { | ||||
|            max-width: 100%; | ||||
|            word-break:break-all; | ||||
|            margin-bottom: 18px; | ||||
|            font-size: 26px; | ||||
|            color: #999999; | ||||
|          } | ||||
|           padding-top: 24px; | ||||
|  | ||||
|           .checkbox { | ||||
|             margin-top: 20px; | ||||
|             margin-right: 32px; | ||||
|             width: 48px; | ||||
|             height: 48px; | ||||
|           } | ||||
|  | ||||
|           .info { | ||||
|             display: flex; | ||||
|             justify-content: flex-start; | ||||
|             width: 100%; | ||||
|  | ||||
|             .userImg { | ||||
|               margin-right: 32px; | ||||
|               width: 80px; | ||||
|               height: 80px; | ||||
|               border-radius: 50%; | ||||
|             } | ||||
|  | ||||
|             .userInfo { | ||||
|               width: 100%; | ||||
|               padding-right: 32px; | ||||
|               border-bottom: 1px solid #E4E5E6; | ||||
|  | ||||
|               .name { | ||||
|                 display: flex; | ||||
|                 justify-content: space-between; | ||||
|                 font-size: 32px; | ||||
|                 margin-bottom: 8px; | ||||
|  | ||||
|                 .user-name { | ||||
|                   font-weight: 800; | ||||
|                 } | ||||
|  | ||||
|                 .user-tel { | ||||
|                   font-size: 26px; | ||||
|                   color: #999999; | ||||
|                 } | ||||
|               } | ||||
|  | ||||
|               .idCard { | ||||
|                 margin-bottom: 16px; | ||||
|                 font-size: 26px; | ||||
|                 color: #999999; | ||||
|               } | ||||
|  | ||||
|               .address { | ||||
|                 max-width: 100%; | ||||
|                 word-break: break-all; | ||||
|                 margin-bottom: 18px; | ||||
|                 font-size: 26px; | ||||
|                 color: #999999; | ||||
|               } | ||||
|             } | ||||
|  | ||||
|           } | ||||
|            | ||||
|         } | ||||
|       } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .footer{ | ||||
|  | ||||
|   .footer { | ||||
|     position: fixed; | ||||
|     left: 0px; | ||||
|     bottom: 0px; | ||||
|   | ||||
| @@ -1,11 +1,16 @@ | ||||
| <template> | ||||
|   <div class="map"> | ||||
|   <div class="detail"> | ||||
|     <div class="grid-select"> | ||||
|       <span class="label">网格选择</span> | ||||
|       <div class="grid-select__right" @click="toChoose"> | ||||
|         <span>{{ form.girdName || '请选择' }}</span> | ||||
|         <u-icon name="arrow-right" color="#cccccc" size="30" style="margin-left:8px;"></u-icon> | ||||
|       </div> | ||||
|       <AiPagePicker type="custom" class="fill" @select="handleSelectGird" | ||||
|                     :ops="{url:'./SelectGird',label: 'girdName'}"> | ||||
|         <div class="gird-content"> | ||||
|           <div class="label">网格选择</div> | ||||
|           <div class="grid-select__right"> | ||||
|             <span>{{ form.girdName || '请选择' }}</span> | ||||
|             <u-icon name="arrow-right" color="#cccccc" size="26" style="margin-left:4px;"></u-icon> | ||||
|           </div> | ||||
|         </div> | ||||
|       </AiPagePicker> | ||||
|     </div> | ||||
|     <div class="map-content"> | ||||
|       <AiTMap ref="AiTMap" :map.sync="map" :lib.sync="lib" :libraries="['geometry','service', 'tools']"/> | ||||
| @@ -14,34 +19,18 @@ | ||||
|       <div class="popup"> | ||||
|         <div class="bg"></div> | ||||
|         <div class="title">{{ form.girdName }}</div> | ||||
| 				<scroll-view scroll-y="true" class="grid-info"> | ||||
|           <div class="info-flex"> | ||||
|             <span class="label">网格类型</span> | ||||
|             <span class="value">{{ $dict.getLabel('girdType', form.girdType) }}</span> | ||||
|         <scroll-view scroll-y="true" class="grid-info"> | ||||
|           <div class="info-flex" v-for="(item) in  form.girdMemberManageList" :key="item.id" flex> | ||||
|             <div class="label">网格长</div> | ||||
|             <div class="value fill" v-text='[item.name, item.phone].join("  ")'/> | ||||
|             <AiPhone :phone="item.phone"/> | ||||
|           </div> | ||||
|           <div class="info-flex"> | ||||
|             <span class="label">网格层级</span> | ||||
|             <span class="value">{{ $dict.getLabel('girdLevel', form.girdLevel) }}</span> | ||||
|           <div class="info-flex" v-for="(item) in  form.girdMemberList" :key="item.id" flex> | ||||
|             <div class="label">网格员</div> | ||||
|             <div class="value fill" v-text='[item.name, item.phone].join("  ")'/> | ||||
|             <AiPhone :phone="item.phone"/> | ||||
|           </div> | ||||
|           <div v-if="form.girdMemberManageList && form.girdMemberManageList.length"> | ||||
|             <div class="info-flex" v-for="(item, index) in  form.girdMemberManageList" :key="index"> | ||||
|               <span class="label">网格长</span> | ||||
|               <span class="value">{{ item.name }}  {{ item.phone }} | ||||
|                 <img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(item.phone)" class="phone-icon" | ||||
|                     v-if="item.phone"> | ||||
|               </span> | ||||
|             </div> | ||||
|           </div> | ||||
|           <div v-if="form.girdMemberList && form.girdMemberList.length"> | ||||
|             <div class="info-flex" v-for="(item, index) in  form.girdMemberList" :key="index"> | ||||
|               <span class="label">网格管理员</span> | ||||
|               <span class="value">{{ item.name }}  {{ item.phone }} | ||||
|                 <img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(item.phone)" class="phone-icon" | ||||
|                     v-if="item.phone"> | ||||
|               </span> | ||||
|             </div> | ||||
|           </div> | ||||
| 				</scroll-view> | ||||
|         </scroll-view> | ||||
|       </div> | ||||
|     </u-popup> | ||||
|   </div> | ||||
| @@ -68,51 +57,16 @@ export default { | ||||
|   }, | ||||
|   computed: {...mapState(['user', 'config'])}, | ||||
|   created() { | ||||
|     this.$dict.load('girdType', 'girdLevel') | ||||
|     this.$dict.load('girdType') | ||||
|     this.areaId = this.user.areaId | ||||
|     // this.getLeafNodes() | ||||
|     uni.$on('goback', e => { | ||||
|       if (e.girdLevel == '0') { | ||||
|         setTimeout(() => { | ||||
|           this.$u.toast('请选择二级或者三级网格') | ||||
|         }, 400) | ||||
|         return false | ||||
|       } | ||||
|       this.getGridList(e.id, true) | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = "网格管理" | ||||
|   }, | ||||
|  | ||||
|   methods: { | ||||
|     toChoose () { | ||||
|       uni.navigateTo({ | ||||
|         url: './SelectGird?isFormMap=1' | ||||
|       }) | ||||
|     }, | ||||
|     getLeafNodes() { | ||||
|       this.$http.post(`/app/appgirdinfo/queryGirdMemberGirdsById`).then((res) => { | ||||
|         if (res?.data) { | ||||
|           this.treeList = res.data.filter(v => v.girdLevel === '2') | ||||
|  | ||||
|           const arr = res.data.filter(v => v.points).map(e => { | ||||
|             return { | ||||
|               id: e.id, | ||||
|               girdName: e.girdName, | ||||
|               points: e.points.map(p => [p.lng, p.lat]) | ||||
|             }  | ||||
|           }) | ||||
|  | ||||
|           arr.length > 0 && this.renderGridMap(arr) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     getGridList (id) { | ||||
|     getGridList(id) { | ||||
|       this.$loading() | ||||
|       this.$http.post(`/app/appgirdinfo/queryChildGirdInfoByGirdId?girdId=${id}`).then((res) => { | ||||
|         this.$hideLoading() | ||||
|         if (res?.data) { | ||||
|           const arr = res.data.map(v => { | ||||
|             return { | ||||
| @@ -121,15 +75,13 @@ export default { | ||||
|               points: v.points ? v.points.map(p => [p.lng, p.lat]) : [] | ||||
|             } | ||||
|           }) | ||||
|  | ||||
|           this.renderGridMap(arr) | ||||
|         } | ||||
|       }).catch(() => { | ||||
|       }).finally(() => { | ||||
|         this.$hideLoading() | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     getGridInfo (id, flag) { | ||||
|     getGridInfo(id, flag) { | ||||
|       this.$loading() | ||||
|       this.$http.post(`/app/appgirdinfo/queryDetailById?id=${id}`).then((res) => { | ||||
|         this.$hideLoading() | ||||
| @@ -142,7 +94,7 @@ export default { | ||||
|               girdName: res.data.girdName, | ||||
|               points: res.data.points.map(p => [p.lng, p.lat]) | ||||
|             }] | ||||
|              | ||||
|  | ||||
|             this.renderGridMap(arr) | ||||
|           } | ||||
|  | ||||
| @@ -154,7 +106,6 @@ export default { | ||||
|         this.$hideLoading() | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     renderGridMap(paths, count = 0) { | ||||
|       let {map, lib: TMap, $refs: {AiTMap: {fitBounds}}} = this | ||||
|       if (TMap) { | ||||
| @@ -169,58 +120,54 @@ export default { | ||||
|         } | ||||
|         if (paths?.length > 0) { | ||||
|           let bounds = [] | ||||
|  | ||||
|           paths.forEach((path, i) => { | ||||
|             let color = colors[i % colors.length] | ||||
|             let polygon = new TMap.MultiPolygon({ | ||||
|               map, styles: { | ||||
|                 default: new TMap.PolygonStyle({ | ||||
|                   showBorder: true, | ||||
|                   borderColor: '#5088FF', | ||||
|                   borderWidth: 2, | ||||
|                   color: this.$colorUtils.Hex2RGBA('#5088FF', 0.1) | ||||
|                 }) | ||||
|               }, | ||||
|               id: path.id, | ||||
|               geometries: [{paths: path.points.map(e => new TMap.LatLng(e[1], e[0]))}] | ||||
|             }) | ||||
|             this.polygons.push(polygon) | ||||
|             bounds.push(fitBounds(path.points.map(e => new TMap.LatLng(e[1], e[0])))) | ||||
|  | ||||
|             polygon.on('click', e => { | ||||
|               const id = e.target.id | ||||
|               this.getGridInfo(id) | ||||
|             }) | ||||
|  | ||||
|             const points = path.points.map(e => new TMap.LatLng(e[1], e[0])) | ||||
|  | ||||
|             var position = TMap.geometry.computeCentroid(points) | ||||
|  | ||||
|             let label = new TMap.MultiLabel({ | ||||
|               id: `label~${path.id}`, | ||||
|               data: path.id, | ||||
|               map: map, | ||||
|               styles: { | ||||
|                 building:  new TMap.LabelStyle({ | ||||
|                   color: '#3777FF', | ||||
|                   size: 20, | ||||
|                   alignment: 'center', | ||||
|                   verticalAlignment: 'middle' | ||||
|                 }) | ||||
|               }, | ||||
|               geometries: [ | ||||
|                 { | ||||
|                   id: `label-class-${i}`, | ||||
|                   styleId: 'building', | ||||
|                   position: position, | ||||
|                   content: path.girdName, | ||||
|                 } | ||||
|               ] | ||||
|             }) | ||||
|             this.labels.push(label) | ||||
|             label.on('click', e => { | ||||
|               this.getGridInfo(e.target.id.split('~')[1]) | ||||
|             }); | ||||
|             if (path.points?.length > 0) { | ||||
|               let polygon = new TMap.MultiPolygon({ | ||||
|                 map, styles: { | ||||
|                   default: new TMap.PolygonStyle({ | ||||
|                     showBorder: true, | ||||
|                     borderColor: '#5088FF', | ||||
|                     borderWidth: 2, | ||||
|                     color: this.$colorUtils.Hex2RGBA('#5088FF', 0.1) | ||||
|                   }) | ||||
|                 }, | ||||
|                 id: path.id, | ||||
|                 geometries: [{paths: path.points.map(e => new TMap.LatLng(e[1], e[0]))}] | ||||
|               }) | ||||
|               this.polygons.push(polygon) | ||||
|               bounds.push(fitBounds(path.points.map(e => new TMap.LatLng(e[1], e[0])))) | ||||
|               polygon.on('click', e => { | ||||
|                 const id = e.target.id | ||||
|                 this.getGridInfo(id) | ||||
|               }) | ||||
|               const points = path.points.map(e => new TMap.LatLng(e[1], e[0])) | ||||
|               const position = TMap.geometry.computeCentroid(points) | ||||
|               let label = new TMap.MultiLabel({ | ||||
|                 id: `label~${path.id}`, | ||||
|                 data: path.id, | ||||
|                 map: map, | ||||
|                 styles: { | ||||
|                   building: new TMap.LabelStyle({ | ||||
|                     color: '#3777FF', | ||||
|                     size: 20, | ||||
|                     alignment: 'center', | ||||
|                     verticalAlignment: 'middle' | ||||
|                   }) | ||||
|                 }, | ||||
|                 geometries: [ | ||||
|                   { | ||||
|                     id: `label-class-${i}`, | ||||
|                     styleId: 'building', | ||||
|                     position, | ||||
|                     content: path.girdName, | ||||
|                   } | ||||
|                 ] | ||||
|               }) | ||||
|               this.labels.push(label) | ||||
|               label.on('click', e => { | ||||
|                 this.getGridInfo(e.target.id.split('~')[1]) | ||||
|               }); | ||||
|             } | ||||
|           }) | ||||
|           bounds = bounds.reduce((a, b) => { | ||||
|             return fitBounds([ | ||||
| @@ -246,33 +193,18 @@ export default { | ||||
|     callPhone(phone) { | ||||
|       uni.makePhoneCall({phoneNumber: phone}) | ||||
|     }, | ||||
|     handleSelect(e) { | ||||
|       if (e?.points?.length > 0) { | ||||
|         this.form = e | ||||
|         const points = e.points.map(e => new TMap.LatLng(e.lat, e.lng)) | ||||
|         var position = TMap.geometry.computeCentroid(points) | ||||
|         this.map.setCenter(position) | ||||
|         this.map.setZoom(18) | ||||
|       } else { | ||||
|         this.$u.toast("所选网格没有标绘!") | ||||
|       } | ||||
|     handleSelectGird(v) { | ||||
|       this.form = v || {} | ||||
|       this.getGridList(v?.id, true) | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| ::v-deep uni-page-body { | ||||
| .detail { | ||||
|   height: 100%; | ||||
| } | ||||
|  | ||||
| ai-tree-picker { | ||||
|   display: inline-block; | ||||
| } | ||||
|  | ||||
| .map { | ||||
|   height: 100%; | ||||
|   height: calc(100% - 98px); | ||||
|   .grid-select { | ||||
|     width: 100%; | ||||
|     padding: 34px 32px; | ||||
| @@ -282,18 +214,19 @@ ai-tree-picker { | ||||
|     justify-content: space-between; | ||||
|     line-height: 44px; | ||||
|     color: #333; | ||||
|     // position: fixed; | ||||
|     // top: 0; | ||||
|     // left: 0; | ||||
|     // z-index: 999; | ||||
|  | ||||
|     .grid-select__right { | ||||
|       width: calc(100% - 140px); | ||||
|       text-align: right; | ||||
|     } | ||||
|  | ||||
|     .gird-content { | ||||
|       display: flex; | ||||
|       align-items: center; | ||||
|       justify-content: space-between; | ||||
|     } | ||||
|  | ||||
|     .label { | ||||
|       display: inline-block; | ||||
|       flex-shrink: 0; | ||||
|       width: 140px; | ||||
|       font-size: 32px; | ||||
|     } | ||||
| @@ -309,7 +242,7 @@ ai-tree-picker { | ||||
|  | ||||
|   .map-content { | ||||
|     width: 100%; | ||||
|     height: calc(100% - 115px); | ||||
|     height: calc(100% - 210px); | ||||
|   } | ||||
|  | ||||
|   .popup { | ||||
| @@ -343,8 +276,8 @@ ai-tree-picker { | ||||
|       line-height: 40px; | ||||
|       font-size: 28px; | ||||
|  | ||||
|       &:last-child { | ||||
|         border: none; | ||||
|       &:last-of-type { | ||||
|         border-bottom: none; | ||||
|       } | ||||
|  | ||||
|       .label { | ||||
| @@ -357,22 +290,11 @@ ai-tree-picker { | ||||
|       .value { | ||||
|         color: #666; | ||||
|         font-size: 26px; | ||||
|  | ||||
|         .phone-icon { | ||||
|           width: 40px; | ||||
|           height: 40px; | ||||
|           vertical-align: sub; | ||||
|           margin-left: 16px; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| .grid-name { | ||||
|   display: inline-block; | ||||
| } | ||||
|  | ||||
| .footer { | ||||
|   width: 100%; | ||||
|   position: fixed; | ||||
|   | ||||
| @@ -1,34 +1,35 @@ | ||||
| <template> | ||||
|   <div class="Organization"> | ||||
|     <div class="title">网格人员</div> | ||||
|     <div class="user-content" v-for="(item, index) in dataInfo.parentGirdMembers" :key="index"> | ||||
|     <div class="user-content" v-for="(item, index) in dataInfo.parentGirdMembers" :key="item.id"> | ||||
|       <div> | ||||
|         <!-- <image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" /> --> | ||||
|         <img :src="item.photo" alt="" v-if="item.photo"> | ||||
|         <img src="./components/img/big-user.png" alt="" v-else> | ||||
|       </div> | ||||
|       <div class="right"> | ||||
|         <div class="name">{{item.name}}</div> | ||||
|         <div class="gird">{{item.checkType == 2 ? '网格长' : '网格员'}}</div> | ||||
|         <p>{{item.girdName}}</p> | ||||
|         <div class="name">{{ item.name }}</div> | ||||
|         <div class="gird">{{ item.checkType == 2 ? '网格长' : '网格员' }}</div> | ||||
|         <p>{{ item.girdName }}</p> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="user-content user-item" v-for="(item, index) in dataInfo.girdMembers" :key="index"> | ||||
|     <div class="user-content user-item" v-for="(item, index) in dataInfo.girdMembers" :key="item.id" @click="viewUser(item.wxUserId)"> | ||||
|       <div> | ||||
|         <!-- <image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" /> --> | ||||
|         <img :src="item.photo" alt="" v-if="item.photo"> | ||||
|         <img src="./components/img/big-user.png" alt="" v-else> | ||||
|       </div> | ||||
|       <div class="right"> | ||||
|         <div class="name">{{item.name}}  | ||||
|           <span class="gird">{{item.checkType == 2 ? '网格长' : '网格员'}}</span> | ||||
|           <span class="family-btn" @click="linkTo(`./FamilyList?id=${item.id}&girdId=${userGird.id}`)" v-if="item.checkType == 1">责任家庭 ></span> | ||||
|         <div class="name">{{ item.name }} | ||||
|           <span class="gird">{{ item.checkType == 2 ? '网格长' : '网格员' }}</span> | ||||
|           <span class="family-btn" @click.stop="linkTo(`./FamilyList?id=${item.id}&girdId=${userGird.id}`)" v-if="item.checkType == 1">责任家庭 ></span> | ||||
|         </div> | ||||
|         <p>{{item.girdName}} </p> | ||||
|         <p>{{ item.girdName }} </p> | ||||
|       </div> | ||||
|     </div> | ||||
|     <AiEmpty description="暂无数据" class="emptyWrap" v-if="dataInfo.parentGirdMembers && !dataInfo.parentGirdMembers.length && !dataInfo.girdMembers.length"></AiEmpty> | ||||
|     <div class="pad-b112"></div> | ||||
|     <AiEmpty description="暂无数据" class="emptyWrap" | ||||
|              v-if="dataInfo.parentGirdMembers && !dataInfo.parentGirdMembers.length && !dataInfo.girdMembers.length"></AiEmpty> | ||||
|     <AiGap h="112"/> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| @@ -43,7 +44,7 @@ export default { | ||||
|   props: ['params'], | ||||
|   onShow() { | ||||
|     document.title = '网格管理' | ||||
|       | ||||
|  | ||||
|   }, | ||||
|   mounted() { | ||||
|     this.userGird = this.params | ||||
| @@ -51,7 +52,7 @@ export default { | ||||
|     uni.$on('goback', (res) => { | ||||
|       this.userGird = res | ||||
|       this.getGirdUserList() | ||||
|     })  | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
|     getGirdUserList() { | ||||
| @@ -63,7 +64,12 @@ export default { | ||||
|     }, | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({url}) | ||||
|     } | ||||
|     }, | ||||
|     viewUser(userid) { | ||||
|       userid && this.injectJWeixin('openUserProfile').then(() => { | ||||
|         this.wxInvoke(['openUserProfile', {type: 1, userid}, () => 0]) | ||||
|       }) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
| @@ -71,7 +77,8 @@ export default { | ||||
| <style lang="scss" scoped> | ||||
| .Organization { | ||||
|   background-color: #f5f5f5; | ||||
|   .title{ | ||||
|  | ||||
|   .title { | ||||
|     font-size: 38px; | ||||
|     font-family: PingFangSC-Semibold, PingFang SC; | ||||
|     font-weight: 600; | ||||
| @@ -80,27 +87,32 @@ export default { | ||||
|     padding-left: 32px; | ||||
|     margin-bottom: 32px; | ||||
|   } | ||||
|   .user-content{ | ||||
|  | ||||
|   .user-content { | ||||
|     width: calc(100% - 64px); | ||||
|     margin: 0 0 32px 32px; | ||||
|     background-color: #fff; | ||||
|     padding: 32px; | ||||
|     box-sizing: border-box; | ||||
|     display: flex; | ||||
|     img{ | ||||
|  | ||||
|     img { | ||||
|       display: inline-block; | ||||
|       width: 200px; | ||||
|       height: 200px; | ||||
|       margin-right: 32px; | ||||
|     } | ||||
|     image{ | ||||
|  | ||||
|     image { | ||||
|       width: 200px; | ||||
|       height: 200px; | ||||
|       margin-right: 32px; | ||||
|     } | ||||
|     .right{ | ||||
|  | ||||
|     .right { | ||||
|       width: 100%; | ||||
|       .name{ | ||||
|  | ||||
|       .name { | ||||
|         font-size: 32px; | ||||
|         font-family: PingFangSC-Medium, PingFang SC; | ||||
|         font-weight: 500; | ||||
| @@ -108,7 +120,8 @@ export default { | ||||
|         line-height: 44px; | ||||
|         margin-bottom: 12px; | ||||
|       } | ||||
|       .gird{ | ||||
|  | ||||
|       .gird { | ||||
|         display: inline-block; | ||||
|         line-height: 44px; | ||||
|         background: #E8EFFF; | ||||
| @@ -119,7 +132,8 @@ export default { | ||||
|         color: #26F; | ||||
|         margin-bottom: 12px; | ||||
|       } | ||||
|       p{ | ||||
|  | ||||
|       p { | ||||
|         font-size: 26px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         color: #666; | ||||
| @@ -127,34 +141,40 @@ export default { | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .user-item{ | ||||
|     img{ | ||||
|  | ||||
|   .user-item { | ||||
|     img { | ||||
|       width: 96px; | ||||
|       height: 96px; | ||||
|       border-radius: 50%; | ||||
|     } | ||||
|     image{ | ||||
|  | ||||
|     image { | ||||
|       width: 96px; | ||||
|       height: 96px; | ||||
|       border-radius: 50%; | ||||
|     } | ||||
|     .gird{ | ||||
|  | ||||
|     .gird { | ||||
|       display: inline-block; | ||||
|       margin-left: 16px; | ||||
|       margin-bottom: 0!important; | ||||
|       margin-bottom: 0 !important; | ||||
|     } | ||||
|     .name{ | ||||
|       margin-bottom: 8px!important; | ||||
|  | ||||
|     .name { | ||||
|       margin-bottom: 8px !important; | ||||
|     } | ||||
|   } | ||||
|   .family-btn{ | ||||
|  | ||||
|   .family-btn { | ||||
|     font-size: 26px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     color: #3975C6; | ||||
|     line-height: 36px; | ||||
|     float: right; | ||||
|   } | ||||
|   .pad-b112{ | ||||
|  | ||||
|   .pad-b112 { | ||||
|     padding-bottom: 112px; | ||||
|   } | ||||
| } | ||||
|   | ||||
| @@ -2,37 +2,39 @@ | ||||
|   <div class="SelectGird"> | ||||
|     <div class="header-middle"> | ||||
|       <div class="hint"> | ||||
|         <span v-for="(item, index) in slectList" :key="index"><span v-if="index" style="margin:0 4px;">/</span><span style="color:#3F8DF5" @click="girdNameClick(item, index)">{{item.girdName}}</span></span> | ||||
|         <span v-for="(item, index) in slectList" :key="index"> | ||||
|           <span v-if="index" style="margin:0 4px;" v-text="`/`"/> | ||||
|           <span style="color:#3F8DF5" @click="girdNameClick(item, index)" v-text="item.girdName"/> | ||||
|         </span> | ||||
|       </div> | ||||
|       <div class="showTypes"> | ||||
|         <div v-if="treeList.length > 0"> | ||||
|           <div class="cards" v-for="(item, index) in treeList" :key="index" @click="itemClick(item)"> | ||||
|             <div class="imges"> | ||||
|               <span> | ||||
|                 <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" @click.stop="girdClick(item, index)" /> | ||||
|                 <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)" /> | ||||
|               </span> | ||||
|               <img src="./components/img/gird--select-icon.png" alt="" class="avatras" /> | ||||
|               <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" | ||||
|                    @click.stop="girdClick(item, index)"/> | ||||
|               <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)"/> | ||||
|               <img src="./components/img/gird--select-icon.png" alt="" class="avatras"/> | ||||
|             </div> | ||||
|             <div class="rightes"> | ||||
|               <div class="applicationNames">{{ item.girdName }}</div> | ||||
|               <img src="./components/img/right-icon.png" alt="" class="imgs" v-if="item.girdLevel != 2"/> | ||||
|             <div class="rightes fill"> | ||||
|               <div class="applicationNames fill">{{ item.girdName }}</div> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|  | ||||
|         <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty> | ||||
|         <AiEmpty :description="isGridMember?`暂无数据`:`当前人员不是网格员或网格长`" class="emptyWrap" v-else/> | ||||
|       </div> | ||||
|     </div> | ||||
|     <!-- <div style="padding-bottom: 70px;"></div> --> | ||||
|     <div class="subBtn" @click="submit"> | ||||
|       <div>确定选择</div> | ||||
|     <div class="subBtn" flex> | ||||
|       <div v-if="clearable" class="cancel" @click="cancel">清空</div> | ||||
|       <div @click="submit">确定选择</div> | ||||
|     </div> | ||||
|  | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
|  | ||||
| export default { | ||||
|   name: 'SelectGird', | ||||
|   data() { | ||||
| @@ -41,90 +43,92 @@ export default { | ||||
|       allData: null, | ||||
|       treeList: [], | ||||
|       slectList: [], | ||||
|       userGird: {}, | ||||
|       userList: [], | ||||
|       girdLevel: 0, | ||||
|       parentGirdId: '' | ||||
|       parentGirdId: '', | ||||
|       isFormMap: 0, //1为网格地图 一级不允许选中 | ||||
|     } | ||||
|   }, | ||||
|   onLoad() { | ||||
|     this.isGirdUser() | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     isMyGirds() { | ||||
|       return this.$route.query.self == true | ||||
|     }, | ||||
|     isGridMember() { | ||||
|       return this.user.girdCheckType > 0 | ||||
|     }, | ||||
|     //是否是网格员申报 | ||||
|     isApply: v => v.$route.query.formType == 2, | ||||
|     clearable: v => v.$route.query.clearable, | ||||
|     selected: v => [v.$route.query.selected].flat() | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     if (option.isFormMap) { | ||||
|       this.isFormMap = option.isFormMap | ||||
|     } | ||||
|     this.isGridMember || this.isApply ? this.getAllGrids() : this.$u.toast('当前人员不是网格员或网格长') | ||||
|   }, | ||||
|   methods: { | ||||
|     isGirdUser() { | ||||
|       this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           if (res.data.checkType) { | ||||
|             this.userGird = res.data | ||||
|             this.getTree() | ||||
|           } else { | ||||
|             this.$u.toast('当前人员不是网格员或网格管理员') | ||||
|           } | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     getTree() { | ||||
|     getAllGrids() { | ||||
|       this.slectList = [] | ||||
|       this.$http.post(`/app/appgirdinfo/queryAppGirdInfoByGirdLevel?girdLevel=${this.girdLevel}&girdMemberId=${this.userGird.girdMemberId}&parentGirdId=${this.parentGirdId}`).then((res) => { | ||||
|       let {girdMemberId} = this.user, | ||||
|           url = `/app/appgirdmemberinfo/queryMyGirdListByLevel2AndUser`, | ||||
|           params = {girdMemberId} | ||||
|       if (this.isApply) { | ||||
|         url = `/app/appgirdinfo/listByInfo` | ||||
|         params = {} | ||||
|       } | ||||
|       if (this.isMyGirds) { | ||||
|         url = `/app/appgirdmemberinfo/queryMyGirdListByLevel2` | ||||
|       } | ||||
|       this.$http.post(url, null, {params}).then((res) => { | ||||
|         if (res?.data) { | ||||
|           this.allData = res.data | ||||
|           let parents = res.data.map(e => e.parentGirdId) | ||||
|           this.allData = res.data.map(e => ({...e, hasChildren: parents.includes(e.id)})) | ||||
|           this.treeInit() | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     treeInit() { | ||||
|       this.treeList = this.allData | ||||
|       this.treeList.map((item) => { | ||||
|         item.isChecked = false | ||||
|       }) | ||||
|       var obj = { | ||||
|         girdName: '可选范围', | ||||
|         id: '', | ||||
|         girdLevel: '' | ||||
|       } | ||||
|       this.slectList.push(obj) | ||||
|     }, | ||||
|  | ||||
|     itemClick(row) { | ||||
|       if(row.girdLevel == 2) return | ||||
|       var obj = { | ||||
|         girdName: row.girdName, | ||||
|         id: row.id, | ||||
|         girdLevel: row.girdLevel | ||||
|       } | ||||
|       this.slectList.push(obj) | ||||
|       this.searckGird(row) | ||||
|     }, | ||||
|  | ||||
|     searckGird(row) { | ||||
|       if(row.girdLevel == 2) return | ||||
|       var girdLevel = Number(row.girdLevel)+1 | ||||
|       this.$http.post(`/app/appgirdinfo/queryAppGirdInfoByGirdLevel?girdLevel=${girdLevel}&girdMemberId=${this.userGird.girdMemberId}&parentGirdId=${row.id}`).then((res) => { | ||||
|         if (res?.data) { | ||||
|           this.treeList = res.data | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     girdNameClick(row, index) { | ||||
|       this.userList = [] | ||||
|       if(!index) { //第一级别 | ||||
|         this.slectList = [] | ||||
|         this.treeInit() | ||||
|       }else { | ||||
|         var list = [] | ||||
|         this.slectList.map((item, i) => { | ||||
|           if(i <= index) { | ||||
|             list.push(item) | ||||
|     treeInit(isClick) { | ||||
|       let last = uni.getStorageSync("lastSelectedGrid") | ||||
|       if (!isClick && last && !this.isApply) { | ||||
|         this.$http.post("/app/appgirdinfo/listFatherGirdInfo", null, { | ||||
|           params: {girdId: last} | ||||
|         }).then(res => { | ||||
|           if (res?.data) { | ||||
|             this.slectList = [{girdName: '可选范围', id: ''}, res.data.filter(e => !!this.allData.find(a => a.id == e.id))].flat() | ||||
|             this.getGridsByGridMemberAndParent({id: last}) | ||||
|           } | ||||
|         }) | ||||
|         this.slectList = list | ||||
|         this.searckGird(row) | ||||
|       } else { | ||||
|         this.treeList = this.allData.filter((e, i, arr) => !arr.map(e => e.id).includes(e.parentGirdId) || this.isMyGirds) | ||||
|         this.treeList.map((item) => item.isChecked = this.selected.includes(item.id)) | ||||
|         let obj = {girdName: '可选范围', id: ''} | ||||
|         this.slectList.push(obj) | ||||
|       } | ||||
|     }, | ||||
|     itemClick(row) { | ||||
|       if (row.hasChildren) { | ||||
|         let obj = { | ||||
|           girdName: row.girdName, | ||||
|           id: row.id, | ||||
|         } | ||||
|         this.slectList.push(obj) | ||||
|         this.getGridsByGridMemberAndParent(row) | ||||
|       } | ||||
|     }, | ||||
|     getGridsByGridMemberAndParent(row) { | ||||
|       let {id: parentGirdId} = row | ||||
|       this.treeList = this.allData.filter(e => e.parentGirdId == parentGirdId) | ||||
|       this.treeList.map((item) => item.isChecked = this.selected.includes(item.id)) | ||||
|     }, | ||||
|     girdNameClick(row, index) { | ||||
|       if (!index) { //第一级别 | ||||
|         this.slectList = [] | ||||
|         this.treeInit(true) | ||||
|       } else { | ||||
|         this.slectList.splice(index, 8) | ||||
|         this.getGridsByGridMemberAndParent(row) | ||||
|       } | ||||
|     }, | ||||
|      | ||||
|  | ||||
|     girdClick(row, index) { | ||||
|       if (this.treeList[index].isChecked) {//取消 | ||||
|         this.treeList[index].isChecked = false | ||||
| @@ -138,29 +142,38 @@ export default { | ||||
|       } | ||||
|       this.$forceUpdate() | ||||
|     }, | ||||
|  | ||||
|  | ||||
|     submit() { | ||||
|       if (this.SelectGird.id != null) { | ||||
|         uni.$emit('goback', this.SelectGird) | ||||
|         uni.navigateBack() | ||||
|         if (!this.isApply && !this.isMyGirds) { | ||||
|           uni.setStorageSync("lastSelectedGrid", this.SelectGird.parentGirdId) | ||||
|         } | ||||
|         uni.navigateBack({ | ||||
|           success: () => { | ||||
|             uni.$emit("pagePicker:custom", this.SelectGird) | ||||
|           } | ||||
|         }) | ||||
|       } else { | ||||
|         return this.$u.toast('请选择网格') | ||||
|       } | ||||
|     }, | ||||
|     cancel() { | ||||
|       this.SelectGird = {} | ||||
|       uni.navigateBack({ | ||||
|         success: () => { | ||||
|           uni.$emit("pagePicker:custom", this.SelectGird) | ||||
|         } | ||||
|       }) | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .SelectGird { | ||||
|   height: 100%; | ||||
|   min-height: 100vh; | ||||
|   background: #fff; | ||||
|   padding-bottom: 140px; | ||||
|   .header-top { | ||||
|     background: #fff; | ||||
|     padding: 20px 32px; | ||||
|   } | ||||
|   box-sizing: border-box; | ||||
|  | ||||
|   .header-middle { | ||||
|     .hint { | ||||
| @@ -173,11 +186,6 @@ export default { | ||||
|     } | ||||
|  | ||||
|     .showTypes { | ||||
|       .empty-div { | ||||
|         height: 16px; | ||||
|         background: #f5f5f5; | ||||
|       } | ||||
|  | ||||
|       .cards { | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
| @@ -203,82 +211,32 @@ export default { | ||||
|             margin-left: 36px; | ||||
|           } | ||||
|         } | ||||
|  | ||||
|         img { | ||||
|           width: 74px; | ||||
|           height: 74px; | ||||
|           border-radius: 8px; | ||||
|         } | ||||
|  | ||||
|         .rightes { | ||||
|           width: calc(100% - 188px); | ||||
|           display: flex; | ||||
|           justify-content: space-between; | ||||
|           align-items: center; | ||||
|           margin-left: 32px; | ||||
|           border-bottom: 1px solid #e4e5e6; | ||||
|           padding: 0 16px; | ||||
|  | ||||
|           .applicationNames { | ||||
|             width: calc(100% - 100px); | ||||
|             display: inline-block; | ||||
|             font-size: 36px; | ||||
|             font-weight: 500; | ||||
|             color: #333333; | ||||
|             overflow:hidden;  | ||||
|             text-overflow:ellipsis;  | ||||
|             white-space:nowrap; | ||||
|           } | ||||
|           .imgs { | ||||
|             width: 60px; | ||||
|             height: 60px; | ||||
|             vertical-align: middle; | ||||
|             margin-right: 32px; | ||||
|             overflow: hidden; | ||||
|             text-overflow: ellipsis; | ||||
|             white-space: nowrap; | ||||
|             vertical-align: bottom; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     .showUsers { | ||||
|       .cards { | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         height: 120px; | ||||
|         line-height: 120px; | ||||
|         // background: pink; | ||||
|         padding: 0 0 0 32px; | ||||
|  | ||||
|         .imges { | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
|           width: 200px; | ||||
|           .imgselect { | ||||
|             width: 48px; | ||||
|             height: 48px; | ||||
|           } | ||||
|  | ||||
|           .avatras { | ||||
|             width: 74px; | ||||
|             height: 74px; | ||||
|             border-radius: 8px; | ||||
|             margin-left: 36px; | ||||
|           } | ||||
|         } | ||||
|  | ||||
|         .rights { | ||||
|           width: 100%; | ||||
|           display: flex; | ||||
|           justify-content: space-between; | ||||
|           align-items: center; | ||||
|           margin-left: 32px; | ||||
|           border-bottom: 1px solid #e4e5e6; | ||||
|           padding-right: 40px; | ||||
|           .applicationNames { | ||||
|             font-size: 36px; | ||||
|             font-weight: 500; | ||||
|             color: #333333; | ||||
|           } | ||||
|           .idNumbers { | ||||
|             color: #666; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .subBtn { | ||||
| @@ -288,17 +246,25 @@ export default { | ||||
|     width: 100%; | ||||
|     height: 118px; | ||||
|     background: #f4f8fb; | ||||
|     justify-content: flex-end; | ||||
|  | ||||
|     div { | ||||
|       width: 192px; | ||||
|       height: 80px; | ||||
|       line-height: 80px; | ||||
|       text-align: center; | ||||
|       border: 2px solid #1365dd; | ||||
|       background: #1365dd; | ||||
|       border-radius: 4px; | ||||
|       font-size: 32px; | ||||
|       color: #fff; | ||||
|       margin: 20px 34px 0 0; | ||||
|       float: right; | ||||
|       margin-right: 32px; | ||||
|  | ||||
|       &.cancel { | ||||
|         color: #333; | ||||
|         background: #fff; | ||||
|         border-color: #ddd; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   | ||||
| @@ -1,369 +1,148 @@ | ||||
| <template> | ||||
|   <div class="setGird"> | ||||
|     <div class="header-middle"> | ||||
|       <div class="hint"> | ||||
|         <span v-for="(item, index) in slectList" :key="index"><span v-if="index" style="margin:0 4px;">/</span><span style="color:#3F8DF5" @click="girdNameClick(item, index)">{{item.girdName}}</span></span> | ||||
|       </div> | ||||
|  | ||||
|       <div class="showTypes" v-if="!userList.length"> | ||||
|     <AiGroup> | ||||
|       <AiItem :label="detail.girdName" :border="false" labelBold> | ||||
|         <u-icon name="arrow-right" label="查看网格成员" label-pos="left" label-color="#3F8DF5" @click="showGirdInfo()"/> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <AiGroup> | ||||
|       <AiItem label="下级网格" top-label :border="false" labelBold> | ||||
|         <div v-if="treeList.length > 0"> | ||||
|           <div class="cards" v-for="(item, index) in treeList" :key="index"> | ||||
|             <div class="imges"> | ||||
|               <!-- <span v-if="item.girdRight == 1 && item.girdLevel != 2"> | ||||
|                 <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" @click.stop="girdClick(item, index)" /> | ||||
|                 <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)" /> | ||||
|               </span> | ||||
|               <span v-else style="width:24px;"></span> --> | ||||
|               <img src="./components/img/gird--select-icon.png" alt="" class="avatras" /> | ||||
|             </div> | ||||
|             <div class="rightes"> | ||||
|               <div class="applicationNames" @click="showGirdInfo(item)">{{ item.girdName }}</div> | ||||
|               <div class="right-icon" v-if="item.girdLevel != 2" @click="itemClick(item)" > | ||||
|                 <img src="./components/img/right-icon.png" alt="" class="imgs" /> | ||||
|               </div> | ||||
|             <div class="rightes fill" flex> | ||||
|               <img src="./components/img/gird--select-icon.png" alt="" class="avatras"/> | ||||
|               <div class="applicationNames fill" @click="showGirdInfo(item)">{{ item.girdName }}</div> | ||||
|               <u-icon @click="itemClick(item)" name="arrow-right" color="#ddd"/> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|  | ||||
|         <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty> | ||||
|       </div> | ||||
|         <AiEmpty description="暂无数据" class="emptyWrap" v-else/> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <div class="subBtn" v-if="detail.girdRight==1" flex> | ||||
|       <div class="delete" @click="handleDelete">删除网格</div> | ||||
|       <div @click="edit">编辑网格</div> | ||||
|       <div @click="toAddGird">添加下级网格</div> | ||||
|     </div> | ||||
|     <!-- <div style="padding-bottom: 70px;"></div> --> | ||||
|     <!-- <div class="subBtn" @click="toAddGird" v-if="slectList.length && slectList[slectList.length-1].girdLevel != 1"> | ||||
|       <div>添加网格</div> | ||||
|     </div> --> | ||||
|  | ||||
|      <u-popup v-model="show" mode="bottom" border-radius="14" height="1000"> | ||||
|       <div class="popup"> | ||||
|         <div class="bg"></div> | ||||
|         <div class="title">{{ form.girdName }}</div> | ||||
|        <div class="info-flex"> | ||||
|           <span class="label">网格类型</span> | ||||
|           <span class="value">{{ $dict.getLabel('girdType', form.girdType) }}</span> | ||||
|         </div> | ||||
|         <div class="info-flex"> | ||||
|           <span class="label">网格层级</span> | ||||
|           <span class="value">{{ $dict.getLabel('girdLevel', form.girdLevel) }}</span> | ||||
|         </div> | ||||
|         <div v-if="form.girdMemberManageList && form.girdMemberManageList.length"> | ||||
|           <div class="info-flex" v-for="(item, index) in  form.girdMemberManageList" :key="index"> | ||||
|             <span class="label">网格长</span> | ||||
|             <span class="value">{{ item.name }}  {{ item.phone }} | ||||
|               <img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(item.phone)" class="phone-icon" | ||||
|                    v-if="item.phone"> | ||||
|             </span> | ||||
|           </div> | ||||
|         </div> | ||||
|         <div v-if="form.girdMemberList && form.girdMemberList.length"> | ||||
|           <div class="info-flex" v-for="(item, index) in  form.girdMemberList" :key="index"> | ||||
|             <span class="label">网格员</span> | ||||
|             <span class="value">{{ item.name }}  {{ item.phone }} | ||||
|               <img :src="$cdn + 'common/phone.png'" alt="" @click="callPhone(item.phone)" class="phone-icon" | ||||
|                    v-if="item.phone"> | ||||
|             </span> | ||||
|           </div> | ||||
|         </div> | ||||
|         <div style="height:56px;"></div> | ||||
|         <div class="btn"> | ||||
|           <span class="del mar-r32" @click="del" v-if="form.girdRight == 1">删除网格</span> | ||||
|           <span class="edit mar-r32" @click="edit" v-if="form.girdRight == 1">编辑网格</span> | ||||
|           <span class="edit" :class="form.girdRight == 1 ? '' : 'flex1'" v-if="form.girdLevel != 2" @click="toAddGird">添加下级网格</span> | ||||
|         </div> | ||||
|       </div> | ||||
|     </u-popup> | ||||
|  | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from "vuex" | ||||
|  | ||||
| export default { | ||||
|   name: 'setGird', | ||||
|   data() { | ||||
|     return { | ||||
|       setGird: {}, | ||||
|       allData: null, | ||||
|       detail: {}, | ||||
|       treeList: [], | ||||
|       slectList: [], | ||||
|       userList: [], | ||||
|  | ||||
|       show: false, | ||||
|       form: {}, | ||||
|     } | ||||
|   }, | ||||
|   onLoad() { | ||||
|     this.$dict.load('girdType', 'girdLevel') | ||||
|     this.isGirdUser() | ||||
|     uni.$on('update',  () => { | ||||
|       this.show = false | ||||
|       this.getTree() | ||||
|     }) | ||||
|   computed: { | ||||
|     ...mapState(['user']) | ||||
|   }, | ||||
|   onShow() { | ||||
|     this.getAllGrids() | ||||
|     document.title = '网格配置' | ||||
|   }, | ||||
|   methods: { | ||||
|     isGirdUser() { | ||||
|       this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           if (res.data.checkType) { | ||||
|             this.userGird = res.data | ||||
|             this.getTree() | ||||
|           } else { | ||||
|             this.$u.toast('当前人员不是网格员或网格管理员') | ||||
|           } | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     getTree() { | ||||
|       this.slectList = [] | ||||
|       this.$http.post(`/app/appgirdinfo/queryAppGirdInfoByGirdLevel?girdLevel=0&girdMemberId=${this.userGird.girdMemberId}&parentGirdId=`).then((res) => { | ||||
|     getAllGrids() { | ||||
|       let {id: parentGirdId} = this.$route.query | ||||
|       this.$http.post(`/app/appgirdinfo/listByInfo`, null, { | ||||
|         params: {parentGirdId} | ||||
|       }).then(res => { | ||||
|         if (res?.data) { | ||||
|           this.allData = res.data | ||||
|           this.treeInit() | ||||
|           let parents = [...new Set(res.data.map(e => e.parentGirdId))] | ||||
|           this.detail = res.data.find(e => e.id == parentGirdId) || {} | ||||
|           this.treeList = res.data.filter(e => e.parentGirdId == parentGirdId).map(e => ({...e, hasChildren: parents.includes(e.id)})) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     treeInit() { | ||||
|       this.treeList = this.allData | ||||
|       this.treeList.map((item) => { | ||||
|         item.isChecked = false | ||||
|       }) | ||||
|       var obj = { | ||||
|         girdName: '可选范围', | ||||
|         id: '', | ||||
|         girdLevel: '0' | ||||
|       } | ||||
|       this.slectList.push(obj) | ||||
|     }, | ||||
|  | ||||
|     itemClick(row) { | ||||
|       if(row.girdLevel == 2) return | ||||
|       var obj = { | ||||
|         girdName: row.girdName, | ||||
|         id: row.id, | ||||
|         girdLevel: row.girdLevel | ||||
|       } | ||||
|       this.slectList.push(obj) | ||||
|       this.searckGird(row) | ||||
|       uni.navigateTo({url: `./SetGird?id=${row.id}`}) | ||||
|     }, | ||||
|  | ||||
|     searckGird(row) { | ||||
|       if(row.girdLevel == 2) return | ||||
|       var girdLevel = Number(row.girdLevel)+1 | ||||
|       this.$http.post(`/app/appgirdinfo/queryAppGirdInfoByGirdLevel?girdLevel=${girdLevel}&girdMemberId=${this.userGird.girdMemberId}&parentGirdId=${row.id}`).then((res) => { | ||||
|         if (res?.data) { | ||||
|           this.treeList = res.data | ||||
|           this.setGird = {} | ||||
|         } | ||||
|       }) | ||||
|     showGirdInfo(row = {id: this.$route.query.id}) { | ||||
|       uni.navigateTo({url: `./gridMembers?id=${row.id}`}) | ||||
|     }, | ||||
|  | ||||
|     girdNameClick(row, index) { | ||||
|       this.userList = [] | ||||
|       if(!index) { //第一级别 | ||||
|         this.slectList = [] | ||||
|         this.treeInit() | ||||
|       }else { | ||||
|         var list = [] | ||||
|         this.slectList.map((item, i) => { | ||||
|           if(i <= index) { | ||||
|             list.push(item) | ||||
|           } | ||||
|         }) | ||||
|         this.slectList = list | ||||
|         this.searckGird(row) | ||||
|       } | ||||
|     }, | ||||
|      | ||||
|  | ||||
|     girdClick(row, index) { | ||||
|       if (this.treeList[index].isChecked) {//取消 | ||||
|         this.treeList[index].isChecked = false | ||||
|         this.setGird = {} | ||||
|       } else { | ||||
|         this.treeList.map((item) => { | ||||
|           item.isChecked = false | ||||
|         }) | ||||
|         this.treeList[index].isChecked = true | ||||
|         this.setGird = row | ||||
|       } | ||||
|       this.$forceUpdate() | ||||
|     }, | ||||
|  | ||||
|     showGirdInfo(row) { | ||||
|       this.show = true | ||||
|       this.form = row | ||||
|     }, | ||||
|  | ||||
|     del() { | ||||
|       this.$confirm(`是否删除该网格?`).then(() => { | ||||
|         this.$http.post(`/app/appgirdinfo/delete?ids=${this.form.id}`).then((res) => { | ||||
|           if (res.code == 0) { | ||||
|             this.$u.toast('删除成功!') | ||||
|             this.show = false | ||||
|             this.form = {} | ||||
|             this.treeList = [] | ||||
|             this.isGirdUser() | ||||
|           } | ||||
|         }).catch((err) => { | ||||
|           this.$u.toast(err) | ||||
|         }) | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     edit() { | ||||
|       uni.navigateTo({url: `./AddGird?id=${this.form.id}&fromType=edit`}) | ||||
|     }, | ||||
|  | ||||
|     callPhone(phone) { | ||||
|       uni.makePhoneCall({phoneNumber: phone}) | ||||
|     }, | ||||
|  | ||||
|     toAddGird() { | ||||
|       console.log(this.setGird) | ||||
|       // if (this.setGird.id != null) { | ||||
|       //   uni.navigateTo({url: `./AddGird?id=${this.setGird.id}&fromType=add`}) | ||||
|       // } else { | ||||
|       //   return this.$u.toast('请选择网格') | ||||
|       // } | ||||
|       uni.navigateTo({url: `./AddGird?id=${this.form.id}&fromType=add`}) | ||||
|     } | ||||
|       uni.navigateTo({url: `./AddGird?id=${this.detail.id}&fromType=add`}) | ||||
|     }, | ||||
|     edit() { | ||||
|       uni.navigateTo({url: `./AddGird?id=${this.detail.id}&fromType=edit`}) | ||||
|     }, | ||||
|     handleDelete() { | ||||
|       this.$confirm('删除网格后,会清除网格内网格员的责任家庭信息,如有下级网格,会同步删除下级网格所有数据', `您确认要删除该网格?`).then(() => { | ||||
|         this.$http.post(`/app/appgirdinfo/delete?ids=${this.detail.id}`).then((res) => { | ||||
|           if (res?.code == 0) { | ||||
|             this.$u.toast('删除成功!') | ||||
|             uni.navigateBack({}) | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .setGird { | ||||
|   height: 100%; | ||||
|   background: #fff; | ||||
|   min-height: 100vh; | ||||
|   background: #F5F6F7; | ||||
|   padding-bottom: 140px; | ||||
|   .header-top { | ||||
|     background: #fff; | ||||
|     padding: 20px 32px; | ||||
|   box-sizing: border-box; | ||||
|  | ||||
|   .empty-div { | ||||
|     height: 16px; | ||||
|     background: #f5f5f5; | ||||
|   } | ||||
|  | ||||
|   .header-middle { | ||||
|     .hint { | ||||
|       padding: 28px 20px 28px 32px; | ||||
|       line-height: 56px; | ||||
|       box-shadow: 0px 1px 0px 0px #e4e5e6; | ||||
|       font-size: 30px; | ||||
|       font-weight: 500; | ||||
|       word-break: break-all; | ||||
|   .cards { | ||||
|     display: flex; | ||||
|     align-items: center; | ||||
|     height: 120px; | ||||
|     line-height: 120px; | ||||
|     // background: pink; | ||||
|  | ||||
|     .avatras { | ||||
|       width: 74px; | ||||
|       height: 74px; | ||||
|       border-radius: 8px; | ||||
|       margin-right: 20px; | ||||
|     } | ||||
|  | ||||
|     .showTypes { | ||||
|       .empty-div { | ||||
|         height: 16px; | ||||
|         background: #f5f5f5; | ||||
|       } | ||||
|  | ||||
|       .cards { | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         height: 120px; | ||||
|         line-height: 120px; | ||||
|         // background: pink; | ||||
|         padding: 0 0 0 32px; | ||||
|  | ||||
|         .imges { | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
|           // width: 200px; | ||||
|           .imgselect { | ||||
|             width: 48px; | ||||
|             height: 48px; | ||||
|             vertical-align: middle; | ||||
|           } | ||||
|  | ||||
|           .avatras { | ||||
|             width: 74px; | ||||
|             height: 74px; | ||||
|             border-radius: 8px; | ||||
|             margin-left: 36px; | ||||
|           } | ||||
|         } | ||||
|         img { | ||||
|           width: 74px; | ||||
|           height: 74px; | ||||
|           border-radius: 8px; | ||||
|         } | ||||
|         .rightes { | ||||
|           width: calc(100% - 140px); | ||||
|           display: flex; | ||||
|           justify-content: space-between; | ||||
|           align-items: center; | ||||
|           margin-left: 32px; | ||||
|           border-bottom: 1px solid #e4e5e6; | ||||
|           .applicationNames { | ||||
|             width: calc(100% - 100px); | ||||
|             font-size: 36px; | ||||
|             font-weight: 500; | ||||
|             color: #333333; | ||||
|             overflow:hidden;  | ||||
|             text-overflow:ellipsis;  | ||||
|             white-space:nowrap; | ||||
|           } | ||||
|           .right-icon{ | ||||
|             width: 100px; | ||||
|             padding-right: 32px; | ||||
|             box-sizing: border-box; | ||||
|             text-align: right; | ||||
|              .imgs { | ||||
|               width: 60px; | ||||
|               height: 60px; | ||||
|               vertical-align: middle; | ||||
|             } | ||||
|           } | ||||
|           | ||||
|         } | ||||
|       } | ||||
|     img { | ||||
|       width: 74px; | ||||
|       height: 74px; | ||||
|       border-radius: 8px; | ||||
|     } | ||||
|  | ||||
|     .showUsers { | ||||
|       .cards { | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         height: 120px; | ||||
|         line-height: 120px; | ||||
|         // background: pink; | ||||
|         padding: 0 0 0 32px; | ||||
|     .rightes { | ||||
|       display: flex; | ||||
|       border-bottom: 1px solid #e4e5e6; | ||||
|       padding-right: 16px; | ||||
|  | ||||
|         .imges { | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
|           width: 200px; | ||||
|           .imgselect { | ||||
|             width: 48px; | ||||
|             height: 48px; | ||||
|           } | ||||
|       .applicationNames { | ||||
|         display: inline-block; | ||||
|         font-size: 36px; | ||||
|         font-weight: 500; | ||||
|         color: #333333; | ||||
|         overflow: hidden; | ||||
|         text-overflow: ellipsis; | ||||
|         white-space: nowrap; | ||||
|         vertical-align: bottom; | ||||
|       } | ||||
|  | ||||
|           .avatras { | ||||
|             width: 74px; | ||||
|             height: 74px; | ||||
|             border-radius: 8px; | ||||
|             margin-left: 36px; | ||||
|           } | ||||
|         } | ||||
|       .imgs { | ||||
|         width: 40px; | ||||
|         height: 40px; | ||||
|         margin-right: 0; | ||||
|         vertical-align: middle; | ||||
|       } | ||||
|  | ||||
|         .rights { | ||||
|           width: 100%; | ||||
|           display: flex; | ||||
|           justify-content: space-between; | ||||
|           align-items: center; | ||||
|           margin-left: 32px; | ||||
|           border-bottom: 1px solid #e4e5e6; | ||||
|           padding-right: 40px; | ||||
|           .applicationNames { | ||||
|             font-size: 36px; | ||||
|             font-weight: 500; | ||||
|             color: #333333; | ||||
|           } | ||||
|           .idNumbers { | ||||
|             color: #666; | ||||
|           } | ||||
|         } | ||||
|       .u-icon { | ||||
|         padding: 0 16px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| @@ -375,104 +154,30 @@ export default { | ||||
|     width: 100%; | ||||
|     height: 118px; | ||||
|     background: #f4f8fb; | ||||
|     font-family: PingFangSC-Medium, PingFang SC; | ||||
|     justify-content: flex-end; | ||||
|  | ||||
|     div { | ||||
|       width: 192px; | ||||
|       height: 80px; | ||||
|       line-height: 80px; | ||||
|       padding: 0 32px; | ||||
|       height: 88px; | ||||
|       line-height: 88px; | ||||
|       text-align: center; | ||||
|       background: #1365dd; | ||||
|       border-radius: 4px; | ||||
|       border-radius: 8px; | ||||
|       font-size: 32px; | ||||
|       color: #fff; | ||||
|       margin: 20px 34px 0 0; | ||||
|       float: right; | ||||
|     } | ||||
|   } | ||||
|       margin-left: 22px; | ||||
|       border: 2px #1365dd solid; | ||||
|  | ||||
|   .popup { | ||||
|     padding: 0 32px 16px; | ||||
|  | ||||
|     .bg { | ||||
|       width: 64px; | ||||
|       height: 10px; | ||||
|       background: #CCC; | ||||
|       border-radius: 6px; | ||||
|       margin: 32px 0 32px 344px; | ||||
|     } | ||||
|  | ||||
|     .title { | ||||
|       font-size: 36px; | ||||
|       font-family: PingFang-SC-Heavy, PingFang-SC; | ||||
|       font-weight: 800; | ||||
|       color: #333; | ||||
|       line-height: 50px; | ||||
|       margin-bottom: 24px; | ||||
|     } | ||||
|  | ||||
|     .info-flex { | ||||
|       padding: 26px 0 30px 0; | ||||
|       width: 100%; | ||||
|       border-bottom: 1px solid #D8DDE6; | ||||
|       line-height: 40px; | ||||
|       font-size: 28px; | ||||
|  | ||||
|       .label { | ||||
|         display: inline-block; | ||||
|         width: 160px; | ||||
|         font-weight: 800; | ||||
|         color: #333; | ||||
|       } | ||||
|  | ||||
|       .value { | ||||
|         color: #666; | ||||
|         font-size: 26px; | ||||
|  | ||||
|         .phone-icon { | ||||
|           width: 40px; | ||||
|           height: 40px; | ||||
|           vertical-align: sub; | ||||
|           margin-left: 16px; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     .border-b0{ | ||||
|       border-bottom: 0; | ||||
|     } | ||||
|     .btn{ | ||||
|       width: 100%; | ||||
|       padding: 32px; | ||||
|       box-sizing: border-box; | ||||
|       background-color: #fff; | ||||
|       display: flex; | ||||
|       position: fixed; | ||||
|       bottom: 0; | ||||
|       left: 0; | ||||
|       span{ | ||||
|         display: inline-block; | ||||
|         height: 92px; | ||||
|         line-height: 90px; | ||||
|         border-radius: 8px; | ||||
|         font-size: 32px; | ||||
|         font-family: PingFangSC-Medium, PingFang SC; | ||||
|         font-weight: 500; | ||||
|         box-sizing: border-box; | ||||
|         padding: 0 28px; | ||||
|       } | ||||
|       .del{ | ||||
|       &.delete { | ||||
|         background: #fff; | ||||
|         color: #f46; | ||||
|         border: 1px solid #f46; | ||||
|         border-color: #f46; | ||||
|       } | ||||
|       .edit{ | ||||
|         background-color: #3671EE; | ||||
|         color: #fff; | ||||
|       } | ||||
|       .mar-r32{ | ||||
|  | ||||
|       &:last-of-type { | ||||
|         margin-right: 32px; | ||||
|       } | ||||
|       .flex1{ | ||||
|         width: 100%; | ||||
|         text-align: center; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
|   | ||||
| @@ -26,27 +26,14 @@ | ||||
|  | ||||
|     <div class="bottom"> | ||||
|       <div class="girdMsg">网格信息</div> | ||||
|  | ||||
|       <div class="girdCont"> | ||||
|         <div class="boxes"> | ||||
|           <span class="boxesLeft">网格名称</span> | ||||
|  | ||||
|           <span class="boxesRight">{{ girdMsgList.girdName || '' }}</span> | ||||
|           <!-- <span class="boxesRight">{{ girdUser.appGirdInfo.girdName }}</span> --> | ||||
|           <span class="boxesRight">{{ gridInfo.girdName || '' }}</span> | ||||
|         </div> | ||||
|  | ||||
|         <div class="boxes"> | ||||
|           <span class="boxesLeft">网格类型</span> | ||||
|  | ||||
|           <span class="boxesRight"> | ||||
|             {{ $dict.getLabel('girdType', girdMsgList.girdType) || '' }} | ||||
|           </span> | ||||
|         </div> | ||||
|  | ||||
|         <div class="boxes"> | ||||
|           <span class="boxesLeft">网格层级</span> | ||||
|  | ||||
|           <span class="boxesRight">{{ $dict.getLabel('girdLevel', girdMsgList.girdLevel) || '' }}</span> | ||||
|           <span class="boxesLeft">标绘状态</span> | ||||
|           <span class="boxesRight">{{ gridInfo.plottingStatus == 1 ? '已标绘' : '未标绘' }}</span> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
| @@ -64,56 +51,37 @@ export default { | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       girdUser: [], | ||||
|       peopleList: {}, | ||||
|       girdMsgList: {}, | ||||
|       gridInfo: {}, | ||||
|       checkType: '', | ||||
|     } | ||||
|   }, | ||||
|   computed: {}, | ||||
|   watch: {}, | ||||
|   onLoad() {}, | ||||
|   created() { | ||||
|     this.$dict.load('girdType', 'girdLevel').then(() => { | ||||
|       this.isGirdUser() | ||||
|       this.girdMsgList = this.params | ||||
|       this.getList() | ||||
|     }) | ||||
|  | ||||
|     this.gridInfo = this.params | ||||
|     this.getList() | ||||
|     uni.$on('goback', (res) => { | ||||
|       this.girdMsgList = res | ||||
|       this.gridInfo = res | ||||
|       this.getList() | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
|     isGirdUser() { | ||||
|       this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.girdUser = res.data | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     getList() { | ||||
|       this.$http.post(`/app/appgirdmemberinfo/girdMemberAndResidentStatistic?girdId=${this.girdMsgList.id}`).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|       this.$http.post(`/app/appgirdmemberinfo/girdMemberAndResidentStatistic?girdId=${this.gridInfo.id}`).then((res) => { | ||||
|         if (res?.data) { | ||||
|           this.peopleList = res.data | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({ url }) | ||||
|       uni.navigateTo({url}) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| uni-page-body { | ||||
|   height: 100%; | ||||
| } | ||||
| .Statistics { | ||||
|   padding: 0 30px 0; | ||||
|   padding: 0 30px; | ||||
|   box-sizing: border-box; | ||||
|  | ||||
|   .middle { | ||||
| @@ -121,25 +89,30 @@ uni-page-body { | ||||
|     border-radius: 16px; | ||||
|     margin-top: 32px; | ||||
|     padding: 32px 0 60px 0; | ||||
|  | ||||
|     .girdPeople { | ||||
|       padding: 0 0 56px 24px; | ||||
|       font-size: 32px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #333333; | ||||
|     } | ||||
|  | ||||
|     .card { | ||||
|       display: flex; | ||||
|       justify-content: space-around; | ||||
|  | ||||
|       .box { | ||||
|         display: flex; | ||||
|         flex-direction: column; | ||||
|         align-items: center; | ||||
|  | ||||
|         .count { | ||||
|           font-size: 64px; | ||||
|           font-family: DINAlternate-Bold, DINAlternate; | ||||
|           font-weight: bold; | ||||
|           color: #3b424a; | ||||
|         } | ||||
|  | ||||
|         .girdCount { | ||||
|           margin-top: 8px; | ||||
|           font-size: 28px; | ||||
| @@ -156,16 +129,19 @@ uni-page-body { | ||||
|     border-radius: 16px; | ||||
|     margin-top: 32px; | ||||
|     padding: 0 24px 64px 24px; | ||||
|  | ||||
|     .girdMsg { | ||||
|       padding: 32px 0; | ||||
|       font-size: 32px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #333333; | ||||
|     } | ||||
|  | ||||
|     .girdCont { | ||||
|       .boxes { | ||||
|         padding: 24px 0 30px 0; | ||||
|         box-shadow: inset 0px -1px 0px 0px #d8dde6; | ||||
|  | ||||
|         .boxesLeft { | ||||
|           font-size: 30px; | ||||
|           font-family: PingFang-SC-Heavy, PingFang-SC; | ||||
| @@ -175,6 +151,7 @@ uni-page-body { | ||||
|           width: 140px; | ||||
|           vertical-align: top; | ||||
|         } | ||||
|  | ||||
|         .boxesRight { | ||||
|           margin-left: 40px; | ||||
|           font-size: 28px; | ||||
|   | ||||
| @@ -84,11 +84,6 @@ export default { | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     toSelectUser() { | ||||
|       console.log(123) | ||||
|       uni.navigateTo({ url: './SelectUser' }) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|   | ||||
| @@ -1,15 +1,15 @@ | ||||
| <template> | ||||
|   <div class="AppHandSnapshot"> | ||||
|     <component v-if="refresh && isAdmin" :is="component" @change="onChange" :params="params"> </component> | ||||
|     <div class="tabs" v-if="isTab && isAdmin"> | ||||
|     <component v-if="refresh && isGridMember" :is="component" @change="onChange" :params="params"/> | ||||
|     <div class="tabs" v-if="isTab && isGridMember"> | ||||
|       <div class="item" @click="tabClick(index, item.component)" v-for="(item, index) in tabs" :key="index"> | ||||
|         <img :src="tabIndex == index ? item.activeImg : item.img" alt="" /> | ||||
|         <img :src="tabIndex == index ? item.activeImg : item.img" alt=""/> | ||||
|         <p :class="tabIndex == index ? 'color-3267F0' : ''">{{ item.text }}</p> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div v-if="!isAdmin" class="empty"> | ||||
|     <div v-if="!isGridMember" class="empty"> | ||||
|       <img src="./components/img/no-admin.png" alt=""> | ||||
|       <p>没有网格员权限<br />无法查看随手拍信息哦~</p> | ||||
|       <p>没有网格员权限<br/>无法查看随手拍信息哦~</p> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
| @@ -18,11 +18,11 @@ | ||||
| import List from './List.vue' | ||||
| import Statistics from './Statistics.vue' | ||||
| import Set from './Set.vue' | ||||
| import {mapState} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   name: 'AppHandSnapshot', | ||||
|   appName: '随手拍', | ||||
|  | ||||
|   data() { | ||||
|     return { | ||||
|       component: 'List', | ||||
| @@ -50,10 +50,14 @@ export default { | ||||
|         // } | ||||
|       ], | ||||
|       isTab: true, | ||||
|       isAdmin: false | ||||
|     } | ||||
|   }, | ||||
|  | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     isGridMember() { | ||||
|       return this.user.girdCheckType > 0 | ||||
|     } | ||||
|   }, | ||||
|   components: { | ||||
|     List, | ||||
|     Statistics, | ||||
| @@ -72,20 +76,7 @@ export default { | ||||
|       this.$nextTick(() => { | ||||
|         this.refresh = true | ||||
|       }) | ||||
|     }, | ||||
|     isGirdUser() { | ||||
|       this.isAdmin = false | ||||
|       this.$http.post('/app/appgirdmemberinfo/checkLogOnUser').then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           if (res.data.checkType != '0') { | ||||
|             this.isAdmin = true | ||||
|           } | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|   }, | ||||
|   onLoad() { | ||||
|     this.isGirdUser() | ||||
|     } | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '随手拍' | ||||
| @@ -95,10 +86,10 @@ export default { | ||||
|     uni.$on('showTab', () => { | ||||
|       this.isTab = true | ||||
|     }) | ||||
|      | ||||
|  | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     if(!this.tabIndex) { | ||||
|     if (!this.tabIndex) { | ||||
|       uni.$emit('nextList') | ||||
|     } | ||||
|   }, | ||||
| @@ -109,6 +100,7 @@ export default { | ||||
| .AppHandSnapshot { | ||||
|   height: 100%; | ||||
| } | ||||
|  | ||||
| .tabs { | ||||
|   width: 100%; | ||||
|   height: 98px; | ||||
| @@ -118,14 +110,17 @@ export default { | ||||
|   bottom: 0; | ||||
|   left: 0; | ||||
|   display: flex; | ||||
|  | ||||
|   .item { | ||||
|     flex: 1; | ||||
|     text-align: center; | ||||
|  | ||||
|     img { | ||||
|       width: 56px; | ||||
|       height: 56px; | ||||
|       margin-top: 8px; | ||||
|     } | ||||
|  | ||||
|     p { | ||||
|       font-size: 22px; | ||||
|       font-family: PingFangSC-Medium, PingFang SC; | ||||
| @@ -133,19 +128,23 @@ export default { | ||||
|       color: #c4cad4; | ||||
|       line-height: 8px; | ||||
|     } | ||||
|  | ||||
|     .color-3267F0 { | ||||
|       color: #3267f0; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| .empty{ | ||||
|  | ||||
| .empty { | ||||
|   text-align: center; | ||||
|   img{ | ||||
|  | ||||
|   img { | ||||
|     width: 282px; | ||||
|     height: 306px; | ||||
|     margin: 136px auto 0; | ||||
|   } | ||||
|   p{ | ||||
|  | ||||
|   p { | ||||
|     font-size: 28px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     color: #999; | ||||
|   | ||||
| @@ -3,17 +3,18 @@ | ||||
|     <div class="contents"> | ||||
|       <u-form :model="forms" ref="uForm" label-width="auto" :border-bottom="false"> | ||||
|         <u-form-item label="转交给" prop="status" required :border-bottom="false" right-icon="arrow-right" class="first-form" v-if="status == 1"> | ||||
|           <u-input v-model="forms.name" placeholder="请选择转交对象" @click="toSelectUser" disabled /> | ||||
|           <u-input v-model="forms.name" placeholder="请选择转交对象" @click="toSelectUser" disabled/> | ||||
|         </u-form-item> | ||||
|         <u-form-item label="事件分类" prop="groupName" required :border-bottom="false" right-icon="arrow-right" v-if="status != 1"> | ||||
|           <!-- <u-input v-model="forms.groupName" placeholder="请选择事件分类"  /> --> | ||||
|           <span @click="show = true" class="right-span" :style="forms.groupName ? '' : 'color:#999;'">{{forms.groupName || '请选择事件分类'}}</span> | ||||
|           <span @click="show = true" class="right-span" :style="forms.groupName ? '' : 'color:#999;'">{{ forms.groupName || '请选择事件分类' }}</span> | ||||
|  | ||||
|           <u-select v-model="show" :list="myList" value-name="id" label-name="groupName" @confirm="selectStatus"></u-select> | ||||
|         </u-form-item> | ||||
|  | ||||
|         <u-form-item :label="status == 3 ? '办结意见' : status == 2 ? '拒绝受理意见' : '办理意见'" prop="content" required :border-bottom="false" label-position="top" class="contents"> | ||||
|           <u-input v-model="forms.content" :placeholder="status == 2 ? '请写下拒绝受理意见…' : '请写下你的办结意见...'" type="textarea" auto-height height="100" maxlength="500" /> | ||||
|         <u-form-item :label="status == 3 ? '办结意见' : status == 2 ? '拒绝受理意见' : '办理意见'" prop="content" required :border-bottom="false" label-position="top" | ||||
|                      class="contents"> | ||||
|           <u-input v-model="forms.content" :placeholder="status == 2 ? '请写下拒绝受理意见…' : '请写下你的办结意见...'" type="textarea" auto-height height="100" maxlength="500"/> | ||||
|         </u-form-item> | ||||
|  | ||||
|         <div class="line"></div> | ||||
| @@ -68,17 +69,16 @@ export default { | ||||
|     this.forms.groupId = option.groupId | ||||
|     this.forms.groupName = option.groupName | ||||
|     this.typeList() | ||||
|     uni.$on('goback', (res) => { | ||||
|     uni.$on('pagePicker:custom', (res) => { | ||||
|       this.selectUser = res | ||||
|       if(res.name) { | ||||
|       if (res.name) { | ||||
|         this.forms.name = res.name | ||||
|       }else{ | ||||
|       } else { | ||||
|         this.forms.name = res.girdName | ||||
|       } | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     console.log(this.titleList[this.status]) | ||||
|     document.title = this.titleList[this.status] | ||||
|   }, | ||||
|   methods: { | ||||
| @@ -98,20 +98,20 @@ export default { | ||||
|     }, | ||||
|  | ||||
|     confirm() { | ||||
|       if(this.status == 1 && !this.forms.name) { | ||||
|       if (this.status == 1 && !this.forms.name) { | ||||
|         return this.$u.toast('请选择转交对象') | ||||
|       } | ||||
|       if(this.status != 1 && !this.forms.groupName) { | ||||
|       if (this.status != 1 && !this.forms.groupName) { | ||||
|         return this.$u.toast('请选择分类') | ||||
|       } | ||||
|       if(this.status != 1 && !this.forms.content) { | ||||
|       if (this.status != 1 && !this.forms.content) { | ||||
|         return this.$u.toast('请输入意见') | ||||
|       } | ||||
|       this.submit() | ||||
|     }, | ||||
|     submit() {  //status 1转交  2拒绝受理  3我已办结 | ||||
|       var url = '', successText= '', params= '' | ||||
|       if(this.status == 1) { | ||||
|       var url = '', successText = '', params = '' | ||||
|       if (this.status == 1) { | ||||
|         url = `/app/appclapeventinfo/transfer` | ||||
|         successText = '转交成功' | ||||
|         params = { | ||||
| @@ -119,18 +119,18 @@ export default { | ||||
|           girdId: this.selectUser.id, | ||||
|           girdName: this.selectUser.girdName, | ||||
|         } | ||||
|         if(this.selectUser.name) { //选择的网格员 | ||||
|         if (this.selectUser.name) { //选择的网格员 | ||||
|           params.girdId = this.selectUser.girdId | ||||
|           params.girdMemberId = this.selectUser.id | ||||
|           params.girdMemberName = this.selectUser.name | ||||
|         } | ||||
|       } | ||||
|       if(this.status == 2) { | ||||
|       if (this.status == 2) { | ||||
|         url = `/app/appclapeventinfo/refuse` | ||||
|         successText = '拒绝成功' | ||||
|         params = {...this.forms} | ||||
|       } | ||||
|       if(this.status == 3) { | ||||
|       if (this.status == 3) { | ||||
|         url = `/app/appclapeventinfo/finishByGirdMember` | ||||
|         successText = '办结成功' | ||||
|         params = {...this.forms} | ||||
| @@ -142,12 +142,12 @@ export default { | ||||
|           uni.$emit('updateDeatil') | ||||
|           uni.$emit('getListInit') | ||||
|           setTimeout(() => { | ||||
|             if(this.status == 1) { | ||||
|             if (this.status == 1) { | ||||
|               uni.navigateBack({delta: 2}) | ||||
|             }else { | ||||
|             } else { | ||||
|               uni.navigateBack() | ||||
|             } | ||||
|           },600) | ||||
|           }, 600) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
| @@ -156,7 +156,7 @@ export default { | ||||
|       this.forms.groupId = e[0].value | ||||
|     }, | ||||
|     toSelectUser() { | ||||
|       uni.navigateTo({ url: './SelectUser' }) | ||||
|       uni.navigateTo({url: '../AppGridManagement/selectGridMember'}) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| @@ -165,14 +165,18 @@ export default { | ||||
| <style scoped lang="scss"> | ||||
| .Transfer { | ||||
|   height: 100%; | ||||
|  | ||||
|   .contents { | ||||
|     padding-bottom: 140px; | ||||
|  | ||||
|     ::v-deep .u-form { | ||||
|       .u-form-item { | ||||
|         padding: 0 45px !important; | ||||
|  | ||||
|         .u-form-item__body { | ||||
|           .u-form-item--right__content__slot { | ||||
|             padding-bottom: 0; | ||||
|  | ||||
|             .u-input { | ||||
|               text-align: right !important; | ||||
|             } | ||||
| @@ -193,6 +197,7 @@ export default { | ||||
|  | ||||
|       .contents { | ||||
|         padding-bottom: 20px !important; | ||||
|  | ||||
|         .u-form-item__body { | ||||
|           .u-form-item--right__content__slot { | ||||
|             .u-input { | ||||
| @@ -204,6 +209,7 @@ export default { | ||||
|  | ||||
|       .avatars { | ||||
|         padding-bottom: 20px !important; | ||||
|  | ||||
|         .u-form-item__body { | ||||
|           .default { | ||||
|             width: 160px; | ||||
| @@ -226,7 +232,8 @@ export default { | ||||
|     font-weight: 500; | ||||
|     color: #ffffff; | ||||
|   } | ||||
|   .right-span{ | ||||
|  | ||||
|   .right-span { | ||||
|     display: inline-block; | ||||
|     width: 100%; | ||||
|     text-align: right; | ||||
|   | ||||
| @@ -1,25 +1,22 @@ | ||||
| <template> | ||||
|   <div class="list"> | ||||
|     <AiTopFixed> | ||||
|       <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#3975C6" inactive-color="#fff" active-color="#fff" @change="change"></u-tabs> | ||||
|       <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#3975C6" inactive-color="#fff" active-color="#fff" | ||||
|               @change="change"></u-tabs> | ||||
|       <div class="select-top"> | ||||
|         <div class="tab-item" @click="show = true"> | ||||
|           <span class="color-666">{{girdNameText}}</span> | ||||
|           <img src="./components/img/down-icon.png" alt="" /> | ||||
|         <div class="tab-item"> | ||||
|           <AiPagePicker type="custom" v-model="searchGrid" @change="confirm" valueObj nodeKey="id" formType="2" | ||||
|                         :ops="{url:'../AppGridManagement/SelectGird',label: 'girdName'}"> | ||||
|             <AiMore v-model="searchGrid.girdName" icon="arrow-down" placeholder="所属网格"/> | ||||
|           </AiPagePicker> | ||||
|         </div> | ||||
|  | ||||
|         <u-select v-model="show" :list="myGirdList" value-name="id" label-name="girdName" @confirm="confirm"></u-select> | ||||
|  | ||||
|         <div class="tab-item" @click="showType = true"> | ||||
|           <span class="color-666">{{eventStatusText}}</span> | ||||
|           <img src="./components/img/down-icon.png" alt="" /> | ||||
|           <AiMore v-model="eventStatusText" icon="arrow-down" placeholder="办件状态"/> | ||||
|         </div> | ||||
|  | ||||
|         <u-select v-model="showType" :list="listType" value-name="dictValue" label-name="dictName" @confirm="confirm"></u-select> | ||||
|       </div> | ||||
|     </AiTopFixed> | ||||
|  | ||||
|     <template > | ||||
|     <template> | ||||
|       <AiCard v-for="(item, i) in datas" :key="i" @click.native="goDetail(item, 1)"> | ||||
|         <template #custom> | ||||
|           <div class="card-top"> | ||||
| @@ -36,7 +33,8 @@ | ||||
|             </div> | ||||
|           </div> | ||||
|  | ||||
|           <div class="status" :class="item.eventStatus == 0 ? 'status0' : item.eventStatus == 1 ? 'status1' : item.eventStatus == 2 ? 'status2' : 'status3'" v-if="item.eventStatus"> | ||||
|           <div class="status" :class="item.eventStatus == 0 ? 'status0' : item.eventStatus == 1 ? 'status1' : item.eventStatus == 2 ? 'status2' : 'status3'" | ||||
|                v-if="item.eventStatus"> | ||||
|             <span class="icon"></span> | ||||
|             <span> | ||||
|               {{ $dict.getLabel('clapEventStatus', item.eventStatus) }} | ||||
| @@ -46,13 +44,12 @@ | ||||
|       </AiCard> | ||||
|       <AiEmpty v-if="!datas.length"></AiEmpty> | ||||
|     </template> | ||||
|  | ||||
|     <div class="pad-b120" v-if="datas.length"></div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { mapState } from 'vuex' | ||||
| import {mapState} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   props: {}, | ||||
| @@ -70,34 +67,24 @@ export default { | ||||
|       currentTabs: 0, | ||||
|       current: 1, | ||||
|       pages: 0, | ||||
|       show: false, | ||||
|       myGirdList: [], | ||||
|       girdId: '', | ||||
|       girdNameText: '所属网格', | ||||
|       searchGrid: {}, | ||||
|       showType: false, | ||||
|       listType: [], | ||||
|       eventStatus: '', | ||||
|       eventStatusText: '办件状态', | ||||
|       listTypeHistory: [], | ||||
|       listTypeAll: [] | ||||
|       eventStatusText: '', | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|  | ||||
|     loadmore() { | ||||
|       return this.pages <= this.current ? 'loading ' : 'nomore' | ||||
|     }, | ||||
|     listType() { | ||||
|       return this.$dict.getDict(this.currentTabs == 0 ? 'clapEventStatusAll' : 'clapEventStatusHistory') | ||||
|     } | ||||
|   }, | ||||
|   mounted() { | ||||
|     this.current = 1 | ||||
|     this.girdList() | ||||
|     this.getList() | ||||
|     uni.$on('nextList', ()=>{ | ||||
|       this.current ++ | ||||
|   onLoad() { | ||||
|     uni.$on('nextList', () => { | ||||
|       this.current++ | ||||
|       this.getList() | ||||
|     }) | ||||
|     uni.$on('getListInit', ()=>{ | ||||
|     uni.$on('getListInit', () => { | ||||
|       this.current = 1 | ||||
|       this.getList() | ||||
|     }) | ||||
| @@ -109,101 +96,64 @@ export default { | ||||
|   created() { | ||||
|     this.$dict.load('clapEventStatus', 'clapEventStatusAll', 'clapEventStatusHistory').then(() => { | ||||
|       this.getList() | ||||
|       this.listTypeAll = this.$dict.getDict('clapEventStatusAll') | ||||
|       this.listTypeHistory = this.$dict.getDict('clapEventStatusHistory') | ||||
|       this.listType = this.listTypeAll | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
|     getList() { | ||||
|       this.$http | ||||
|         .post(`/app/appclapeventinfo/listByGirdMember`, null, { | ||||
|           params: { | ||||
|             size: 10, | ||||
|             current: this.current, | ||||
|             searchType: this.currentTabs == 1 ? '1' : '0', | ||||
|             eventStatus: this.eventStatus, | ||||
|             girdId: this.girdId | ||||
|           }, | ||||
|         }) | ||||
|         .then((res) => { | ||||
|           if (res.code == 0) { | ||||
|             this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records | ||||
|             this.pages = res.data.pages | ||||
|             this.$forceUpdate() | ||||
|           } | ||||
|         }) | ||||
|     }, | ||||
|  | ||||
|     girdList() { | ||||
|       this.$http.post(`/app/appgirdmemberinfo/queryMyGirdListWithOut01`, null, { | ||||
|       let {current, eventStatus, searchGrid: {id: girdId}} = this | ||||
|       this.$http.post(`/app/appclapeventinfo/listByGirdMember`, null, { | ||||
|         params: { | ||||
|           size: 9999, | ||||
|           size: 10, | ||||
|           current, searchType: this.currentTabs == 1 ? '1' : '0', | ||||
|           eventStatus, girdId | ||||
|         }, | ||||
|       }) | ||||
|       .then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.myGirdList = res.data | ||||
|           var all = { | ||||
|             id: '', | ||||
|             girdName: '全部' | ||||
|           } | ||||
|           this.myGirdList.unshift(all) | ||||
|           this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records | ||||
|           this.pages = res.data.pages | ||||
|           this.$forceUpdate() | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     confirm(e) { | ||||
|       if (this.show) { | ||||
|         this.girdNameText = e[0].label | ||||
|         this.girdId = e[0].value | ||||
|       } | ||||
|       if (this.showType) { | ||||
|         this.eventStatus = e[0].value | ||||
|         this.eventStatusText = e[0].label | ||||
|       } | ||||
|  | ||||
|       this.current = 1 | ||||
|       this.getList() | ||||
|     }, | ||||
|  | ||||
|     goDetail(item) { | ||||
|       uni.navigateTo({ url: `./Detail?id=${item.id}` }) | ||||
|       uni.navigateTo({url: `./Detail?id=${item.id}`}) | ||||
|     }, | ||||
|  | ||||
|     change(index) { | ||||
|       this.current = 1 | ||||
|       this.datas = [] | ||||
|       this.eventStatus = '' | ||||
|       this.girdId = '' | ||||
|       this.girdNameText = '所属网格' | ||||
|       this.eventStatusText = '办件状态' | ||||
|       this.currentTabs = index | ||||
|       if(index == 0) { | ||||
|         this.listType = this.listTypeAll | ||||
|       }else { | ||||
|         this.listType = this.listTypeHistory | ||||
|       } | ||||
|       this.getList() | ||||
|     }, | ||||
|  | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({ url }) | ||||
|       uni.navigateTo({url}) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| uni-page-body { | ||||
|   height: 100%; | ||||
| } | ||||
| .list { | ||||
|   height: 100%; | ||||
|  | ||||
|   .select-top { | ||||
|     background: #fff; | ||||
|     display: flex; | ||||
|     padding: 24px 0; | ||||
|  | ||||
|     .tab-item { | ||||
|       flex: 1; | ||||
|       text-align: center; | ||||
| @@ -211,6 +161,7 @@ uni-page-body { | ||||
|       font-size: 26px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #666; | ||||
|  | ||||
|       img { | ||||
|         width: 32px; | ||||
|         height: 32px; | ||||
| @@ -218,21 +169,27 @@ uni-page-body { | ||||
|         vertical-align: middle; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     .tab-item:nth-of-type(1) { | ||||
|       border-right: 1px solid #eee; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   ::v-deep .AiTopFixed .content { | ||||
|     padding: 0; | ||||
|   } | ||||
|  | ||||
|   ::v-deep .AiCard { | ||||
|     background: #f3f6f9; | ||||
|     padding: 24px 40px 0 32px; | ||||
|  | ||||
|     .start { | ||||
|       background: #fff; | ||||
|       border-radius: 16px; | ||||
|  | ||||
|       .card-top { | ||||
|         padding: 32px; | ||||
|  | ||||
|         .titles { | ||||
|           margin-bottom: 34px; | ||||
|           font-size: 32px; | ||||
| @@ -246,10 +203,12 @@ uni-page-body { | ||||
|           -webkit-line-clamp: 2; | ||||
|           -webkit-box-orient: vertical; | ||||
|         } | ||||
|  | ||||
|         .types, | ||||
|         .gards { | ||||
|           margin-top: 8px; | ||||
|           font-size: 26px; | ||||
|  | ||||
|           .types-right, | ||||
|           .gards-right { | ||||
|             margin-left: 32px; | ||||
| @@ -261,6 +220,7 @@ uni-page-body { | ||||
|       .status { | ||||
|         padding: 32px; | ||||
|         border-top: 1px solid #dddddd; | ||||
|  | ||||
|         .icon { | ||||
|           display: inline-block; | ||||
|           width: 8px; | ||||
| @@ -272,6 +232,7 @@ uni-page-body { | ||||
|  | ||||
|       .status0 { | ||||
|         color: #ff883c; | ||||
|  | ||||
|         .icon { | ||||
|           background: #ff883c; | ||||
|         } | ||||
| @@ -279,6 +240,7 @@ uni-page-body { | ||||
|  | ||||
|       .status1 { | ||||
|         color: #1aaaff; | ||||
|  | ||||
|         .icon { | ||||
|           background: #1aaaff; | ||||
|         } | ||||
| @@ -286,6 +248,7 @@ uni-page-body { | ||||
|  | ||||
|       .status2 { | ||||
|         color: #42d784; | ||||
|  | ||||
|         .icon { | ||||
|           background: #42d784; | ||||
|         } | ||||
| @@ -293,12 +256,14 @@ uni-page-body { | ||||
|  | ||||
|       .status3 { | ||||
|         color: #ff4466; | ||||
|  | ||||
|         .icon { | ||||
|           background: #ff4466; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   // ::v-deep .AiCard:last-child { | ||||
|   //   padding-bottom: 24px; | ||||
|   // } | ||||
|   | ||||
| @@ -62,7 +62,7 @@ export default { | ||||
|     } | ||||
|   }, | ||||
|   onLoad() { | ||||
|      | ||||
|  | ||||
|   }, | ||||
|   onShow() {}, | ||||
|   methods: { | ||||
|   | ||||
| @@ -1,11 +1,5 @@ | ||||
| <template> | ||||
|   <div class="statistics" v-if="pageShow"> | ||||
|     <!-- <div class="gird-select"> | ||||
|       <img src="./components/img/gird-icon.png" alt=""> | ||||
|       <span>{{girdName}}</span> | ||||
|       <img src="./components/img/down-icon.png" alt=""> | ||||
|     </div> | ||||
|     <u-select v-model="showSelect" :list="myGirdList" value-name="id" label-name="girdName" @confirm="confirm"></u-select> --> | ||||
|     <div class="info-content"> | ||||
|       <div class="title">今日概况</div> | ||||
|       <div class="el-row"> | ||||
| @@ -80,7 +74,6 @@ export default { | ||||
|       todayList: [], | ||||
|       info: {}, | ||||
|       pageShow: false, | ||||
|       myGirdList: [], | ||||
|       showSelect: false, | ||||
|       myGirdList: [], | ||||
|       girdName: '全部网格' | ||||
| @@ -101,7 +94,7 @@ export default { | ||||
|             res.data.businessCountMap['办结率'] = Number(res.data.businessCountMap['办结率'] * 100).toFixed(1) | ||||
|           } | ||||
|           this.info = res.data | ||||
|            | ||||
|  | ||||
|           Object.keys(res.data.todayCountMap).forEach((key) => { | ||||
|             var info = { | ||||
|               label: key, | ||||
|   | ||||
| @@ -15,11 +15,11 @@ export default { | ||||
|   name: 'UserList', | ||||
|   data() { | ||||
|     return { | ||||
|        | ||||
|  | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|      | ||||
|  | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|   | ||||
| @@ -85,7 +85,7 @@ | ||||
|             </div> | ||||
|             <div class="right"> | ||||
|               <input placeholder="请输入" type="idcard" v-model="form.idNumber" :maxlength="20" | ||||
|                      placeholder-style="color: #999; font-size: 30rpx;" @input="changeIdNumber" :disabled="isEdit"/> | ||||
|                      placeholder-style="color: #999; font-size: 30rpx;" @input="changeIdNumber" disabled/> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
| @@ -100,18 +100,6 @@ | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|         <div class="form-item"> | ||||
|           <div class="form-item__wrapper"> | ||||
|             <div class="left"> | ||||
|               <i>*</i> | ||||
|               <span>共同生活家庭人口数</span> | ||||
|             </div> | ||||
|             <div class="right"> | ||||
|               <input placeholder="请输入" type="idcard" v-model="form.familyCount" :maxlength="20" | ||||
|                      placeholder-style="color: #999; font-size: 30rpx;" :disabled="isEdit"/> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|       <div class="form-group"> | ||||
|         <div class="form-item"> | ||||
| @@ -495,7 +483,6 @@ export default { | ||||
|         foreignWorkers: '', | ||||
|         foreignWorkersAddress: '', | ||||
|         houseIdNumber: '', | ||||
|         familyCount: '', | ||||
|       }, | ||||
|       $areaId: '', | ||||
|       girdInfo: {}, | ||||
| @@ -620,9 +607,6 @@ export default { | ||||
|       if (!this.form.idNumber) { | ||||
|         return this.$u.toast('请输入身份证号') | ||||
|       } | ||||
|       if (!this.form.familyCount) { | ||||
|         return this.$u.toast('请输入家庭人口数') | ||||
|       } | ||||
|       if (!this.form.phone) { | ||||
|         return this.$u.toast('请输入联系方式') | ||||
|       } | ||||
| @@ -739,14 +723,14 @@ export default { | ||||
|               this.guaranteeCheckList[index].checked = true | ||||
|             }) | ||||
|           } | ||||
|            | ||||
|  | ||||
|           if(res.data.healthyStatusList) { | ||||
|             res.data.healthyStatusList = res.data.healthyStatus.split(',') | ||||
|             this.helthList.map(items => { | ||||
|               items.checked = res.data.healthyStatusList.includes(items.dictValue) | ||||
|             }) | ||||
|           } | ||||
|            | ||||
|  | ||||
|           this.form = { ...this.form, ...res.data } | ||||
|  | ||||
|           if (this.form.photo) { | ||||
|   | ||||
| @@ -162,7 +162,7 @@ | ||||
|       <div class="addBtn iconfont iconfont-iconfangda" @tap="toAddLog()"></div> | ||||
|     </AiFixedBtn> | ||||
|      <!-- 0:待纳入、1:监测中、2:待解除、3:已解除、4:已驳回 --> | ||||
|     <div v-if="checkType == 1 && currIndex != 1">  | ||||
|     <div v-if="checkType == 1 && currIndex != 1"> | ||||
|       <div class="footer-btn" v-if="info.status == 1"> | ||||
|         <div class="confirm-btn" @click="toAddView('您确认要申请解除此监测对象的风险吗?', '')">申请解除风险</div> | ||||
|       </div> | ||||
| @@ -189,9 +189,9 @@ | ||||
|       <div class="footer-btn" v-if="(info.status == 4 || info.status == 3) && userInfo != ''"> | ||||
|         <div @click="del" v-if="$permissions('app_apppreventionreturntopoverty_del')">删除人员</div> | ||||
|         <div class="confirm-btn" @click="toAddView('您确认要将此居民纳入监测对象吗?', 1)">纳入监测</div> | ||||
|       </div>  | ||||
|       </div> | ||||
|     </div> | ||||
|      | ||||
|  | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| @@ -252,8 +252,8 @@ export default { | ||||
|         return false | ||||
|       } | ||||
|       return (this.info.income1 || this.info.income2 || this.info.income3 || this.info.income4 | ||||
|        || this.info.income5|| this.info.income6|| this.info.income7|| this.info.income8 || this.info.income9 ||  | ||||
|        this.info.income10 || this.info.income11 || this.info.income12 ||  | ||||
|        || this.info.income5|| this.info.income6|| this.info.income7|| this.info.income8 || this.info.income9 || | ||||
|        this.info.income10 || this.info.income11 || this.info.income12 || | ||||
|        this.info.income13 || this.info.income14 || this.info.income15) | ||||
|     }, | ||||
|  | ||||
| @@ -276,7 +276,7 @@ export default { | ||||
|       this.isGirdUser() | ||||
|       this.getInfo() | ||||
|     }) | ||||
|      | ||||
|  | ||||
|     this.id = query.id | ||||
|     this.getUserPopup() | ||||
|   }, | ||||
| @@ -374,7 +374,7 @@ export default { | ||||
|       this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${this.id}`).then(res => { | ||||
|         if (res.code === 0) { | ||||
|           this.info = res.data | ||||
|            | ||||
|  | ||||
|           let ylbxCount = 0 | ||||
|           let ylCount = 0 | ||||
|           if(res.data.family && res.data.family.length) { | ||||
| @@ -386,14 +386,14 @@ export default { | ||||
|                 ylCount = ylCount + 1 | ||||
|               } | ||||
|             }) | ||||
|             this.endNum = res.data.family.filter(item  =>  | ||||
|             this.endNum = res.data.family.filter(item  => | ||||
|               (item.jcbxCxyiliao == '02' || '') && (item.jcbxCzyiliao == '02' || '') | ||||
|             ) | ||||
|             this.endNum = res.data.family.filter(v=>  | ||||
|             this.endNum = res.data.family.filter(v=> | ||||
|               (v.jcbxCxyanglao == '02' || '') && (v.jcbxCzyanglao == '02' || '') | ||||
|             ) | ||||
|           } | ||||
|            | ||||
|  | ||||
|           this.info.ylbxCount = ylbxCount | ||||
|           this.info.ylCount = ylCount | ||||
|           this.pageShow = true | ||||
| @@ -411,7 +411,7 @@ export default { | ||||
|         uni.navigateTo({url: `./MonitorAddView?pass=${pass}&id=${this.info.id}&status=${this.info.status}`}) | ||||
|       }) | ||||
|     }, | ||||
|      | ||||
|  | ||||
|     del() { | ||||
|       this.$confirm('', '您确认要要删除此监测对象的信息吗?').then(() => { | ||||
|         this.$http.post(`/app/apppreventionreturntopoverty/delete?ids=${this.id}`).then(res => { | ||||
|   | ||||
| @@ -54,7 +54,7 @@ export default { | ||||
|     }else { | ||||
|       document.title = this.id ? '编辑走访日志' : '添加走访日志' | ||||
|     } | ||||
|      | ||||
|  | ||||
|   }, | ||||
|   methods: { | ||||
|     getInfo() { | ||||
| @@ -80,7 +80,7 @@ export default { | ||||
|           return this.$u.toast('请输入走访内容') | ||||
|         } | ||||
|       } | ||||
|        | ||||
|  | ||||
|       this.flag = true | ||||
|       this.$http.post('/app/apppreventionreturntopovertylog/addOrUpdate', { | ||||
|         detail: this.detail, | ||||
| @@ -98,7 +98,7 @@ export default { | ||||
|               delta: 1 | ||||
|             }) | ||||
|           }, 300) | ||||
|            | ||||
|  | ||||
|         } | ||||
|       }) | ||||
|     } | ||||
| @@ -109,7 +109,7 @@ export default { | ||||
| <style lang="scss"> | ||||
| .form { | ||||
|   padding-bottom: 120px; | ||||
|    | ||||
|  | ||||
|   .help { | ||||
|     padding: 32px; | ||||
|     box-sizing: border-box; | ||||
|   | ||||
| @@ -69,10 +69,10 @@ export default { | ||||
|           } | ||||
|         if(this.status == 1) { | ||||
|           url = '/app/apppreventionreturntopoverty/relieve' // 解除 | ||||
|         } else if (this.status == 4 || this.status == 3) {  | ||||
|         } else if (this.status == 4 || this.status == 3) { | ||||
|           if(!this.riskType) { | ||||
|             return this.$u.toast('请选择风险因素') | ||||
|           }  | ||||
|           } | ||||
|           url = `/app/apppreventionreturntopoverty/examine` //  纳入监测 | ||||
|         } | ||||
|       } else {   // 网格员 | ||||
| @@ -94,7 +94,7 @@ export default { | ||||
|           this.filesList = files.join(',') | ||||
|         } | ||||
|  | ||||
|         if(this.status == 0 || this.status == 3 || this.status == 4) {  | ||||
|         if(this.status == 0 || this.status == 3 || this.status == 4) { | ||||
|           url = `/app/apppreventionreturntopoverty/examine` // 纳入监测申请 | ||||
|         } else { | ||||
|           url =  `/app/apppreventionreturntopoverty/relieve`  // 消除申请 | ||||
| @@ -161,4 +161,4 @@ export default { | ||||
|     left: 0; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| </style> | ||||
|   | ||||
| @@ -319,8 +319,8 @@ export default { | ||||
|     this.id = query.id | ||||
|     this.girdId = query.girdId | ||||
|     this.girdName = query.girdName | ||||
|      | ||||
|      | ||||
|  | ||||
|  | ||||
|   }, | ||||
|  | ||||
|   onShow() { | ||||
|   | ||||
| @@ -214,7 +214,7 @@ export default { | ||||
|  | ||||
|   methods: { | ||||
|     getInfo(id) { | ||||
|        | ||||
|  | ||||
|       this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${id}`).then(res => { | ||||
|         // var arr = ['income1','income2','income3','income4','income5','income6','income8','income9','income10','income11','income12','income13','income14','income15'] | ||||
|         // var newArr = {} | ||||
|   | ||||
| @@ -259,4 +259,4 @@ export default { | ||||
|     left: 0; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| </style> | ||||
|   | ||||
| @@ -272,7 +272,7 @@ export default { | ||||
|         } | ||||
|       } | ||||
|  | ||||
|        | ||||
|  | ||||
|       .form-item__wrappers { | ||||
|         font-size: 32px; | ||||
|         .top { | ||||
| @@ -344,4 +344,4 @@ export default { | ||||
|     background: #3192F4; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| </style> | ||||
|   | ||||
| @@ -23,19 +23,19 @@ | ||||
|       <div class="more-info"> | ||||
|         <div class="item-info"> | ||||
|           <label>身份证号</label> | ||||
|           <span>{{ info.idNumber }}</span>  | ||||
|           <span>{{ info.idNumber }}</span> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>性别</label> | ||||
|           <span>{{ $dict.getLabel('sex', info.sex) }}</span>  | ||||
|           <span>{{ $dict.getLabel('sex', info.sex) }}</span> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>出生日期</label> | ||||
|           <span>{{ info.birthDate }}</span>  | ||||
|           <span>{{ info.birthDate }}</span> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>民族</label> | ||||
|           <span>{{ $dict.getLabel('fpNation', info.nation) }}</span>  | ||||
|           <span>{{ $dict.getLabel('fpNation', info.nation) }}</span> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>政治面貌</label> | ||||
| @@ -54,20 +54,16 @@ | ||||
|           <span> | ||||
|              <span v-for="(item, index) in healthyStatusList" :key="index"><span v-if="index > 0">,</span>{{$dict.getLabel("fpHealth", item)}}</span> | ||||
|           </span> | ||||
|            | ||||
|  | ||||
|           <!-- <span v-for="(item,index) in">{{ $dict.getLabel('fpHealth', info.healthyStatus) }}</span>  --> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>残疾类别</label> | ||||
|           <span>{{ $dict.getLabel('fpDisabilityType', info.disabilityType) }}</span>  | ||||
|           <span>{{ $dict.getLabel('fpDisabilityType', info.disabilityType) }}</span> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>残疾证办证年度</label> | ||||
|           <span>{{ $dict.getLabel('fpYear', info.disabilityCertificateYear) }}</span>  | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>家庭人口数</label> | ||||
|           <span>{{ info.familyCount }}</span>  | ||||
|           <span>{{ $dict.getLabel('fpYear', info.disabilityCertificateYear) }}</span> | ||||
|         </div> | ||||
|         <!-- 基础保障 --> | ||||
|         <h4 style="fon-size: 17px;font-weight: 600;margin-top: 8px;">基础保障</h4> | ||||
| @@ -123,19 +119,19 @@ | ||||
|         <h4 style="fon-size: 17px;font-weight: 600;margin-top: 8px;">务工就业</h4> | ||||
|         <div class="item-info"> | ||||
|           <label>劳动技能</label> | ||||
|           <span>{{ $dict.getLabel('fpLaborSkills', info.labourStatus) }}</span>   | ||||
|           <span>{{ $dict.getLabel('fpLaborSkills', info.labourStatus) }}</span> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>是否会讲普通话</label> | ||||
|           <span>{{ $dict.getLabel('fpYesOrNo', info.mandarin) }}</span>   | ||||
|           <span>{{ $dict.getLabel('fpYesOrNo', info.mandarin) }}</span> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>就业渠道</label> | ||||
|           <span>{{ $dict.getLabel('fpEmploymentChannels', info.employmentChannels) }}</span>   | ||||
|           <span>{{ $dict.getLabel('fpEmploymentChannels', info.employmentChannels) }}</span> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>务工企业名称</label> | ||||
|           <span>{{ info.migrantEnterprises }}</span>   | ||||
|           <span>{{ info.migrantEnterprises }}</span> | ||||
|         </div> | ||||
|         <div class="item-info"> | ||||
|           <label>务工时间/月</label> | ||||
| @@ -188,7 +184,7 @@ export default { | ||||
|         if (res.code === 0) { | ||||
|           this.info = res.data | ||||
|           this.healthyStatusList = res.data.healthyStatus.split(',') | ||||
|            | ||||
|  | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
| @@ -283,4 +279,4 @@ export default { | ||||
|     color: #FFFFFF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| </style> | ||||
|   | ||||
| @@ -8,15 +8,9 @@ | ||||
|       <div class="area-select"> | ||||
|         <div class="select-content"> | ||||
|           <div class="area-content fill"> | ||||
|             <AiPagePicker type="gird" isMyGird @select="handleGridSelect"> | ||||
|             <AiPagePicker type="custom" @select="handleGridSelect" :ops="{url:'../AppGridManagement/SelectGird',label: 'girdName'}"> | ||||
|               <AiMore v-model="gridName" placeholder="选择网格"/> | ||||
|             </AiPagePicker> | ||||
|             <!--          <AiAreaPicker :areaId="user.areaId" v-model="areaId" @select="areaSelect" :name.sync="areaName">--> | ||||
|             <!--            <img src="./img/local-icon.png" alt=""/>--> | ||||
|             <!--            <span class="label" v-if="areaName">{{ areaName }}</span>--> | ||||
|             <!--            <span v-else>请选择</span>--> | ||||
|             <!--            <u-icon name="arrow-down" color="#666" size="24"/>--> | ||||
|             <!--          </AiAreaPicker>--> | ||||
|           </div> | ||||
|           <div class="search-input" v-if="tabIndex"> | ||||
|             <img src="./img/search-icon.png" alt=""/> | ||||
| @@ -132,8 +126,8 @@ export default { | ||||
|       this.$forceUpdate() | ||||
|     }, | ||||
|     handleGridSelect(e) { | ||||
|       this.gridName = e?.[0]?.girdName | ||||
|       this.search.girdId = e?.[0]?.id | ||||
|       this.gridName = e?.girdName | ||||
|       this.search.girdId = e?.id | ||||
|       this.getDatas() | ||||
|     }, | ||||
|     areaSelect(e) { | ||||
| @@ -149,13 +143,7 @@ export default { | ||||
|         params: {...this.search, type: 0, range: 0} | ||||
|       }).then((res) => { | ||||
|         if (res?.data) { | ||||
|           for (let i in res.data) { | ||||
|             let obj = { | ||||
|               label: i, | ||||
|               value: res.data[i], | ||||
|             } | ||||
|             this.statisticsList.push(obj) | ||||
|           } | ||||
|           this.statisticsList = Object.keys(res.data).map((label, i, arr) => ({label, value: res.data[label]})) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
| @@ -165,13 +153,7 @@ export default { | ||||
|         params: {...this.search, type: 0, range: 1} | ||||
|       }).then((res) => { | ||||
|         if (res?.data) { | ||||
|           for (let i in res.data) { | ||||
|             let obj = { | ||||
|               label: i, | ||||
|               value: res.data[i], | ||||
|             } | ||||
|             this.statisticsListMon.push(obj) | ||||
|           } | ||||
|           this.statisticsListMon = Object.keys(res.data).map((label, i, arr) => ({label, value: res.data[label]})) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|   | ||||
| @@ -151,7 +151,7 @@ | ||||
|           <div class="item" v-else-if="item.type == 'gird'"> | ||||
|             <span class="label"><span class="tips">{{ item.mustFill == 1 ? '*' : '' }}</span>{{ item.fieldName }}</span> | ||||
|             <div class="value" flex> | ||||
|               <AiPagePicker type="gird" @select="v=>handleSelectGird(v,item)" isMyGird> | ||||
|               <AiPagePicker type="custom" @select="v=>handleSelectGird(v,item)" :ops="{url:'../AppGridManagement/SelectGird',label: 'girdName'}"> | ||||
|                 <AiMore v-model="formData[item.fieldDbName + '_name']" :placeholder="item.fieldTips"/> | ||||
|               </AiPagePicker> | ||||
|             </div> | ||||
| @@ -411,7 +411,7 @@ export default { | ||||
|           } | ||||
|           if (items.type == 'upload') { //附件 只传id | ||||
|             let files = []; | ||||
|             [form[items.fieldDbName]]?.flat()?.map(item => item?.url&&files.push(item.url)) | ||||
|             [form[items.fieldDbName]]?.flat()?.map(item => item?.url && files.push(item.url)) | ||||
|             form[items.fieldDbName] = files?.toString() | ||||
|           } | ||||
|           // if (items.type == 'onOff') { //开关 | ||||
| @@ -441,11 +441,11 @@ export default { | ||||
|       }).then(res => { | ||||
|         if (res?.code == 0) { | ||||
|           this.$u.toast('提交成功') | ||||
|           uni.navigateBack({ | ||||
|           setTimeout(() => uni.navigateBack({ | ||||
|             success: () => { | ||||
|               uni.$emit("selectType") | ||||
|             } | ||||
|           }) | ||||
|           }), 1500) | ||||
|         } else this.$u.toast(res?.msg || "提交失败,请联系管理员") | ||||
|       }).catch(err => { | ||||
|         this.$u.toast(err || "提交失败,请联系管理员") | ||||
| @@ -462,7 +462,7 @@ export default { | ||||
|       return obj?.toString() || "-" | ||||
|     }, | ||||
|     handleSelectGird(gird, item) { | ||||
|       let info = gird?.[0] || {} | ||||
|       let info = gird || {} | ||||
|       this.formData[item.fieldDbName] = [info.id, info.girdName].join("_") | ||||
|       this.formData[item.fieldDbName + "_name"] = info.girdName | ||||
|       this.$forceUpdate() | ||||
|   | ||||
| @@ -10,7 +10,7 @@ | ||||
|     </u-radio-group> | ||||
|     <input class="codeText" v-model="search" placeholder="搜索要查找的应用"/> | ||||
|     <div flex class="appsPane wrap"> | ||||
|       <b v-for="app in appsList" :key="app.id" @tap="handleGotoApp(app)">{{ app.label }}({{ app.name }})</b> | ||||
|       <b v-for="app in appsList" :key="app.id" @tap="handleGotoApp(app)" :class="{beta:app.isBeta}">{{ app.label }}({{ app.name }})</b> | ||||
|     </div> | ||||
|   </section> | ||||
| </template> | ||||
| @@ -29,6 +29,9 @@ export default { | ||||
|     appsList() { | ||||
|       let {search, currentLib} = this | ||||
|       return this.apps.filter(e => { | ||||
|         if (/beta/.test(e.libPath)) { | ||||
|           e.isBeta = true | ||||
|         } | ||||
|         return (currentLib == "apps" && e.libPath.indexOf("project") > -1) || e.libPath.indexOf(currentLib) > -1 | ||||
|       }).filter(e => !!search ? e.label?.indexOf(search) > -1 : true) || [] | ||||
|     }, | ||||
| @@ -115,9 +118,25 @@ export default { | ||||
|       background: $uni-color-primary; | ||||
|       color: #fff; | ||||
|       padding: 8px; | ||||
|       margin: 4px; | ||||
|       margin: 8px; | ||||
|       border-radius: 8px; | ||||
|       font-weight: normal; | ||||
|  | ||||
|       &.beta { | ||||
|         background: $uni-color-warning; | ||||
|         position: relative; | ||||
|  | ||||
|         &:before { | ||||
|           position: absolute; | ||||
|           top: 0; | ||||
|           right: 0; | ||||
|           content: "beta"; | ||||
|           transform: translate(-8px, -50%); | ||||
|           color: $uni-color-error; | ||||
|           z-index: 20220613952; | ||||
|           font-weight: bold; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
|   | ||||
| @@ -1,238 +0,0 @@ | ||||
| <template> | ||||
|   <div class="AddFamily"> | ||||
|     <div class="search"> | ||||
|       <div class="left"> | ||||
|         <AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="areaSelect" :name.sync="areaName" style="color: #666"> | ||||
|           <u-icon name="map-fill" color="#3192F4" size="20px" style="vertical-align: text-bottom"></u-icon> | ||||
|           <span style="margin-left: 4px" v-if="areaName">{{ areaName }}</span> | ||||
|           <span v-else>请选择</span> | ||||
|           <u-icon name="arrow-down" color="#666" size="28" style="margin-left: 4px" /> | ||||
|         </AiAreaPicker> | ||||
|       </div> | ||||
|       <u-search v-model="value" placeholder:clearabled="true" placeholder="请输入姓名/身份证/手机号" :show-action="false" bg-color="#F5F5F5" search-icon-color="#999" color="#999" height="58" @search="getListInit" @clear="value='',getListInit"></u-search> | ||||
|     </div> | ||||
|     <div class="userList" v-if="list.length"> | ||||
|       <ul v-for="(item,index) in list" :key="index"> | ||||
|         <li class="main"> | ||||
|           <div class="user"> | ||||
|             <div> | ||||
|               <img src="./components/img/xz.png" alt="" class="checkbox" v-if="!item.checked" @click="userClick(index)"> | ||||
|               <img src="./components/img/xzh.png" alt="" class="checkbox" v-else @click="userClick(index)"> | ||||
|             </div> | ||||
|             <div class="userInfo"> | ||||
|               <div> | ||||
|                <img :src="item.photo" alt="" class="userImg"  v-if="item.photo"> | ||||
|                <img src="./components/img/user-img.png" alt="" class="userImg" v-else> | ||||
|               </div> | ||||
|               <div class="info"> | ||||
|                  <div class="name"> | ||||
|                   <span class="user-name">{{item.name}}</span> | ||||
|                   <span class="user-tel">{{item.phone}}</span> | ||||
|                  </div> | ||||
|                 <div class="idCard">{{item.idNumber && item.idNumber.replace(/^(\d{6})\d{8}(.{4}$)/g, `$1${Array(9).join('*')}$2`)}}</div> | ||||
|                 <div class="address">{{item.currentAreaName || '' }}{{ item.currentAddress || '' }}</div> | ||||
|               </div> | ||||
|             </div> | ||||
|           </div> | ||||
|         </li> | ||||
|       </ul> | ||||
|     </div> | ||||
|     <AiEmpty description="暂无数据" class="emptyWrap" v-if="!list.length"></AiEmpty> | ||||
|     <div style="height:70px;"></div> | ||||
|     <div class="btn"> | ||||
|       <div class="handleCheck" @click="confirm">确定选择</div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { mapState } from 'vuex' | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
|       list: [], | ||||
|       current: 1, | ||||
|       value: '', | ||||
|       checked: true, | ||||
|       userList: {}, | ||||
|       userId: '', | ||||
|       areaId: '', | ||||
|       areaName:'', | ||||
|       girdId: '' | ||||
|     } | ||||
|   }, | ||||
|   computed: { ...mapState(['user']) }, | ||||
|   methods: { | ||||
|     getList(){ | ||||
|       this.$http.post(`/app/appresident/list?areaId=${this.areaId}&householdName=1¤t=${this.current}&con=${this.value}`).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           res.data.records.map((item) => { | ||||
|             item.checked = false | ||||
|             item.girdMemberId = this.userId | ||||
|             item.residentId = item.id | ||||
|           }) | ||||
|           this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     getListInit(){ | ||||
|       this.list = [] | ||||
|       this.current = 1 | ||||
|       this.getList() | ||||
|     }, | ||||
|     userClick(index) { | ||||
|       this.list[index].checked = !this.list[index].checked | ||||
|     }, | ||||
|     confirm() { | ||||
|       var checkUserList = [] | ||||
|       this.list.map((item) => { | ||||
|         if(item.checked) { | ||||
|           var info = { | ||||
|             girdMemberId: this.userId, | ||||
|             residentId: item.id, | ||||
|             name: item.name, | ||||
|             girdId: this.girdId | ||||
|           } | ||||
|           checkUserList.push(info) | ||||
|         } | ||||
|       }) | ||||
|       if(!checkUserList.length) { | ||||
|         return this.$u.toast('请选择户主') | ||||
|       } | ||||
|       this.$http.post(`/app/appgirdmemberresident/add`, {residentList:checkUserList}).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.$u.toast('提交成功') | ||||
|           uni.$emit('updateList') | ||||
|           setTimeout(() => { | ||||
|             uni.navigateBack() | ||||
|           }, 600) | ||||
|         } | ||||
|       }).catch((err) => { | ||||
|          this.$u.toast(err) | ||||
|       }) | ||||
|     }, | ||||
|     areaSelect(e) { | ||||
|       this.areaId =e | ||||
|       this.getListInit() | ||||
|     }, | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.userId = option.id | ||||
|     this.areaId = this.user.areaId | ||||
|     this.areaName = this.user.areaName | ||||
|     this.girdId = option.girdId | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '新增责任家庭' | ||||
|     this.getList() | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     this.current = this.current + 1 | ||||
|     this.getList() | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .AddFamily { | ||||
|     .search{ | ||||
|     width: 100%; | ||||
|     height: 112px; | ||||
|     padding: 32px; | ||||
|     box-sizing: border-box; | ||||
|     background: #FFF; | ||||
|     display: flex; | ||||
|     margin-bottom: 8px; | ||||
|     .left{ | ||||
|       width: calc(100% - 450px); | ||||
|     } | ||||
|   } | ||||
|   .userList { | ||||
|     width: 100%; | ||||
|     background-color: #FFFFFF ; | ||||
|      ul { | ||||
|        padding-left: 0px; | ||||
|       li { | ||||
|         list-style-type: none; | ||||
|       .user { | ||||
|         display: flex; | ||||
|         justify-content: flex-start; | ||||
|         padding-top: 24px; | ||||
|         padding-left: 32px; | ||||
|         height: 100%; | ||||
|         .checkbox{ | ||||
|           margin-top: 20px; | ||||
|           margin-right: 32px; | ||||
|           width: 48px; | ||||
|           height: 48px; | ||||
|         } | ||||
|         .userInfo { | ||||
|           display: flex; | ||||
|           justify-content: flex-start; | ||||
|           border-bottom: 1px solid #E4E5E6; | ||||
|           padding-right: 48px; | ||||
|           width: calc(100% - 100px); | ||||
|           .userImg { | ||||
|           margin-right: 32px; | ||||
|           width: 80px; | ||||
|           height: 80px; | ||||
|           border-radius: 50%; | ||||
|           } | ||||
|           .info { | ||||
|           width: calc(100% - 120px); | ||||
|           padding-bottom: 32px; | ||||
|           .name { | ||||
|             display: flex; | ||||
|             justify-content: space-between; | ||||
|             font-size: 32px; | ||||
|             margin-bottom: 8px; | ||||
|             .user-name { | ||||
|               font-weight: 800; | ||||
|             } | ||||
|             .user-tel { | ||||
|               font-size: 26px; | ||||
|               color: #999999 ; | ||||
|             } | ||||
|          } | ||||
|          .idCard { | ||||
|            margin-bottom: 16px; | ||||
|            font-size: 26px; | ||||
|            color: #999999; | ||||
|          } | ||||
|          .address { | ||||
|            max-width: 100%; | ||||
|            word-break:break-all; | ||||
|            font-size: 26px; | ||||
|            color: #999999; | ||||
|          } | ||||
|         } | ||||
|         } | ||||
|       } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .btn { | ||||
|     position: fixed; | ||||
|     bottom: 0px; | ||||
|     right: 0px; | ||||
|     width: 100%; | ||||
|     height: 120px; | ||||
|     background-color: #F3F6F9; | ||||
|     .handleCheck { | ||||
|       position: fixed; | ||||
|       bottom: 18px; | ||||
|       right: 34px; | ||||
|       width: 192px; | ||||
|       height: 80px; | ||||
|       line-height: 80px; | ||||
|       text-align: center; | ||||
|       background-color: #1365DD; | ||||
|       color: #FFFFFF; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
|  | ||||
|  | ||||
|  | ||||
|  | ||||
| @@ -1,165 +0,0 @@ | ||||
| <template> | ||||
|   <div class="AddGird"> | ||||
|     <AiGroup> | ||||
|       <AiItem label="网格名称" required> | ||||
|         <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="form.girdName" | ||||
|                  maxlength="50"/> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <AiGroup> | ||||
|       <AiItem label="网格长" topLabel> | ||||
|         <AiPagePicker type="sysUser" :selected.sync="form.girdMemberManageList" action="/app/wxcp/wxuser/list?status=1" nodeKey="id"> | ||||
|           <AiMore :value="getArrayLabel(form.girdMemberManageList)"/> | ||||
|         </AiPagePicker> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <AiGroup> | ||||
|       <AiItem label="网格员" topLabel> | ||||
|         <AiPagePicker type="sysUser" :selected.sync="form.girdMemberList" action="/app/wxcp/wxuser/list?status=1" nodeKey="id"> | ||||
|           <AiMore :value="getArrayLabel(form.girdMemberList)"/> | ||||
|         </AiPagePicker> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <div class="footer" @click="$u.debounce(confirm)">{{ fromType == 'add' ? '确认添加' : '确认修改' }}</div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|  | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
|       id: '', | ||||
|       form: { | ||||
|         girdMemberManageList: [], | ||||
|         girdMemberList: [] | ||||
|       }, | ||||
|       fromType: 'add', //add新增 edit编辑, | ||||
|     } | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.id = option.id | ||||
|     this.fromType = option.fromType | ||||
|     this.getDetail() | ||||
|   }, | ||||
|   onShow() { | ||||
|     if (this.fromType == 'add') { | ||||
|       document.title = '添加网格' | ||||
|     } else { | ||||
|       document.title = '编辑网格' | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     getDetail() { | ||||
|       this.$http.post(`/app/appgirdinfo/queryDetailById?id=${this.id}`).then((res) => { | ||||
|         if (res?.data) { | ||||
|           if (this.fromType == 'edit') { | ||||
|             this.form = res.data | ||||
|             this.form.girdMemberList?.map(e => e.id = e.wxUserId) | ||||
|             this.form.girdMemberManageList?.map(e => e.id = e.wxUserId) | ||||
|           } | ||||
|           if (this.fromType == 'add') { | ||||
|             this.form.parentGirdId = res.data.id | ||||
|             this.form.parentGirdName = res.data.girdName | ||||
|             this.$forceUpdate() | ||||
|           } | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     confirm() { | ||||
|       if (!this.form.girdName) { | ||||
|         return this.$u.toast('请输入网格名称') | ||||
|       } | ||||
|       let girdMemberManageList = this.form.girdMemberManageList?.map((item) => { | ||||
|         return { | ||||
|           wxUserId: item.id, | ||||
|           phone: item.mobile, | ||||
|           photo: item.avatar, | ||||
|           name: item.name | ||||
|         } | ||||
|       }) | ||||
|       let girdMemberList = this.form.girdMemberList?.map((item) => { | ||||
|         return { | ||||
|           wxUserId: item.id, | ||||
|           phone: item.mobile, | ||||
|           photo: item.avatar, | ||||
|           name: item.name | ||||
|         } | ||||
|       }) | ||||
|       this.$http.post(`/app/appgirdinfo/addOrUpdateByEw`, {...this.form, girdMemberManageList, girdMemberList}).then((res) => { | ||||
|         if (res?.code == 0) { | ||||
|           this.$u.toast('提交成功') | ||||
|           uni.$emit('update') | ||||
|           setTimeout(() => { | ||||
|             uni.navigateBack({}) | ||||
|           }, 600) | ||||
|         } | ||||
|       }).catch((err) => { | ||||
|         this.$u.toast(err) | ||||
|       }) | ||||
|     }, | ||||
|     getArrayLabel(arr, key = 'name', separation = ',') { | ||||
|       return arr?.map(e => e[key])?.join(separation) | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .AddGird { | ||||
|   .item-flex { | ||||
|     display: flex; | ||||
|     padding: 34px 32px; | ||||
|     background-color: #fff; | ||||
|     font-size: 32px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     margin-bottom: 16px; | ||||
|  | ||||
|     .label { | ||||
|       font-weight: 400; | ||||
|       color: #333333; | ||||
|       line-height: 22px; | ||||
|       width: 150px; | ||||
|  | ||||
|       .tips { | ||||
|         display: inline-block; | ||||
|         width: 16px; | ||||
|         color: #F46; | ||||
|         line-height: 44px; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     .value { | ||||
|       width: calc(100% - 150px); | ||||
|       line-height: 44px; | ||||
|       text-align: right; | ||||
|       color: #666; | ||||
|  | ||||
|       img { | ||||
|         width: 44px; | ||||
|         height: 44px; | ||||
|         vertical-align: middle; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     .color-999 { | ||||
|       color: #999; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .footer { | ||||
|     width: 100%; | ||||
|     height: 112px; | ||||
|     line-height: 112px; | ||||
|     background: #1365DD; | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     left: 0; | ||||
|     text-align: center; | ||||
|     font-size: 36px; | ||||
|     font-family: PingFangSC-Medium, PingFang SC; | ||||
|     font-weight: 500; | ||||
|     color: #FFF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,138 +0,0 @@ | ||||
| <template> | ||||
|   <section class="AddGird"> | ||||
|     <div class="item-flex"> | ||||
|       <div class="label"> | ||||
|         <span class="tips">*</span>姓名 | ||||
|       </div> | ||||
|       <div class="value"> | ||||
|         <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="name" maxlength="50"/> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="item-flex"> | ||||
|       <div class="label"> | ||||
|         <span class="tips">*</span>手机号 | ||||
|       </div> | ||||
|       <div class="value"> | ||||
|         <u-input type="text" placeholder="请输入" input-align="right" placeholder-style="color:#999;font-size:16px;" height="48" v-model="phone" maxlength="50"/> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="item-flex"> | ||||
|       <div class="label"> | ||||
|         <span class="tips">*</span>所属网格 | ||||
|       </div> | ||||
|       <div class="value"> | ||||
|         <AiPagePicker type="custom" v-model="selectGird" valueObj nodeKey="id" :ops="{url:'./SelectGird',label: 'girdName'}" formType="2"> | ||||
|           <AiMore v-model="selectGird.girdName"/> | ||||
|         </AiPagePicker> | ||||
|       </div> | ||||
|       <div class="footer" @click="confirm">确认添加</div> | ||||
|     </div> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
|       name: '', | ||||
|       phone: '', | ||||
|       selectGird: {} | ||||
|     } | ||||
|   }, | ||||
|   computed: {...mapState(['user'])}, | ||||
|   onLoad() { | ||||
|     this.name = this.user.name || '' | ||||
|     this.phone = this.user.phone || '' | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '网格员信息申报' | ||||
|   }, | ||||
|   methods: { | ||||
|     confirm() { | ||||
|       if (!this.name) { | ||||
|         return this.$u.toast('请输入姓名') | ||||
|       } | ||||
|       if (!this.phone) { | ||||
|         return this.$u.toast('请输入手机号') | ||||
|       } | ||||
|       if (!this.selectGird.girdName) { | ||||
|         return this.$u.toast('请选择所属网格') | ||||
|       } | ||||
|       this.$http.post(`/app/appgirdmemberapply/girdMemberCheck?name=${this.name}&phone=${this.phone}&girdName=${this.selectGird.girdName}`).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           uni.$emit('updateGird') | ||||
|           this.linkTo('./AddUserSuccess?status=1') | ||||
|         } | ||||
|       }).catch((err) => { | ||||
|         this.linkTo('./AddUserSuccess?status=0') | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({url}) | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .AddGird { | ||||
|   .item-flex { | ||||
|     display: flex; | ||||
|     padding: 34px 32px; | ||||
|     background-color: #fff; | ||||
|     font-size: 32px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     margin-bottom: 16px; | ||||
|  | ||||
|     .label { | ||||
|       font-weight: 400; | ||||
|       color: #333333; | ||||
|       line-height: 22px; | ||||
|       width: 150px; | ||||
|  | ||||
|       .tips { | ||||
|         display: inline-block; | ||||
|         width: 16px; | ||||
|         color: #F46; | ||||
|         line-height: 44px; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     .value { | ||||
|       width: calc(100% - 150px); | ||||
|       line-height: 44px; | ||||
|       text-align: right; | ||||
|       color: #666; | ||||
|  | ||||
|       img { | ||||
|         width: 32px; | ||||
|         height: 32px; | ||||
|         vertical-align: middle; | ||||
|         margin-left: 8px; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     .color-999 { | ||||
|       color: #999; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .footer { | ||||
|     width: 100%; | ||||
|     height: 112px; | ||||
|     line-height: 112px; | ||||
|     background: #1365DD; | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     left: 0; | ||||
|     text-align: center; | ||||
|     font-size: 36px; | ||||
|     font-family: PingFangSC-Medium, PingFang SC; | ||||
|     font-weight: 500; | ||||
|     color: #FFF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,85 +0,0 @@ | ||||
| <template> | ||||
|   <div class="success"> | ||||
|     <img src="./components/img/success.png" alt="" v-if="status"> | ||||
|     <img src="./components/img/fail.png" alt="" v-else> | ||||
|     <p>{{ status == 1 ? '信息申报成功!' : '信息申报失败!' }}</p> | ||||
|     <p class="text">{{ status == 1 ? '重新进入即可开始正常使用' : '系统无法匹配该申报信息,请联系管理人员进行处理' }}</p> | ||||
|     <div class="footer" @click="back">{{ status == 1 ? '确定' : '我知道了' }}</div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapActions} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   name: "AddUserSuccess", | ||||
|   data() { | ||||
|     return { | ||||
|       status: 1 | ||||
|     } | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '网格员信息申报' | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.status = option.status | ||||
|   }, | ||||
|   methods: { | ||||
|     ...mapActions(['getAccount']), | ||||
|     back() { | ||||
|       this.getAccount().then(() => { | ||||
|         uni.reLaunch({url: './AppGridManagement'}) | ||||
|       }) | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| uni-page-body { | ||||
|   height: 100%; | ||||
|   background-color: #fff; | ||||
| } | ||||
|  | ||||
| .success { | ||||
|   text-align: center; | ||||
|  | ||||
|   img { | ||||
|     width: 192px; | ||||
|     height: 192px; | ||||
|     margin: 96px 0 16px 0; | ||||
|   } | ||||
|  | ||||
|   p { | ||||
|     line-height: 50px; | ||||
|     color: #333; | ||||
|     font-size: 36px; | ||||
|     font-weight: 500; | ||||
|     text-align: center; | ||||
|     margin-bottom: 16px; | ||||
|   } | ||||
|  | ||||
|   .footer { | ||||
|     width: calc(100% - 96px); | ||||
|     height: 88px; | ||||
|     line-height: 88px; | ||||
|     background: #1365DD; | ||||
|     box-shadow: inset 0px 1px 0px 0px #EEEEEE; | ||||
|     font-size: 32px; | ||||
|     font-family: PingFangSC-Medium, PingFang SC; | ||||
|     font-weight: 500; | ||||
|     color: #FFF; | ||||
|     text-align: center; | ||||
|     border-radius: 8px; | ||||
|     margin-left: 48px; | ||||
|   } | ||||
|  | ||||
|   .text { | ||||
|     line-height: 44px; | ||||
|     font-size: 28px; | ||||
|     width: 500px; | ||||
|     margin: 0 auto 72px; | ||||
|     word-break: break-all; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,228 +0,0 @@ | ||||
| <template> | ||||
|   <div class="AppGridManagement"> | ||||
|     <template v-if="isGridMember"> | ||||
|       <div class="pad-t32" v-if="component != 'Map'"/> | ||||
|       <div class="select-gird" v-if="component != 'Map'" flex> | ||||
|         <AiPagePicker type="custom" class="fill" @select="handleSelectGird" | ||||
|                       :ops="{url:'./SelectGird',label: 'girdName'}"> | ||||
|           <div flex> | ||||
|             <img src="./components/img/gird-icon.png" alt="" class="gird-icon"> | ||||
|             <AiMore v-model="params.girdName" icon="arrow-down"/> | ||||
|           </div> | ||||
|         </AiPagePicker> | ||||
|         <span @click="linkTo('./SetGird?id='+params.id)" v-if="isGridAdmin&&!!params.id">网格配置</span> | ||||
|       </div> | ||||
|       <component v-if="refresh" :is="component" @change="onChange" :params="params"/> | ||||
|       <div class="tabs" v-if="isTab"> | ||||
|         <div class="item" @click="tabClick(index, item.component)" v-for="(item, index) in tabs" :key="index"> | ||||
|           <img :src="tabIndex == index ? item.activeImg : item.img" alt=""/> | ||||
|           <p :class="{'color-3267F0':tabIndex == index}" v-text="item.text"/> | ||||
|         </div> | ||||
|       </div> | ||||
|     </template> | ||||
|     <div v-if="!isGridMember" class="empty"> | ||||
|       <img src="./components/img/no-admin.png" alt=""> | ||||
|       <p>没有网格员权限<br/>无法查看网格信息哦~</p> | ||||
|       <div class="add-btn" @click="linkTo('./AddUser')">网格员信息申报</div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import Statistics from './Statistics.vue' | ||||
| import Organization from './Organization.vue' | ||||
| import Map from './Map.vue' | ||||
| import {mapState} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   name: 'AppGridManagement', | ||||
|   appName: '网格管理(新)', | ||||
|   data() { | ||||
|     return { | ||||
|       component: 'Statistics', | ||||
|       params: {}, | ||||
|       refresh: true, | ||||
|       tabIndex: 0, | ||||
|       tabs: [ | ||||
|         { | ||||
|           img: require('./components/img/statistics-icon.png'), | ||||
|           activeImg: require('./components/img/statistics-icon-active.png'), | ||||
|           text: '统计', | ||||
|           component: 'Statistics', | ||||
|         }, | ||||
|         { | ||||
|           img: require('./components/img/org-icon.png'), | ||||
|           activeImg: require('./components/img/org-icon-active.png'), | ||||
|           text: '组织', | ||||
|           component: 'Organization', | ||||
|         }, | ||||
|         { | ||||
|           img: require('./components/img/map-icon.png'), | ||||
|           activeImg: require('./components/img/map-icon-active.png'), | ||||
|           text: '地图', | ||||
|           component: 'Map' | ||||
|         } | ||||
|       ], | ||||
|       isTab: true, | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     isGridMember() { | ||||
|       return this.user.girdCheckType > 0 | ||||
|     }, | ||||
|     isGridAdmin() { | ||||
|       return this.user.girdCheckType == 2 | ||||
|     } | ||||
|   }, | ||||
|   components: { | ||||
|     Organization, | ||||
|     Statistics, | ||||
|     Map, | ||||
|   }, | ||||
|   methods: { | ||||
|     onChange(e) { | ||||
|       this.params = e.params | ||||
|       this.component = e.type | ||||
|     }, | ||||
|     refreshHome() { | ||||
|       this.refresh = false | ||||
|       this.$nextTick(() => { | ||||
|         this.refresh = true | ||||
|       }) | ||||
|     }, | ||||
|     tabClick(index, component) { | ||||
|       this.tabIndex = index | ||||
|       this.component = component | ||||
|       this.refreshHome(); | ||||
|     }, | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({url}) | ||||
|     }, | ||||
|     handleSelectGird(v) { | ||||
|       this.params = v || {} | ||||
|       this.refreshHome() | ||||
|     } | ||||
|   }, | ||||
|   onLoad() { | ||||
|     this.handleSelectGird(this.user.gridInfo) | ||||
|     uni.$on('hideTab', () => { | ||||
|       this.isTab = false | ||||
|     }) | ||||
|     uni.$on('showTab', () => { | ||||
|       this.isTab = true | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '网格管理' | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     if (!this.tabIndex) { | ||||
|       uni.$emit('nextList') | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .AppGridManagement { | ||||
|   height: 100vh; | ||||
| } | ||||
|  | ||||
| .pad-t32 { | ||||
|   padding-top: 32px; | ||||
| } | ||||
|  | ||||
| .gird-icon { | ||||
|   margin-right: 8px; | ||||
| } | ||||
|  | ||||
| .select-gird { | ||||
|   width: calc(100% - 60px); | ||||
|   padding: 24px 32px; | ||||
|   background: #FFFFFF; | ||||
|   border-radius: 16px; | ||||
|   margin: 0 30px 32px; | ||||
|   box-sizing: border-box; | ||||
|  | ||||
|   img { | ||||
|     width: 32px; | ||||
|     height: 32px; | ||||
|     vertical-align: middle; | ||||
|   } | ||||
|  | ||||
|   span { | ||||
|     display: inline-block; | ||||
|     width: 112px; | ||||
|     height: 48px; | ||||
|     font-size: 28px; | ||||
|     font-family: PingFangSC-Medium, PingFang SC; | ||||
|     font-weight: 500; | ||||
|     color: #3F8DF5; | ||||
|     line-height: 48px; | ||||
|   } | ||||
| } | ||||
|  | ||||
| .tabs { | ||||
|   width: 100%; | ||||
|   height: 98px; | ||||
|   background: #fff; | ||||
|   border-top: 1px solid #ddd; | ||||
|   position: fixed; | ||||
|   bottom: 0; | ||||
|   left: 0; | ||||
|   display: flex; | ||||
|  | ||||
|   .item { | ||||
|     flex: 1; | ||||
|     text-align: center; | ||||
|  | ||||
|     img { | ||||
|       width: 56px; | ||||
|       height: 56px; | ||||
|       margin-top: 8px; | ||||
|     } | ||||
|  | ||||
|     p { | ||||
|       font-size: 22px; | ||||
|       font-family: PingFangSC-Medium, PingFang SC; | ||||
|       font-weight: 500; | ||||
|       color: #c4cad4; | ||||
|       line-height: 8px; | ||||
|     } | ||||
|  | ||||
|     .color-3267F0 { | ||||
|       color: #3267f0; | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| .empty { | ||||
|   text-align: center; | ||||
|  | ||||
|   img { | ||||
|     width: 282px; | ||||
|     height: 306px; | ||||
|     margin: 136px auto 0; | ||||
|   } | ||||
|  | ||||
|   p { | ||||
|     font-size: 28px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     color: #999; | ||||
|     line-height: 40px; | ||||
|   } | ||||
|  | ||||
|   .add-btn { | ||||
|     width: 400px; | ||||
|     height: 88px; | ||||
|     line-height: 88px; | ||||
|     text-align: center; | ||||
|     border-radius: 8px; | ||||
|     background-color: #3267f0; | ||||
|     color: #fff; | ||||
|     font-size: 30px; | ||||
|     margin: 200px auto 0; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,221 +0,0 @@ | ||||
| <template> | ||||
|   <div class="FamilyList"> | ||||
|     <div class="title"> | ||||
|       <div>户主列表({{ total }})</div> | ||||
|       <div v-if="list.length"> | ||||
|         <span style="font-size: 14px; color: #2979ff;" @click="changeType" v-if="edit">修改</span> | ||||
|         <span style="font-size: 14px; color: #2979ff;" @click="edit = true" v-else>取消</span> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="main" v-if="list.length"> | ||||
|       <ul v-for="(item,index) in list" :key="index"> | ||||
|         <li> | ||||
|           <div class="user"> | ||||
|             <div v-if="!edit"> | ||||
|               <img src="./components/img/xz.png" alt="" class="checkbox" v-if="!item.checked" @click="userClick(index)"> | ||||
|               <img src="./components/img/xzh.png" alt="" class="checkbox" v-else @click="userClick(index)"> | ||||
|             </div> | ||||
|             <div class="info"> | ||||
|               <div> | ||||
|                 <img :src="item.photo" class="userImg" v-if="item.photo"> | ||||
|                 <img src="./components/img/user-img.png" alt="" class="userImg" v-else> | ||||
|               </div> | ||||
|               <div class="userInfo"> | ||||
|                 <div class="name"> | ||||
|                   <span class="user-name">{{ item.name }}</span> | ||||
|                   <span class="user-tel">{{ item.phone }}</span> | ||||
|                 </div> | ||||
|                 <div class="idCard">{{ item.idNumber && item.idNumber.replace(/(.{6}).*(.{4})/, "$1********$2") }}</div> | ||||
|                 <div class="address">{{ item.currentAreaName || '' }}{{ item.currentAddress || '' }}</div> | ||||
|               </div> | ||||
|             </div> | ||||
|           </div> | ||||
|         </li> | ||||
|       </ul> | ||||
|     </div> | ||||
|     <AiEmpty description="暂无数据" class="emptyWrap" v-if="!list.length"></AiEmpty> | ||||
|     <div style="height:70px;"></div> | ||||
|     <div class="footer" @click="toAddFamily()" v-if="edit">新增责任家庭</div> | ||||
|     <div class="footer" @click="delFamily()" v-else>删除</div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
|       list: [], | ||||
|       total: 0, | ||||
|       current: 1, | ||||
|       userId: '', | ||||
|       edit: true, | ||||
|       checked: true, | ||||
|       girdId: '' | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     getList() { | ||||
|       this.$http.post(`/app/appgirdmemberresident/listByGirdMember?current=${this.current}&girdMemberId=${this.userId}&girdId=${this.girdId}`).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records | ||||
|           this.total = res.data.total | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     toAddFamily() { | ||||
|       uni.navigateTo({url: `./AddFamily?id=${this.userId}&girdId=${this.girdId}`}) | ||||
|     }, | ||||
|     userClick(index) { | ||||
|       this.list[index].checked = !this.list[index].checked | ||||
|       this.$forceUpdate() | ||||
|     }, | ||||
|     // 点击删除 | ||||
|     delFamily() { | ||||
|       var ids = [] | ||||
|       this.list.map((item) => { | ||||
|         if (item.checked) { | ||||
|           ids.push(item.gmrId) | ||||
|         } | ||||
|       }) | ||||
|       if (!ids.length) { | ||||
|         return this.$u.toast('请选中需要删除的家庭户主') | ||||
|       } | ||||
|       this.$confirm(`是否删除这些关联家庭信息?`).then(() => { | ||||
|         this.$http.post(`/app/appgirdmemberresident/delete?ids=${ids.join(',')}`).then((res) => { | ||||
|           if (res.code == 0) { | ||||
|             this.$u.toast('删除成功') | ||||
|             uni.$emit('updateList') | ||||
|             this.$forceUpdate() | ||||
|             this.edit = true | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     }, | ||||
|     changeType() { | ||||
|       this.edit = false | ||||
|       this.list.map((item) => { | ||||
|         item.checked = false | ||||
|       }) | ||||
|     } | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.userId = option.id | ||||
|     this.girdId = option.girdId | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '责任家庭' | ||||
|     this.getList() | ||||
|     uni.$on('updateList', () => { | ||||
|       this.current = 1 | ||||
|       this.getList() | ||||
|     }) | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     this.current = this.current + 1 | ||||
|     this.getList() | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .FamilyList { | ||||
|   min-height: 100vh; | ||||
|   .title { | ||||
|     display: flex; | ||||
|     justify-content: space-between; | ||||
|     padding: 24px 32px; | ||||
|     background-color: #fff; | ||||
|     font-size: 34px; | ||||
|     font-weight: 800; | ||||
|   } | ||||
|  | ||||
|   .main { | ||||
|     padding-bottom: 112px; | ||||
|  | ||||
|     ul { | ||||
|       padding-left: 32px; | ||||
|       background-color: #fff; | ||||
|  | ||||
|       li { | ||||
|         list-style-type: none; | ||||
|  | ||||
|         .user { | ||||
|           display: flex; | ||||
|           justify-content: flex-start; | ||||
|           padding-top: 24px; | ||||
|  | ||||
|           .checkbox { | ||||
|             margin-top: 20px; | ||||
|             margin-right: 32px; | ||||
|             width: 48px; | ||||
|             height: 48px; | ||||
|           } | ||||
|  | ||||
|           .info { | ||||
|             display: flex; | ||||
|             justify-content: flex-start; | ||||
|             width: 100%; | ||||
|  | ||||
|             .userImg { | ||||
|               margin-right: 32px; | ||||
|               width: 80px; | ||||
|               height: 80px; | ||||
|               border-radius: 50%; | ||||
|             } | ||||
|  | ||||
|             .userInfo { | ||||
|               width: 100%; | ||||
|               padding-right: 32px; | ||||
|               border-bottom: 1px solid #E4E5E6; | ||||
|  | ||||
|               .name { | ||||
|                 display: flex; | ||||
|                 justify-content: space-between; | ||||
|                 font-size: 32px; | ||||
|                 margin-bottom: 8px; | ||||
|  | ||||
|                 .user-name { | ||||
|                   font-weight: 800; | ||||
|                 } | ||||
|  | ||||
|                 .user-tel { | ||||
|                   font-size: 26px; | ||||
|                   color: #999999; | ||||
|                 } | ||||
|               } | ||||
|  | ||||
|               .idCard { | ||||
|                 margin-bottom: 16px; | ||||
|                 font-size: 26px; | ||||
|                 color: #999999; | ||||
|               } | ||||
|  | ||||
|               .address { | ||||
|                 max-width: 100%; | ||||
|                 word-break: break-all; | ||||
|                 margin-bottom: 18px; | ||||
|                 font-size: 26px; | ||||
|                 color: #999999; | ||||
|               } | ||||
|             } | ||||
|  | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .footer { | ||||
|     position: fixed; | ||||
|     left: 0px; | ||||
|     bottom: 0px; | ||||
|     width: 100%; | ||||
|     height: 112px; | ||||
|     background-color: #1365DD; | ||||
|     line-height: 112px; | ||||
|     text-align: center; | ||||
|     font-size: 36px; | ||||
|     color: #FFFFFF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,318 +0,0 @@ | ||||
| <template> | ||||
|   <div class="detail"> | ||||
|     <div class="grid-select"> | ||||
|       <AiPagePicker type="custom" class="fill" @select="handleSelectGird" | ||||
|                     :ops="{url:'./SelectGird',label: 'girdName'}"> | ||||
|         <div class="gird-content"> | ||||
|           <div class="label">网格选择</div> | ||||
|           <div class="grid-select__right"> | ||||
|             <span>{{ form.girdName || '请选择' }}</span> | ||||
|             <u-icon name="arrow-right" color="#cccccc" size="26" style="margin-left:4px;"></u-icon> | ||||
|           </div> | ||||
|         </div> | ||||
|       </AiPagePicker> | ||||
|     </div> | ||||
|     <div class="map-content"> | ||||
|       <AiTMap ref="AiTMap" :map.sync="map" :lib.sync="lib" :libraries="['geometry','service', 'tools']"/> | ||||
|     </div> | ||||
|     <u-popup v-model="show" mode="bottom" border-radius="14"> | ||||
|       <div class="popup"> | ||||
|         <div class="bg"></div> | ||||
|         <div class="title">{{ form.girdName }}</div> | ||||
|         <scroll-view scroll-y="true" class="grid-info"> | ||||
|           <div class="info-flex" v-for="(item) in  form.girdMemberManageList" :key="item.id" flex> | ||||
|             <div class="label">网格长</div> | ||||
|             <div class="value fill" v-text='[item.name, item.phone].join("  ")'/> | ||||
|             <AiPhone :phone="item.phone"/> | ||||
|           </div> | ||||
|           <div class="info-flex" v-for="(item) in  form.girdMemberList" :key="item.id" flex> | ||||
|             <div class="label">网格员</div> | ||||
|             <div class="value fill" v-text='[item.name, item.phone].join("  ")'/> | ||||
|             <AiPhone :phone="item.phone"/> | ||||
|           </div> | ||||
|         </scroll-view> | ||||
|       </div> | ||||
|     </u-popup> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|  | ||||
|   data() { | ||||
|     return { | ||||
|       areaId: '', | ||||
|       lib: null, | ||||
|       map: null, | ||||
|       show: false, | ||||
|       form: {girdName: '', id: ''}, | ||||
|       treeList: [], | ||||
|       showSelect: false, | ||||
|       editor: null, | ||||
|       polygons: [], | ||||
|       labels: [] | ||||
|     } | ||||
|   }, | ||||
|   computed: {...mapState(['user', 'config'])}, | ||||
|   created() { | ||||
|     this.$dict.load('girdType') | ||||
|     this.areaId = this.user.areaId | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = "网格管理" | ||||
|   }, | ||||
|   methods: { | ||||
|     getGridList(id) { | ||||
|       this.$loading() | ||||
|       this.$http.post(`/app/appgirdinfo/queryChildGirdInfoByGirdId?girdId=${id}`).then((res) => { | ||||
|         if (res?.data) { | ||||
|           const arr = res.data.map(v => { | ||||
|             return { | ||||
|               id: v.id, | ||||
|               girdName: v.girdName, | ||||
|               points: v.points ? v.points.map(p => [p.lng, p.lat]) : [] | ||||
|             } | ||||
|           }) | ||||
|           this.renderGridMap(arr) | ||||
|         } | ||||
|       }).finally(() => { | ||||
|         this.$hideLoading() | ||||
|       }) | ||||
|     }, | ||||
|     getGridInfo(id, flag) { | ||||
|       this.$loading() | ||||
|       this.$http.post(`/app/appgirdinfo/queryDetailById?id=${id}`).then((res) => { | ||||
|         this.$hideLoading() | ||||
|         if (res?.data) { | ||||
|           this.form = res.data | ||||
|  | ||||
|           if (res.data.points && flag) { | ||||
|             const arr = [{ | ||||
|               id: res.data.id, | ||||
|               girdName: res.data.girdName, | ||||
|               points: res.data.points.map(p => [p.lng, p.lat]) | ||||
|             }] | ||||
|  | ||||
|             this.renderGridMap(arr) | ||||
|           } | ||||
|  | ||||
|           this.$nextTick(() => { | ||||
|             !flag && (this.show = true) | ||||
|           }) | ||||
|         } | ||||
|       }).catch(() => { | ||||
|         this.$hideLoading() | ||||
|       }) | ||||
|     }, | ||||
|     renderGridMap(paths, count = 0) { | ||||
|       let {map, lib: TMap, $refs: {AiTMap: {fitBounds}}} = this | ||||
|       if (TMap) { | ||||
|         const colors = ["#A194F4", "#7CBDF3", "#F3A57D", "#62D063", "#58DBDA", "#F7D151"] | ||||
|         if (this.polygons.length > 0) { | ||||
|           this.polygons.forEach(e => e.destroy()) | ||||
|           this.labels.forEach(e => { | ||||
|             e.destroy(e.id) | ||||
|           }) | ||||
|           this.polygons = [] | ||||
|           this.labels = [] | ||||
|         } | ||||
|         if (paths?.length > 0) { | ||||
|           let bounds = [] | ||||
|           paths.forEach((path, i) => { | ||||
|             if (path.points?.length > 0) { | ||||
|               let polygon = new TMap.MultiPolygon({ | ||||
|                 map, styles: { | ||||
|                   default: new TMap.PolygonStyle({ | ||||
|                     showBorder: true, | ||||
|                     borderColor: '#5088FF', | ||||
|                     borderWidth: 2, | ||||
|                     color: this.$colorUtils.Hex2RGBA('#5088FF', 0.1) | ||||
|                   }) | ||||
|                 }, | ||||
|                 id: path.id, | ||||
|                 geometries: [{paths: path.points.map(e => new TMap.LatLng(e[1], e[0]))}] | ||||
|               }) | ||||
|               this.polygons.push(polygon) | ||||
|               bounds.push(fitBounds(path.points.map(e => new TMap.LatLng(e[1], e[0])))) | ||||
|               polygon.on('click', e => { | ||||
|                 const id = e.target.id | ||||
|                 this.getGridInfo(id) | ||||
|               }) | ||||
|               const points = path.points.map(e => new TMap.LatLng(e[1], e[0])) | ||||
|               const position = TMap.geometry.computeCentroid(points) | ||||
|               let label = new TMap.MultiLabel({ | ||||
|                 id: `label~${path.id}`, | ||||
|                 data: path.id, | ||||
|                 map: map, | ||||
|                 styles: { | ||||
|                   building: new TMap.LabelStyle({ | ||||
|                     color: '#3777FF', | ||||
|                     size: 20, | ||||
|                     alignment: 'center', | ||||
|                     verticalAlignment: 'middle' | ||||
|                   }) | ||||
|                 }, | ||||
|                 geometries: [ | ||||
|                   { | ||||
|                     id: `label-class-${i}`, | ||||
|                     styleId: 'building', | ||||
|                     position, | ||||
|                     content: path.girdName, | ||||
|                   } | ||||
|                 ] | ||||
|               }) | ||||
|               this.labels.push(label) | ||||
|               label.on('click', e => { | ||||
|                 this.getGridInfo(e.target.id.split('~')[1]) | ||||
|               }); | ||||
|             } | ||||
|           }) | ||||
|           bounds = bounds.reduce((a, b) => { | ||||
|             return fitBounds([ | ||||
|               a.getNorthEast(), | ||||
|               a.getSouthWest(), | ||||
|               b.getNorthEast(), | ||||
|               b.getSouthWest(), | ||||
|             ]); | ||||
|           }); | ||||
|           map.fitBounds(bounds, {padding: 100}) | ||||
|         } else { | ||||
|           map.setCenter(this.config.latlng) | ||||
|         } | ||||
|  | ||||
|       } else { | ||||
|         if (count < 5) { | ||||
|           setTimeout(() => { | ||||
|             this.renderGridMap(paths, ++count) | ||||
|           }, 1000) | ||||
|         } | ||||
|       } | ||||
|     }, | ||||
|     callPhone(phone) { | ||||
|       uni.makePhoneCall({phoneNumber: phone}) | ||||
|     }, | ||||
|     handleSelectGird(v) { | ||||
|       this.form = v || {} | ||||
|       this.getGridList(v?.id, true) | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .detail { | ||||
|   height: 100%; | ||||
|  | ||||
|   .grid-select { | ||||
|     width: 100%; | ||||
|     padding: 34px 32px; | ||||
|     box-sizing: border-box; | ||||
|     background: #FFF; | ||||
|     display: flex; | ||||
|     justify-content: space-between; | ||||
|     line-height: 44px; | ||||
|     color: #333; | ||||
|  | ||||
|     .grid-select__right { | ||||
|       width: calc(100% - 140px); | ||||
|       text-align: right; | ||||
|     } | ||||
|  | ||||
|     .gird-content { | ||||
|       display: flex; | ||||
|       justify-content: space-between; | ||||
|     } | ||||
|  | ||||
|     .label { | ||||
|       flex-shrink: 0; | ||||
|       width: 140px; | ||||
|       font-size: 32px; | ||||
|     } | ||||
|  | ||||
|     .value { | ||||
|       font-size: 28px; | ||||
|  | ||||
|       .u-icon { | ||||
|         margin-left: 8px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .map-content { | ||||
|     width: 100%; | ||||
|     height: calc(100% - 210px); | ||||
|   } | ||||
|  | ||||
|   .popup { | ||||
|     padding: 0 32px 16px; | ||||
|  | ||||
|     .bg { | ||||
|       width: 64px; | ||||
|       height: 10px; | ||||
|       background: #CCC; | ||||
|       border-radius: 6px; | ||||
|       margin: 32px auto 32px auto; | ||||
|     } | ||||
|  | ||||
|     .grid-info { | ||||
|       height: 800px; | ||||
|     } | ||||
|  | ||||
|     .title { | ||||
|       font-size: 36px; | ||||
|       font-family: PingFang-SC-Heavy, PingFang-SC; | ||||
|       font-weight: 800; | ||||
|       color: #333; | ||||
|       line-height: 50px; | ||||
|       margin-bottom: 24px; | ||||
|     } | ||||
|  | ||||
|     .info-flex { | ||||
|       padding: 26px 0 30px 0; | ||||
|       width: 100%; | ||||
|       border-bottom: 1px solid #D8DDE6; | ||||
|       line-height: 40px; | ||||
|       font-size: 28px; | ||||
|  | ||||
|       &:last-of-type { | ||||
|         border-bottom: none; | ||||
|       } | ||||
|  | ||||
|       .label { | ||||
|         display: inline-block; | ||||
|         width: 160px; | ||||
|         font-weight: 800; | ||||
|         color: #333; | ||||
|       } | ||||
|  | ||||
|       .value { | ||||
|         color: #666; | ||||
|         font-size: 26px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| .footer { | ||||
|   width: 100%; | ||||
|   position: fixed; | ||||
|   bottom: 0; | ||||
|   left: 0; | ||||
|   z-index: 99999; | ||||
|   display: flex; | ||||
|   font-size: 32px; | ||||
|   font-family: PingFangSC-Medium, PingFang SC; | ||||
|   font-weight: 500; | ||||
|   height: 112px; | ||||
|   line-height: 112px; | ||||
|   text-align: center; | ||||
|  | ||||
|   .btn { | ||||
|     flex: 2; | ||||
|     background: #1365DD; | ||||
|     color: #FFF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,181 +0,0 @@ | ||||
| <template> | ||||
|   <div class="Organization"> | ||||
|     <div class="title">网格人员</div> | ||||
|     <div class="user-content" v-for="(item, index) in dataInfo.parentGirdMembers" :key="item.id"> | ||||
|       <div> | ||||
|         <!-- <image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" /> --> | ||||
|         <img :src="item.photo" alt="" v-if="item.photo"> | ||||
|         <img src="./components/img/big-user.png" alt="" v-else> | ||||
|       </div> | ||||
|       <div class="right"> | ||||
|         <div class="name">{{ item.name }}</div> | ||||
|         <div class="gird">{{ item.checkType == 2 ? '网格长' : '网格员' }}</div> | ||||
|         <p>{{ item.girdName }}</p> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="user-content user-item" v-for="(item, index) in dataInfo.girdMembers" :key="item.id" @click="viewUser(item.wxUserId)"> | ||||
|       <div> | ||||
|         <!-- <image :src="item.photo" alt="" mode="aspectFill" v-if="item.photo" /> --> | ||||
|         <img :src="item.photo" alt="" v-if="item.photo"> | ||||
|         <img src="./components/img/big-user.png" alt="" v-else> | ||||
|       </div> | ||||
|       <div class="right"> | ||||
|         <div class="name">{{ item.name }} | ||||
|           <span class="gird">{{ item.checkType == 2 ? '网格长' : '网格员' }}</span> | ||||
|           <span class="family-btn" @click.stop="linkTo(`./FamilyList?id=${item.id}&girdId=${userGird.id}`)" v-if="item.checkType == 1">责任家庭 ></span> | ||||
|         </div> | ||||
|         <p>{{ item.girdName }} </p> | ||||
|       </div> | ||||
|     </div> | ||||
|     <AiEmpty description="暂无数据" class="emptyWrap" | ||||
|              v-if="dataInfo.parentGirdMembers && !dataInfo.parentGirdMembers.length && !dataInfo.girdMembers.length"></AiEmpty> | ||||
|     <AiGap h="112"/> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   data() { | ||||
|     return { | ||||
|       userGird: {}, | ||||
|       dataInfo: {}, | ||||
|     } | ||||
|   }, | ||||
|   props: ['params'], | ||||
|   onShow() { | ||||
|     document.title = '网格管理' | ||||
|  | ||||
|   }, | ||||
|   mounted() { | ||||
|     this.userGird = this.params | ||||
|     this.getGirdUserList() | ||||
|     uni.$on('goback', (res) => { | ||||
|       this.userGird = res | ||||
|       this.getGirdUserList() | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
|     getGirdUserList() { | ||||
|       this.$http.post(`/app/appgirdmemberinfo/listGirdMemberByGirdId?girdId=${this.userGird.id}`).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.dataInfo = res.data | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({url}) | ||||
|     }, | ||||
|     viewUser(userid) { | ||||
|       userid && this.injectJWeixin('openUserProfile').then(() => { | ||||
|         this.wxInvoke(['openUserProfile', {type: 1, userid}, () => 0]) | ||||
|       }) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .Organization { | ||||
|   background-color: #f5f5f5; | ||||
|  | ||||
|   .title { | ||||
|     font-size: 38px; | ||||
|     font-family: PingFangSC-Semibold, PingFang SC; | ||||
|     font-weight: 600; | ||||
|     color: #333; | ||||
|     line-height: 52px; | ||||
|     padding-left: 32px; | ||||
|     margin-bottom: 32px; | ||||
|   } | ||||
|  | ||||
|   .user-content { | ||||
|     width: calc(100% - 64px); | ||||
|     margin: 0 0 32px 32px; | ||||
|     background-color: #fff; | ||||
|     padding: 32px; | ||||
|     box-sizing: border-box; | ||||
|     display: flex; | ||||
|  | ||||
|     img { | ||||
|       display: inline-block; | ||||
|       width: 200px; | ||||
|       height: 200px; | ||||
|       margin-right: 32px; | ||||
|     } | ||||
|  | ||||
|     image { | ||||
|       width: 200px; | ||||
|       height: 200px; | ||||
|       margin-right: 32px; | ||||
|     } | ||||
|  | ||||
|     .right { | ||||
|       width: 100%; | ||||
|  | ||||
|       .name { | ||||
|         font-size: 32px; | ||||
|         font-family: PingFangSC-Medium, PingFang SC; | ||||
|         font-weight: 500; | ||||
|         color: #333; | ||||
|         line-height: 44px; | ||||
|         margin-bottom: 12px; | ||||
|       } | ||||
|  | ||||
|       .gird { | ||||
|         display: inline-block; | ||||
|         line-height: 44px; | ||||
|         background: #E8EFFF; | ||||
|         border-radius: 8px; | ||||
|         padding: 0 8px; | ||||
|         font-size: 26px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         color: #26F; | ||||
|         margin-bottom: 12px; | ||||
|       } | ||||
|  | ||||
|       p { | ||||
|         font-size: 26px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         color: #666; | ||||
|         line-height: 36px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .user-item { | ||||
|     img { | ||||
|       width: 96px; | ||||
|       height: 96px; | ||||
|       border-radius: 50%; | ||||
|     } | ||||
|  | ||||
|     image { | ||||
|       width: 96px; | ||||
|       height: 96px; | ||||
|       border-radius: 50%; | ||||
|     } | ||||
|  | ||||
|     .gird { | ||||
|       display: inline-block; | ||||
|       margin-left: 16px; | ||||
|       margin-bottom: 0 !important; | ||||
|     } | ||||
|  | ||||
|     .name { | ||||
|       margin-bottom: 8px !important; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .family-btn { | ||||
|     font-size: 26px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     color: #3975C6; | ||||
|     line-height: 36px; | ||||
|     float: right; | ||||
|   } | ||||
|  | ||||
|   .pad-b112 { | ||||
|     padding-bottom: 112px; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,272 +0,0 @@ | ||||
| <template> | ||||
|   <div class="SelectGird"> | ||||
|     <div class="header-middle"> | ||||
|       <div class="hint"> | ||||
|         <span v-for="(item, index) in slectList" :key="index"> | ||||
|           <span v-if="index" style="margin:0 4px;" v-text="`/`"/> | ||||
|           <span style="color:#3F8DF5" @click="girdNameClick(item, index)" v-text="item.girdName"/> | ||||
|         </span> | ||||
|       </div> | ||||
|       <div class="showTypes"> | ||||
|         <div v-if="treeList.length > 0"> | ||||
|           <div class="cards" v-for="(item, index) in treeList" :key="index" @click="itemClick(item)"> | ||||
|             <div class="imges"> | ||||
|               <img src="./components/img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" | ||||
|                    @click.stop="girdClick(item, index)"/> | ||||
|               <img src="./components/img/xz.png" alt="" class="imgselect" v-else @click.stop="girdClick(item, index)"/> | ||||
|               <img src="./components/img/gird--select-icon.png" alt="" class="avatras"/> | ||||
|             </div> | ||||
|             <div class="rightes fill"> | ||||
|               <div class="applicationNames fill">{{ item.girdName }}</div> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|         <AiEmpty :description="isGridMember?`暂无数据`:`当前人员不是网格员或网格长`" class="emptyWrap" v-else/> | ||||
|       </div> | ||||
|     </div> | ||||
|     <!-- <div style="padding-bottom: 70px;"></div> --> | ||||
|     <div class="subBtn" flex> | ||||
|       <div v-if="clearable" class="cancel" @click="cancel">清空</div> | ||||
|       <div @click="submit">确定选择</div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
|  | ||||
| export default { | ||||
|   name: 'SelectGird', | ||||
|   data() { | ||||
|     return { | ||||
|       SelectGird: {}, | ||||
|       allData: null, | ||||
|       treeList: [], | ||||
|       slectList: [], | ||||
|       parentGirdId: '', | ||||
|       isFormMap: 0, //1为网格地图 一级不允许选中 | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     isMyGirds() { | ||||
|       return this.$route.query.self == true | ||||
|     }, | ||||
|     isGridMember() { | ||||
|       return this.user.girdCheckType > 0 | ||||
|     }, | ||||
|     //是否是网格员申报 | ||||
|     isApply: v => v.$route.query.formType == 2, | ||||
|     clearable: v => v.$route.query.clearable, | ||||
|     selected: v => [v.$route.query.selected].flat() | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     if (option.isFormMap) { | ||||
|       this.isFormMap = option.isFormMap | ||||
|     } | ||||
|     this.isGridMember || this.isApply ? this.getAllGrids() : this.$u.toast('当前人员不是网格员或网格长') | ||||
|   }, | ||||
|   methods: { | ||||
|     getAllGrids() { | ||||
|       this.slectList = [] | ||||
|       let {girdMemberId} = this.user, | ||||
|           url = `/app/appgirdmemberinfo/queryMyGirdListByLevel2AndUser`, | ||||
|           params = {girdMemberId} | ||||
|       if (this.isApply) { | ||||
|         url = `/app/appgirdinfo/listByInfo` | ||||
|         params = {} | ||||
|       } | ||||
|       if (this.isMyGirds) { | ||||
|         url = `/app/appgirdmemberinfo/queryMyGirdListByLevel2` | ||||
|       } | ||||
|       this.$http.post(url, null, {params}).then((res) => { | ||||
|         if (res?.data) { | ||||
|           let parents = res.data.map(e => e.parentGirdId) | ||||
|           this.allData = res.data.map(e => ({...e, hasChildren: parents.includes(e.id)})) | ||||
|           this.treeInit() | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     treeInit(isClick) { | ||||
|       let last = uni.getStorageSync("lastSelectedGrid") | ||||
|       if (!isClick && last && !this.isApply) { | ||||
|         this.$http.post("/app/appgirdinfo/listFatherGirdInfo", null, { | ||||
|           params: {girdId: last} | ||||
|         }).then(res => { | ||||
|           if (res?.data) { | ||||
|             this.slectList = [{girdName: '可选范围', id: ''}, res.data.filter(e => !!this.allData.find(a => a.id == e.id))].flat() | ||||
|             this.getGridsByGridMemberAndParent({id: last}) | ||||
|           } | ||||
|         }) | ||||
|       } else { | ||||
|         this.treeList = this.allData.filter((e, i, arr) => !arr.map(e => e.id).includes(e.parentGirdId) || this.isMyGirds) | ||||
|         this.treeList.map((item) => item.isChecked = this.selected.includes(item.id)) | ||||
|         let obj = {girdName: '可选范围', id: ''} | ||||
|         this.slectList.push(obj) | ||||
|       } | ||||
|     }, | ||||
|     itemClick(row) { | ||||
|       if (row.hasChildren) { | ||||
|         let obj = { | ||||
|           girdName: row.girdName, | ||||
|           id: row.id, | ||||
|         } | ||||
|         this.slectList.push(obj) | ||||
|         this.getGridsByGridMemberAndParent(row) | ||||
|       } | ||||
|     }, | ||||
|     getGridsByGridMemberAndParent(row) { | ||||
|       let {id: parentGirdId} = row | ||||
|       this.treeList = this.allData.filter(e => e.parentGirdId == parentGirdId) | ||||
|       this.treeList.map((item) => item.isChecked = this.selected.includes(item.id)) | ||||
|     }, | ||||
|     girdNameClick(row, index) { | ||||
|       if (!index) { //第一级别 | ||||
|         this.slectList = [] | ||||
|         this.treeInit(true) | ||||
|       } else { | ||||
|         this.slectList.splice(index, 8) | ||||
|         this.getGridsByGridMemberAndParent(row) | ||||
|       } | ||||
|     }, | ||||
|     girdClick(row, index) { | ||||
|       if (this.treeList[index].isChecked) {//取消 | ||||
|         this.treeList[index].isChecked = false | ||||
|         this.SelectGird = {} | ||||
|       } else { | ||||
|         this.treeList.map((item) => { | ||||
|           item.isChecked = false | ||||
|         }) | ||||
|         this.treeList[index].isChecked = true | ||||
|         this.SelectGird = row | ||||
|       } | ||||
|       this.$forceUpdate() | ||||
|     }, | ||||
|     submit() { | ||||
|       if (this.SelectGird.id != null) { | ||||
|         if (!this.isApply && !this.isMyGirds) { | ||||
|           uni.setStorageSync("lastSelectedGrid", this.SelectGird.parentGirdId) | ||||
|         } | ||||
|         uni.navigateBack({ | ||||
|           success: () => { | ||||
|             uni.$emit("pagePicker:custom", this.SelectGird) | ||||
|           } | ||||
|         }) | ||||
|       } else { | ||||
|         return this.$u.toast('请选择网格') | ||||
|       } | ||||
|     }, | ||||
|     cancel() { | ||||
|       this.SelectGird = {} | ||||
|       uni.navigateBack({ | ||||
|         success: () => { | ||||
|           uni.$emit("pagePicker:custom", this.SelectGird) | ||||
|         } | ||||
|       }) | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .SelectGird { | ||||
|   min-height: 100vh; | ||||
|   background: #fff; | ||||
|   padding-bottom: 140px; | ||||
|   box-sizing: border-box; | ||||
|  | ||||
|   .header-middle { | ||||
|     .hint { | ||||
|       padding: 28px 20px 28px 32px; | ||||
|       line-height: 56px; | ||||
|       box-shadow: 0px 1px 0px 0px #e4e5e6; | ||||
|       font-size: 30px; | ||||
|       font-weight: 500; | ||||
|       word-break: break-all; | ||||
|     } | ||||
|  | ||||
|     .showTypes { | ||||
|       .cards { | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         height: 120px; | ||||
|         line-height: 120px; | ||||
|         // background: pink; | ||||
|         padding: 0 0 0 32px; | ||||
|  | ||||
|         .imges { | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
|           // width: 200px; | ||||
|           .imgselect { | ||||
|             width: 48px; | ||||
|             height: 48px; | ||||
|             vertical-align: middle; | ||||
|           } | ||||
|  | ||||
|           .avatras { | ||||
|             width: 74px; | ||||
|             height: 74px; | ||||
|             border-radius: 8px; | ||||
|             margin-left: 36px; | ||||
|           } | ||||
|         } | ||||
|  | ||||
|         img { | ||||
|           width: 74px; | ||||
|           height: 74px; | ||||
|           border-radius: 8px; | ||||
|         } | ||||
|  | ||||
|         .rightes { | ||||
|           display: flex; | ||||
|           border-bottom: 1px solid #e4e5e6; | ||||
|           padding: 0 16px; | ||||
|  | ||||
|           .applicationNames { | ||||
|             display: inline-block; | ||||
|             font-size: 36px; | ||||
|             font-weight: 500; | ||||
|             color: #333333; | ||||
|             overflow: hidden; | ||||
|             text-overflow: ellipsis; | ||||
|             white-space: nowrap; | ||||
|             vertical-align: bottom; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|  | ||||
|   } | ||||
|  | ||||
|   .subBtn { | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     left: 0; | ||||
|     width: 100%; | ||||
|     height: 118px; | ||||
|     background: #f4f8fb; | ||||
|     justify-content: flex-end; | ||||
|  | ||||
|     div { | ||||
|       width: 192px; | ||||
|       height: 80px; | ||||
|       line-height: 80px; | ||||
|       text-align: center; | ||||
|       border: 2px solid #1365dd; | ||||
|       background: #1365dd; | ||||
|       border-radius: 4px; | ||||
|       font-size: 32px; | ||||
|       color: #fff; | ||||
|       margin-right: 32px; | ||||
|  | ||||
|       &.cancel { | ||||
|         color: #333; | ||||
|         background: #fff; | ||||
|         border-color: #ddd; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
| } | ||||
| </style> | ||||
| @@ -1,184 +0,0 @@ | ||||
| <template> | ||||
|   <div class="setGird"> | ||||
|     <AiGroup> | ||||
|       <AiItem :label="detail.girdName" :border="false" labelBold> | ||||
|         <u-icon name="arrow-right" label="查看网格成员" label-pos="left" label-color="#3F8DF5" @click="showGirdInfo()"/> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <AiGroup> | ||||
|       <AiItem label="下级网格" top-label :border="false" labelBold> | ||||
|         <div v-if="treeList.length > 0"> | ||||
|           <div class="cards" v-for="(item, index) in treeList" :key="index"> | ||||
|             <div class="rightes fill" flex> | ||||
|               <img src="./components/img/gird--select-icon.png" alt="" class="avatras"/> | ||||
|               <div class="applicationNames fill" @click="showGirdInfo(item)">{{ item.girdName }}</div> | ||||
|               <u-icon @click="itemClick(item)" name="arrow-right" color="#ddd"/> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|         <AiEmpty description="暂无数据" class="emptyWrap" v-else/> | ||||
|       </AiItem> | ||||
|     </AiGroup> | ||||
|     <div class="subBtn" v-if="detail.girdRight==1" flex> | ||||
|       <div class="delete" @click="handleDelete">删除网格</div> | ||||
|       <div @click="edit">编辑网格</div> | ||||
|       <div @click="toAddGird">添加下级网格</div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
| <script> | ||||
| import {mapState} from "vuex" | ||||
|  | ||||
| export default { | ||||
|   name: 'setGird', | ||||
|   data() { | ||||
|     return { | ||||
|       detail: {}, | ||||
|       treeList: [], | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']) | ||||
|   }, | ||||
|   onShow() { | ||||
|     this.getAllGrids() | ||||
|     document.title = '网格配置' | ||||
|   }, | ||||
|   methods: { | ||||
|     getAllGrids() { | ||||
|       let {id: parentGirdId} = this.$route.query | ||||
|       this.$http.post(`/app/appgirdinfo/listByInfo`, null, { | ||||
|         params: {parentGirdId} | ||||
|       }).then(res => { | ||||
|         if (res?.data) { | ||||
|           let parents = [...new Set(res.data.map(e => e.parentGirdId))] | ||||
|           this.detail = res.data.find(e => e.id == parentGirdId) || {} | ||||
|           this.treeList = res.data.filter(e => e.parentGirdId == parentGirdId).map(e => ({...e, hasChildren: parents.includes(e.id)})) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     itemClick(row) { | ||||
|       uni.navigateTo({url: `./SetGird?id=${row.id}`}) | ||||
|     }, | ||||
|     showGirdInfo(row = {id: this.$route.query.id}) { | ||||
|       uni.navigateTo({url: `./gridMembers?id=${row.id}`}) | ||||
|     }, | ||||
|     callPhone(phone) { | ||||
|       uni.makePhoneCall({phoneNumber: phone}) | ||||
|     }, | ||||
|     toAddGird() { | ||||
|       uni.navigateTo({url: `./AddGird?id=${this.detail.id}&fromType=add`}) | ||||
|     }, | ||||
|     edit() { | ||||
|       uni.navigateTo({url: `./AddGird?id=${this.detail.id}&fromType=edit`}) | ||||
|     }, | ||||
|     handleDelete() { | ||||
|       this.$confirm('删除网格后,会清除网格内网格员的责任家庭信息,如有下级网格,会同步删除下级网格所有数据', `您确认要删除该网格?`).then(() => { | ||||
|         this.$http.post(`/app/appgirdinfo/delete?ids=${this.detail.id}`).then((res) => { | ||||
|           if (res?.code == 0) { | ||||
|             this.$u.toast('删除成功!') | ||||
|             uni.navigateBack({}) | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .setGird { | ||||
|   min-height: 100vh; | ||||
|   background: #F5F6F7; | ||||
|   padding-bottom: 140px; | ||||
|   box-sizing: border-box; | ||||
|  | ||||
|   .empty-div { | ||||
|     height: 16px; | ||||
|     background: #f5f5f5; | ||||
|   } | ||||
|  | ||||
|   .cards { | ||||
|     display: flex; | ||||
|     align-items: center; | ||||
|     height: 120px; | ||||
|     line-height: 120px; | ||||
|     // background: pink; | ||||
|  | ||||
|     .avatras { | ||||
|       width: 74px; | ||||
|       height: 74px; | ||||
|       border-radius: 8px; | ||||
|       margin-right: 20px; | ||||
|     } | ||||
|  | ||||
|     img { | ||||
|       width: 74px; | ||||
|       height: 74px; | ||||
|       border-radius: 8px; | ||||
|     } | ||||
|  | ||||
|     .rightes { | ||||
|       display: flex; | ||||
|       border-bottom: 1px solid #e4e5e6; | ||||
|       padding-right: 16px; | ||||
|  | ||||
|       .applicationNames { | ||||
|         display: inline-block; | ||||
|         font-size: 36px; | ||||
|         font-weight: 500; | ||||
|         color: #333333; | ||||
|         overflow: hidden; | ||||
|         text-overflow: ellipsis; | ||||
|         white-space: nowrap; | ||||
|         vertical-align: bottom; | ||||
|       } | ||||
|  | ||||
|       .imgs { | ||||
|         width: 40px; | ||||
|         height: 40px; | ||||
|         margin-right: 0; | ||||
|         vertical-align: middle; | ||||
|       } | ||||
|  | ||||
|       .u-icon { | ||||
|         padding: 0 16px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .subBtn { | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     left: 0; | ||||
|     width: 100%; | ||||
|     height: 118px; | ||||
|     background: #f4f8fb; | ||||
|     font-family: PingFangSC-Medium, PingFang SC; | ||||
|     justify-content: flex-end; | ||||
|  | ||||
|     div { | ||||
|       padding: 0 32px; | ||||
|       height: 88px; | ||||
|       line-height: 88px; | ||||
|       text-align: center; | ||||
|       background: #1365dd; | ||||
|       border-radius: 8px; | ||||
|       font-size: 32px; | ||||
|       color: #fff; | ||||
|       margin-left: 22px; | ||||
|       border: 2px #1365dd solid; | ||||
|  | ||||
|       &.delete { | ||||
|         background: #fff; | ||||
|         color: #f46; | ||||
|         border-color: #f46; | ||||
|       } | ||||
|  | ||||
|       &:last-of-type { | ||||
|         margin-right: 32px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,167 +0,0 @@ | ||||
| <template> | ||||
|   <div class="Statistics"> | ||||
|     <div class="middle"> | ||||
|       <div class="girdPeople">网格内人员情况</div> | ||||
|  | ||||
|       <div class="card"> | ||||
|         <div class="box"> | ||||
|           <span class="count" v-if="peopleList && peopleList['网格长']">{{ peopleList['网格长'] }}</span> | ||||
|           <span class="count" v-else>0</span> | ||||
|           <span class="girdCount">网格长</span> | ||||
|         </div> | ||||
|  | ||||
|         <div class="box"> | ||||
|           <span class="count" v-if="peopleList && peopleList['网格员']">{{ peopleList['网格员'] }}</span> | ||||
|           <span class="count" v-else>0</span> | ||||
|           <span class="girdCount">网格员</span> | ||||
|         </div> | ||||
|  | ||||
|         <div class="box"> | ||||
|           <span class="count" v-if="peopleList && peopleList['责任家庭数']">{{ peopleList['责任家庭数'] }}</span> | ||||
|           <span class="count" v-else>0</span> | ||||
|           <span class="girdCount">责任家庭数</span> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|  | ||||
|     <div class="bottom"> | ||||
|       <div class="girdMsg">网格信息</div> | ||||
|       <div class="girdCont"> | ||||
|         <div class="boxes"> | ||||
|           <span class="boxesLeft">网格名称</span> | ||||
|           <span class="boxesRight">{{ gridInfo.girdName || '' }}</span> | ||||
|         </div> | ||||
|         <div class="boxes"> | ||||
|           <span class="boxesLeft">标绘状态</span> | ||||
|           <span class="boxesRight">{{ gridInfo.plottingStatus == 1 ? '已标绘' : '未标绘' }}</span> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: 'Statistics', | ||||
|   components: {}, | ||||
|   props: { | ||||
|     dict: Object, | ||||
|     instance: Function, | ||||
|     params: Object, | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       peopleList: {}, | ||||
|       gridInfo: {}, | ||||
|       checkType: '', | ||||
|     } | ||||
|   }, | ||||
|   created() { | ||||
|     this.gridInfo = this.params | ||||
|     this.getList() | ||||
|     uni.$on('goback', (res) => { | ||||
|       this.gridInfo = res | ||||
|       this.getList() | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
|     getList() { | ||||
|       this.$http.post(`/app/appgirdmemberinfo/girdMemberAndResidentStatistic?girdId=${this.gridInfo.id}`).then((res) => { | ||||
|         if (res?.data) { | ||||
|           this.peopleList = res.data | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({url}) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .Statistics { | ||||
|   padding: 0 30px; | ||||
|   box-sizing: border-box; | ||||
|  | ||||
|   .middle { | ||||
|     background: #ffffff; | ||||
|     border-radius: 16px; | ||||
|     margin-top: 32px; | ||||
|     padding: 32px 0 60px 0; | ||||
|  | ||||
|     .girdPeople { | ||||
|       padding: 0 0 56px 24px; | ||||
|       font-size: 32px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #333333; | ||||
|     } | ||||
|  | ||||
|     .card { | ||||
|       display: flex; | ||||
|       justify-content: space-around; | ||||
|  | ||||
|       .box { | ||||
|         display: flex; | ||||
|         flex-direction: column; | ||||
|         align-items: center; | ||||
|  | ||||
|         .count { | ||||
|           font-size: 64px; | ||||
|           font-family: DINAlternate-Bold, DINAlternate; | ||||
|           font-weight: bold; | ||||
|           color: #3b424a; | ||||
|         } | ||||
|  | ||||
|         .girdCount { | ||||
|           margin-top: 8px; | ||||
|           font-size: 28px; | ||||
|           font-family: PingFangSC-Regular, PingFang SC; | ||||
|           font-weight: 400; | ||||
|           color: #999999; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .bottom { | ||||
|     background: #ffffff; | ||||
|     border-radius: 16px; | ||||
|     margin-top: 32px; | ||||
|     padding: 0 24px 64px 24px; | ||||
|  | ||||
|     .girdMsg { | ||||
|       padding: 32px 0; | ||||
|       font-size: 32px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #333333; | ||||
|     } | ||||
|  | ||||
|     .girdCont { | ||||
|       .boxes { | ||||
|         padding: 24px 0 30px 0; | ||||
|         box-shadow: inset 0px -1px 0px 0px #d8dde6; | ||||
|  | ||||
|         .boxesLeft { | ||||
|           font-size: 30px; | ||||
|           font-family: PingFang-SC-Heavy, PingFang-SC; | ||||
|           font-weight: 800; | ||||
|           color: #333333; | ||||
|           display: inline-block; | ||||
|           width: 140px; | ||||
|           vertical-align: top; | ||||
|         } | ||||
|  | ||||
|         .boxesRight { | ||||
|           margin-left: 40px; | ||||
|           font-size: 28px; | ||||
|           font-family: PingFangSC-Regular, PingFang SC; | ||||
|           color: #666666; | ||||
|           display: inline-block; | ||||
|           width: calc(100% - 200px); | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| Before Width: | Height: | Size: 3.4 KiB | 
| Before Width: | Height: | Size: 314 B | 
| Before Width: | Height: | Size: 15 KiB | 
| Before Width: | Height: | Size: 1.2 KiB | 
| Before Width: | Height: | Size: 1.1 KiB | 
| Before Width: | Height: | Size: 1.5 KiB | 
| Before Width: | Height: | Size: 1.1 KiB | 
| Before Width: | Height: | Size: 1.4 KiB | 
| Before Width: | Height: | Size: 1.4 KiB | 
| Before Width: | Height: | Size: 21 KiB | 
| Before Width: | Height: | Size: 1.8 KiB | 
| Before Width: | Height: | Size: 1.8 KiB | 
| Before Width: | Height: | Size: 373 B | 
| Before Width: | Height: | Size: 766 B | 
| Before Width: | Height: | Size: 1.7 KiB | 
| Before Width: | Height: | Size: 1.7 KiB | 
| Before Width: | Height: | Size: 18 KiB | 
| Before Width: | Height: | Size: 1.4 KiB | 
| Before Width: | Height: | Size: 2.7 KiB | 
| Before Width: | Height: | Size: 1.5 KiB | 
| Before Width: | Height: | Size: 1.7 KiB | 
| @@ -1,210 +0,0 @@ | ||||
| <template> | ||||
|   <div class="AddSet"> | ||||
|     <div class="contents"> | ||||
|       <u-form :model="forms" ref="uForm" label-width="auto" :border-bottom="false"> | ||||
|         <u-form-item label="事项分组" prop="title" required :border-bottom="false" right-icon="arrow-right"> | ||||
|           <u-input v-model="forms.title" placeholder="请输入事项分组" /> | ||||
|         </u-form-item> | ||||
|         <u-form-item label="类别" prop="status" required :border-bottom="false"> </u-form-item> | ||||
|         <div class="remove-item"> | ||||
|           <img src="./components/img/remove-icon.png" alt="" /> | ||||
|           <div class="input"> | ||||
|             <u-input v-model="forms.status" placeholder="请输入" /> | ||||
|           </div> | ||||
|         </div> | ||||
|         <div class="remove-item"> | ||||
|           <img src="./components/img/add-icon.png" alt="" /> | ||||
|           <div class="input color-2270F1">添加分类</div> | ||||
|         </div> | ||||
|       </u-form> | ||||
|     </div> | ||||
|  | ||||
|     <!-- <div class="btn" @click="submit">保存</div> --> | ||||
|     <div class="footer"> | ||||
|       <div class="remove">删除</div> | ||||
|       <div class="confirm" @click="submit">保存</div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: 'AddSet', | ||||
|   components: {}, | ||||
|   props: {}, | ||||
|   data() { | ||||
|     return { | ||||
|       forms: { | ||||
|         status: '', | ||||
|         content: '', | ||||
|         fileIds: [], | ||||
|       }, | ||||
|       flag: false, | ||||
|       show: false, | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     submit() { | ||||
|       if (this.flag) return | ||||
|  | ||||
|       this.$refs.uForm.validate((valid) => { | ||||
|         if (valid) { | ||||
|           if (!this.forms.title) { | ||||
|             return this.$u.toast('请输入事项分组') | ||||
|           } | ||||
|  | ||||
|           const imgs = [] | ||||
|           if (this.forms.fileIds) { | ||||
|             this.forms.fileIds.map((e) => { | ||||
|               imgs.push({ url: e.url, id: e.id }) | ||||
|             }) | ||||
|           } | ||||
|  | ||||
|           this.flag = true | ||||
|           this.$http | ||||
|             .post(`/app/appclapeventgroup/addOrUpdate`, { | ||||
|               title: this.forms.title, | ||||
|               content: this.forms.content, | ||||
|               // images: JSON.stringify(imgs) || [], | ||||
|               images: imgs || [], | ||||
|  | ||||
|               people: this.forms.people, | ||||
|               phone: this.forms.phone, | ||||
|               id: this.id, | ||||
|             }) | ||||
|             .then((res) => { | ||||
|               if (res.code == 0) { | ||||
|                 this.$u.toast('发布成功') | ||||
|                 this.flag = false | ||||
|                 uni.navigateTo({ url: `./AppHandSnapshot` }) | ||||
|               } | ||||
|             }) | ||||
|         } else { | ||||
|           this.$u.toast('失败') | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .AddSet { | ||||
|   height: 100%; | ||||
|   .contents { | ||||
|     ::v-deep .u-form { | ||||
|       .u-form-item { | ||||
|         padding: 0 45px !important; | ||||
|         .u-form-item__body { | ||||
|           .u-form-item--right__content__slot { | ||||
|             padding-bottom: 0; | ||||
|             .u-input { | ||||
|               text-align: right !important; | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .u-form-item:first-child { | ||||
|         .u-form-item__body { | ||||
|           border-bottom: 1px solid #ddd; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .line { | ||||
|         height: 24px; | ||||
|         background: #f3f6f9; | ||||
|       } | ||||
|  | ||||
|       .contents { | ||||
|         padding-bottom: 20px !important; | ||||
|         .u-form-item__body { | ||||
|           .u-form-item--right__content__slot { | ||||
|             .u-input { | ||||
|               text-align: left !important; | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .avatars { | ||||
|         padding-bottom: 20px !important; | ||||
|         .u-form-item__body { | ||||
|           .default { | ||||
|             width: 160px; | ||||
|             height: 160px; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .remove-item { | ||||
|     padding: 42px 0 42px 32px; | ||||
|     box-sizing: border-box; | ||||
|     background-color: #fff; | ||||
|     img { | ||||
|       width: 36px; | ||||
|       height: 36px; | ||||
|       margin-right: 12px; | ||||
|       vertical-align: middle; | ||||
|     } | ||||
|     .input { | ||||
|       display: inline-block; | ||||
|       width: calc(100% - 48px); | ||||
|       height: 36px; | ||||
|       line-height: 36px; | ||||
|     } | ||||
|     .color-2270F1 { | ||||
|       color: #2270f1; | ||||
|       font-size: 30px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       line-height: 42px; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .btn { | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     width: 100%; | ||||
|     box-sizing: border-box; | ||||
|     background: #3975c6; | ||||
|     padding: 34px 0; | ||||
|     text-align: center; | ||||
|     font-size: 32px; | ||||
|     font-weight: 500; | ||||
|     color: #ffffff; | ||||
|   } | ||||
|  | ||||
|   .footer { | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     width: 100%; | ||||
|     box-sizing: border-box; | ||||
|     background: #fff; | ||||
|     padding: 32px; | ||||
|     display: flex; | ||||
|     justify-content: space-between; | ||||
|     div { | ||||
|       height: 92px; | ||||
|       line-height: 92px; | ||||
|       box-sizing: border-box; | ||||
|       text-align: center; | ||||
|       border-radius: 8px; | ||||
|       font-size: 34px; | ||||
|       font-family: PingFangSC-Medium, PingFang SC; | ||||
|       font-weight: 500; | ||||
|     } | ||||
|     .remove { | ||||
|       flex: 1; | ||||
|       border: 1px solid #f46; | ||||
|       color: #f46; | ||||
|       margin-right: 32px; | ||||
|     } | ||||
|     .confirm { | ||||
|       flex: 2; | ||||
|       background: #3975c6; | ||||
|       color: #fff; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,154 +0,0 @@ | ||||
| <template> | ||||
|   <div class="AppHandSnapshot"> | ||||
|     <component v-if="refresh && isGridMember" :is="component" @change="onChange" :params="params"/> | ||||
|     <div class="tabs" v-if="isTab && isGridMember"> | ||||
|       <div class="item" @click="tabClick(index, item.component)" v-for="(item, index) in tabs" :key="index"> | ||||
|         <img :src="tabIndex == index ? item.activeImg : item.img" alt=""/> | ||||
|         <p :class="tabIndex == index ? 'color-3267F0' : ''">{{ item.text }}</p> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div v-if="!isGridMember" class="empty"> | ||||
|       <img src="./components/img/no-admin.png" alt=""> | ||||
|       <p>没有网格员权限<br/>无法查看随手拍信息哦~</p> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import List from './List.vue' | ||||
| import Statistics from './Statistics.vue' | ||||
| import Set from './Set.vue' | ||||
| import {mapState} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   name: 'AppHandSnapshot', | ||||
|   appName: '随手拍', | ||||
|   data() { | ||||
|     return { | ||||
|       component: 'List', | ||||
|       params: {}, | ||||
|       refresh: true, | ||||
|       tabIndex: 0, | ||||
|       tabs: [ | ||||
|         { | ||||
|           img: require('./components/img/handle-icon.png'), | ||||
|           activeImg: require('./components/img/handle-icon-active.png'), | ||||
|           text: '办理', | ||||
|           component: 'List', | ||||
|         }, | ||||
|         { | ||||
|           img: require('./components/img/statistics-icon.png'), | ||||
|           activeImg: require('./components/img/statistics-icon-active.png'), | ||||
|           text: '统计', | ||||
|           component: 'Statistics', | ||||
|         }, | ||||
|         // { | ||||
|         //   img: require('./components/img/set-icon.png'), | ||||
|         //   activeImg: require('./components/img/set-icon-active.png'), | ||||
|         //   text: '配置', | ||||
|         //   component: 'Set' | ||||
|         // } | ||||
|       ], | ||||
|       isTab: true, | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     isGridMember() { | ||||
|       return this.user.girdCheckType > 0 | ||||
|     } | ||||
|   }, | ||||
|   components: { | ||||
|     List, | ||||
|     Statistics, | ||||
|     Set, | ||||
|   }, | ||||
|  | ||||
|   methods: { | ||||
|     onChange(e) { | ||||
|       this.params = e.params | ||||
|       this.component = e.type | ||||
|     }, | ||||
|     tabClick(index, component) { | ||||
|       this.tabIndex = index | ||||
|       this.component = component | ||||
|       this.refresh = false | ||||
|       this.$nextTick(() => { | ||||
|         this.refresh = true | ||||
|       }) | ||||
|     } | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '随手拍' | ||||
|     uni.$on('hideTab', () => { | ||||
|       this.isTab = false | ||||
|     }) | ||||
|     uni.$on('showTab', () => { | ||||
|       this.isTab = true | ||||
|     }) | ||||
|  | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     if (!this.tabIndex) { | ||||
|       uni.$emit('nextList') | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .AppHandSnapshot { | ||||
|   height: 100%; | ||||
| } | ||||
|  | ||||
| .tabs { | ||||
|   width: 100%; | ||||
|   height: 98px; | ||||
|   background: #fff; | ||||
|   border-top: 1px solid #ddd; | ||||
|   position: fixed; | ||||
|   bottom: 0; | ||||
|   left: 0; | ||||
|   display: flex; | ||||
|  | ||||
|   .item { | ||||
|     flex: 1; | ||||
|     text-align: center; | ||||
|  | ||||
|     img { | ||||
|       width: 56px; | ||||
|       height: 56px; | ||||
|       margin-top: 8px; | ||||
|     } | ||||
|  | ||||
|     p { | ||||
|       font-size: 22px; | ||||
|       font-family: PingFangSC-Medium, PingFang SC; | ||||
|       font-weight: 500; | ||||
|       color: #c4cad4; | ||||
|       line-height: 8px; | ||||
|     } | ||||
|  | ||||
|     .color-3267F0 { | ||||
|       color: #3267f0; | ||||
|     } | ||||
|   } | ||||
| } | ||||
|  | ||||
| .empty { | ||||
|   text-align: center; | ||||
|  | ||||
|   img { | ||||
|     width: 282px; | ||||
|     height: 306px; | ||||
|     margin: 136px auto 0; | ||||
|   } | ||||
|  | ||||
|   p { | ||||
|     font-size: 28px; | ||||
|     font-family: PingFangSC-Regular, PingFang SC; | ||||
|     color: #999; | ||||
|     line-height: 40px; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,242 +0,0 @@ | ||||
| <template> | ||||
|   <div class="Transfer"> | ||||
|     <div class="contents"> | ||||
|       <u-form :model="forms" ref="uForm" label-width="auto" :border-bottom="false"> | ||||
|         <u-form-item label="转交给" prop="status" required :border-bottom="false" right-icon="arrow-right" class="first-form" v-if="status == 1"> | ||||
|           <u-input v-model="forms.name" placeholder="请选择转交对象" @click="toSelectUser" disabled/> | ||||
|         </u-form-item> | ||||
|         <u-form-item label="事件分类" prop="groupName" required :border-bottom="false" right-icon="arrow-right" v-if="status != 1"> | ||||
|           <!-- <u-input v-model="forms.groupName" placeholder="请选择事件分类"  /> --> | ||||
|           <span @click="show = true" class="right-span" :style="forms.groupName ? '' : 'color:#999;'">{{ forms.groupName || '请选择事件分类' }}</span> | ||||
|  | ||||
|           <u-select v-model="show" :list="myList" value-name="id" label-name="groupName" @confirm="selectStatus"></u-select> | ||||
|         </u-form-item> | ||||
|  | ||||
|         <u-form-item :label="status == 3 ? '办结意见' : status == 2 ? '拒绝受理意见' : '办理意见'" prop="content" required :border-bottom="false" label-position="top" | ||||
|                      class="contents"> | ||||
|           <u-input v-model="forms.content" :placeholder="status == 2 ? '请写下拒绝受理意见…' : '请写下你的办结意见...'" type="textarea" auto-height height="100" maxlength="500"/> | ||||
|         </u-form-item> | ||||
|  | ||||
|         <div class="line"></div> | ||||
|  | ||||
|         <u-form-item label="图片上传(最多9张)" prop="files" :border-bottom="false" class="avatars" label-position="top"> | ||||
|           <AiUploader :def.sync="forms.files" multiple placeholder="上传图片" :limit="9" action="/admin/file/add2"></AiUploader> | ||||
|         </u-form-item> | ||||
|  | ||||
|       </u-form> | ||||
|     </div> | ||||
|  | ||||
|     <div class="btn" v-if="this.status == 1" @click="confirm"> | ||||
|       <span>转交事件</span> | ||||
|     </div> | ||||
|  | ||||
|     <div class="btn" v-if="this.status == 2" @click="confirm"> | ||||
|       <span>拒绝受理</span> | ||||
|     </div> | ||||
|  | ||||
|     <div class="btn" v-if="this.status == 3" @click="confirm"> | ||||
|       <span>我已办结</span> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: 'Content', | ||||
|   components: {}, | ||||
|   props: {}, | ||||
|   data() { | ||||
|     return { | ||||
|       forms: { | ||||
|         groupName: '', | ||||
|         groupId: '', | ||||
|         content: '', | ||||
|         files: [], | ||||
|         name: '' | ||||
|       }, | ||||
|       flag: false, | ||||
|       show: false, | ||||
|       status: '',  //1转交  2拒绝受理  3我已办结 | ||||
|       myList: [], | ||||
|       id: '', | ||||
|       selectUser: {}, | ||||
|       titleList: ['', '转交事件', '拒绝受理', '我已办结'] | ||||
|     } | ||||
|   }, | ||||
|   onLoad(option) { | ||||
|     this.status = option.status | ||||
|     this.id = option.id | ||||
|     this.forms.groupId = option.groupId | ||||
|     this.forms.groupName = option.groupName | ||||
|     this.typeList() | ||||
|     uni.$on('pagePicker:custom', (res) => { | ||||
|       this.selectUser = res | ||||
|       if (res.name) { | ||||
|         this.forms.name = res.name | ||||
|       } else { | ||||
|         this.forms.name = res.girdName | ||||
|       } | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = this.titleList[this.status] | ||||
|   }, | ||||
|   methods: { | ||||
|  | ||||
|     typeList() { | ||||
|       this.$http.post(`/app/appclapeventgroup/list`, null, { | ||||
|         params: { | ||||
|           size: 9999, | ||||
|         }, | ||||
|       }) | ||||
|       .then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.myList = res.data.records | ||||
|           this.$forceUpdate() | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     confirm() { | ||||
|       if (this.status == 1 && !this.forms.name) { | ||||
|         return this.$u.toast('请选择转交对象') | ||||
|       } | ||||
|       if (this.status != 1 && !this.forms.groupName) { | ||||
|         return this.$u.toast('请选择分类') | ||||
|       } | ||||
|       if (this.status != 1 && !this.forms.content) { | ||||
|         return this.$u.toast('请输入意见') | ||||
|       } | ||||
|       this.submit() | ||||
|     }, | ||||
|     submit() {  //status 1转交  2拒绝受理  3我已办结 | ||||
|       var url = '', successText = '', params = '' | ||||
|       if (this.status == 1) { | ||||
|         url = `/app/appclapeventinfo/transfer` | ||||
|         successText = '转交成功' | ||||
|         params = { | ||||
|           ...this.forms, | ||||
|           girdId: this.selectUser.id, | ||||
|           girdName: this.selectUser.girdName, | ||||
|         } | ||||
|         if (this.selectUser.name) { //选择的网格员 | ||||
|           params.girdId = this.selectUser.girdId | ||||
|           params.girdMemberId = this.selectUser.id | ||||
|           params.girdMemberName = this.selectUser.name | ||||
|         } | ||||
|       } | ||||
|       if (this.status == 2) { | ||||
|         url = `/app/appclapeventinfo/refuse` | ||||
|         successText = '拒绝成功' | ||||
|         params = {...this.forms} | ||||
|       } | ||||
|       if (this.status == 3) { | ||||
|         url = `/app/appclapeventinfo/finishByGirdMember` | ||||
|         successText = '办结成功' | ||||
|         params = {...this.forms} | ||||
|       } | ||||
|       params.id = this.id | ||||
|       this.$http.post(url, params).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.$u.toast(successText) | ||||
|           uni.$emit('updateDeatil') | ||||
|           uni.$emit('getListInit') | ||||
|           setTimeout(() => { | ||||
|             if (this.status == 1) { | ||||
|               uni.navigateBack({delta: 2}) | ||||
|             } else { | ||||
|               uni.navigateBack() | ||||
|             } | ||||
|           }, 600) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     selectStatus(e) { | ||||
|       this.forms.groupName = e[0].label | ||||
|       this.forms.groupId = e[0].value | ||||
|     }, | ||||
|     toSelectUser() { | ||||
|       uni.navigateTo({url: '../AppGridManagement/selectGridMember'}) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .Transfer { | ||||
|   height: 100%; | ||||
|  | ||||
|   .contents { | ||||
|     padding-bottom: 140px; | ||||
|  | ||||
|     ::v-deep .u-form { | ||||
|       .u-form-item { | ||||
|         padding: 0 45px !important; | ||||
|  | ||||
|         .u-form-item__body { | ||||
|           .u-form-item--right__content__slot { | ||||
|             padding-bottom: 0; | ||||
|  | ||||
|             .u-input { | ||||
|               text-align: right !important; | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .u-form-item:first-child { | ||||
|         .u-form-item__body { | ||||
|           border-bottom: 1px solid #ddd; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .line { | ||||
|         height: 24px; | ||||
|         background: #f3f6f9; | ||||
|       } | ||||
|  | ||||
|       .contents { | ||||
|         padding-bottom: 20px !important; | ||||
|  | ||||
|         .u-form-item__body { | ||||
|           .u-form-item--right__content__slot { | ||||
|             .u-input { | ||||
|               text-align: left !important; | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .avatars { | ||||
|         padding-bottom: 20px !important; | ||||
|  | ||||
|         .u-form-item__body { | ||||
|           .default { | ||||
|             width: 160px; | ||||
|             height: 160px; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .btn { | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     width: 100%; | ||||
|     box-sizing: border-box; | ||||
|     background: #3975c6; | ||||
|     padding: 34px 0; | ||||
|     text-align: center; | ||||
|     font-size: 32px; | ||||
|     font-weight: 500; | ||||
|     color: #ffffff; | ||||
|   } | ||||
|  | ||||
|   .right-span { | ||||
|     display: inline-block; | ||||
|     width: 100%; | ||||
|     text-align: right; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,449 +0,0 @@ | ||||
| <template> | ||||
|   <div class="Detail"> | ||||
|     <div class="header-top"> | ||||
|       <div class="avatars" v-if="data.name">{{ data.name.substring(data.name.length, data.name.length - 2) }}</div> | ||||
|  | ||||
|       <div class="right"> | ||||
|         <div class="names">{{ data.name }}的上报</div> | ||||
|  | ||||
|         <div class="times">{{ data.createTime }}</div> | ||||
|       </div> | ||||
|     </div> | ||||
|  | ||||
|     <div class="header-middle"> | ||||
|       <div class="titles">{{ data.content }}</div> | ||||
|  | ||||
|       <span class="status status0" :class="data.eventStatus == 0 ? 'status0' : data.eventStatus == 1 ? 'status1' : data.eventStatus == 2 ? 'status2' : 'status3'" v-if="data.eventStatus"> {{ $dict.getLabel('clapEventStatus', data.eventStatus) }}</span> | ||||
|  | ||||
|       <div class="card"> | ||||
|         <span class="card-left">事件类型</span> | ||||
|         <span class="card-right">{{ data.groupName }}</span> | ||||
|       </div> | ||||
|  | ||||
|       <div class="card"> | ||||
|         <span class="card-left">所属网格</span> | ||||
|         <span class="card-right">{{ data.girdName }}</span> | ||||
|       </div> | ||||
|  | ||||
|       <div class="card"> | ||||
|         <span class="card-left">联系方式</span> | ||||
|         <span class="card-right"> | ||||
|           <span> {{ data.phone }}</span> | ||||
|           <u-icon name="phone-fill" color="#3D94FB" @click="callPhone(data.phone)"></u-icon> | ||||
|         </span> | ||||
|       </div> | ||||
|  | ||||
|       <div class="card"> | ||||
|         <span class="card-left">上报地址</span> | ||||
|         <span class="card-right"> | ||||
|           <span>{{ data.address }}</span> | ||||
|         </span> | ||||
|       </div> | ||||
|  | ||||
|       <!-- 暂时先去掉 --> | ||||
|  | ||||
|       <!-- <div class="card"> | ||||
|         <span class="card-left">上报来源</span> | ||||
|         <span class="card-right">三角湖居民社群 李毅 小程序填报三角湖居民社群 李毅 小程序填报三角湖居民社群 李毅 小程序填报</span> | ||||
|       </div> --> | ||||
|  | ||||
|       <div class="cards"> | ||||
|         <span class="card-left" style="color:#999">照片</span> | ||||
|       </div> | ||||
|  | ||||
|       <img :src="item.url" alt="" v-for="(item, i) in data.files" :key="i"  @click="previewImage(data.files, item.url)" /> | ||||
|     </div> | ||||
|  | ||||
|     <div class="header-bottom"> | ||||
|       <div class="line"></div> | ||||
|  | ||||
|       <div class="plan"> | ||||
|         <div class="nav"> | ||||
|           <span>办理进度</span> | ||||
|           <span> ({{ $dict.getLabel('clapEventStatus', data.eventStatus) }})</span> | ||||
|         </div> | ||||
|  | ||||
|         <div class="cards" v-for="(item, index) in data.processList" :key="index"> | ||||
|           <div class="cardss"> | ||||
|             <div class="cardss-left"> | ||||
|               <span> | ||||
|                 <!-- {{ item.systemExplain }} --> | ||||
|                 {{ item.girdMemberName && item.girdMemberName.substring(item.girdMemberName.length, item.girdMemberName.length - 2) }} | ||||
|               </span> | ||||
|  | ||||
|               <!-- <img src="./components/1.png" class="avatarIcon" alt="" /> --> | ||||
|             </div> | ||||
|  | ||||
|             <div class="cardss-right"> | ||||
|               <div class="cardsss-right-left"> | ||||
|                 <div class="cardssss-right-left-top"> | ||||
|                   <span>{{ item.systemExplain }}</span> | ||||
|                   <div style="color: #2ea222; font-size: 16px; margin-top: 5px"> | ||||
|                     {{ $dict.getLabel('clapDoStatus', item.doStatus) }} | ||||
|                   </div> | ||||
|                 </div> | ||||
|               </div> | ||||
|  | ||||
|               <div class="cardees-right-right">{{ item.doTime }}</div> | ||||
|             </div> | ||||
|  | ||||
|             <div class="lines"></div> | ||||
|           </div> | ||||
|  | ||||
|           <div class="cardes-msg-top" v-if="item.doExplain">{{ item.doExplain }}</div> | ||||
|  | ||||
|           <div class="imgs"> | ||||
|             <img :src="e.url" alt="" v-for="(e, index) in item.files" :key="index"  @click="previewImage(item.files, e.url)" /> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|  | ||||
|     <div class="fixedBtn"> | ||||
|       <div class="status00" v-if="data.eventStatus == 0"> | ||||
|         <div class="columns border-r" @click="toContent(1)"> | ||||
|           <!-- <img src="./components/img/zhuanjiao.png" alt="" /> --> | ||||
|           <span class="hint">转交事件</span> | ||||
|         </div> | ||||
|  | ||||
|         <div class="columns" @click="toContent(2)"> | ||||
|           <!-- <img src="./components/img/jujue.png" alt="" /> --> | ||||
|           <span class="hint">拒绝受理</span> | ||||
|         </div> | ||||
|  | ||||
|         <div class="doIt" @click="doItShow = true">我来受理</div> | ||||
|       </div> | ||||
|  | ||||
|       <div class="endDoIt" v-if="data.eventStatus == 1 && data.rightType == 0" @click="toContent(3)">前往办理</div> | ||||
|     </div> | ||||
|  | ||||
|     <u-modal v-model="doItShow" :mask-close-able="true" z-index="99" content="确定受理该事件?" :show-cancel-button="true" @confirm="doThings"></u-modal> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: 'Detail', | ||||
|   components: {}, | ||||
|   props: {}, | ||||
|   data() { | ||||
|     return { | ||||
|       data: {}, | ||||
|       id: '', | ||||
|       doItShow: false, | ||||
|     } | ||||
|   }, | ||||
|   computed: {}, | ||||
|   watch: {}, | ||||
|   onLoad(o) { | ||||
|     this.id = o.id | ||||
|     this.$dict.load('realityStatus', 'clapDoStatus').then(() => { | ||||
|       this.getDetail() | ||||
|     }) | ||||
|  | ||||
|     uni.$on('updateDeatil', () => { | ||||
|       this.getDetail() | ||||
|     }) | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '随手拍' | ||||
|   }, | ||||
|   methods: { | ||||
|     getDetail() { | ||||
|       this.$http.post(`/app/appclapeventinfo/queryDetailById?id=${this.id}`).then((res) => { | ||||
|         if (res?.data) { | ||||
|           this.data = res.data | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     callPhone(phone) { | ||||
|       uni.makePhoneCall({ phoneNumber: phone }) | ||||
|     }, | ||||
|  | ||||
|     doThings() { | ||||
|       this.$http.post(`/app/appclapeventinfo/acceptance?id=${this.id}`).then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.getDetail() | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     toContent(status) { | ||||
|       uni.navigateTo({ url: `./Content?status=${status}&groupId=${this.data.groupId}&groupName=${this.data.groupName}&id=${this.id}` }) | ||||
|     }, | ||||
|     previewImage(images, img) { | ||||
|       uni.previewImage({ | ||||
|         urls: images.map(v => v.url), | ||||
|         current: img | ||||
|       }) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| uni-page-body { | ||||
|   height: 100%; | ||||
| } | ||||
| .Detail { | ||||
|   height: 100%; | ||||
|   background: #fff; | ||||
|  | ||||
|   .header-top { | ||||
|     display: flex; | ||||
|     margin: 26px 0 14px 0; | ||||
|     padding: 0 32px; | ||||
|     .avatars { | ||||
|       width: 80px; | ||||
|       height: 80px; | ||||
|       line-height: 80px; | ||||
|       background: #3975c6; | ||||
|       border-radius: 50%; | ||||
|       color: #fff; | ||||
|       text-align: center; | ||||
|       font-size: 28px; | ||||
|       font-weight: 500; | ||||
|       margin-right: 16px; | ||||
|     } | ||||
|     .right { | ||||
|       .names { | ||||
|         font-size: 32px; | ||||
|         font-weight: 500; | ||||
|       } | ||||
|       .times { | ||||
|         margin-top: 10px; | ||||
|         font-size: 28px; | ||||
|         color: #999999; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .header-middle { | ||||
|     padding: 0 32px 10px 32px; | ||||
|     .titles { | ||||
|       margin: 32px 0; | ||||
|       line-height: 1.4; | ||||
|       word-break: break-all; | ||||
|       font-size: 40px; | ||||
|       font-weight: 600; | ||||
|     } | ||||
|     .status { | ||||
|       display: inline-block; | ||||
|       margin-bottom: 14px; | ||||
|       padding: 4px 8px; | ||||
|       font-size: 26px; | ||||
|       color: #ffffff; | ||||
|       border-radius: 8px; | ||||
|     } | ||||
|     .status0 { | ||||
|       background: #ff883c; | ||||
|     } | ||||
|  | ||||
|     .status1 { | ||||
|       background: #1aaaff; | ||||
|     } | ||||
|  | ||||
|     .status2 { | ||||
|       background: #42d784; | ||||
|     } | ||||
|  | ||||
|     .status3 { | ||||
|       background: #ff4466; | ||||
|     } | ||||
|  | ||||
|     .card { | ||||
|       display: flex; | ||||
|       justify-content: space-between; | ||||
|       padding: 34px 0; | ||||
|       border-bottom: 1px solid #ddd; | ||||
|       .card-left { | ||||
|         width: 46%; | ||||
|         font-size: 32px; | ||||
|         color: #999999; | ||||
|       } | ||||
|       .card-right { | ||||
|         font-size: 32px; | ||||
|         .u-icon { | ||||
|           margin-left: 8px; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     // .card:last-child { | ||||
|     //   border-bottom: none; | ||||
|     // } | ||||
|  | ||||
|     .cards { | ||||
|       padding: 34px 0; | ||||
|     } | ||||
|  | ||||
|     img { | ||||
|       width: 225px; | ||||
|       height: 226px; | ||||
|       margin-right: 8px; | ||||
|     } | ||||
|     img:nth-child(3n) { | ||||
|       margin-right: 0; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .header-bottom { | ||||
|     padding-bottom: 80px; | ||||
|     .line { | ||||
|       height: 16px; | ||||
|       background: #f3f6f9; | ||||
|     } | ||||
|  | ||||
|     .plan { | ||||
|       padding: 0 32px; | ||||
|       .nav { | ||||
|         padding: 26px 0; | ||||
|       } | ||||
|  | ||||
|       .cards { | ||||
|         position: relative; | ||||
|         padding-bottom: 80px; | ||||
|         .cardss { | ||||
|           display: flex; | ||||
|           justify-content: space-between; | ||||
|  | ||||
|           .cardss-left { | ||||
|             position: relative; | ||||
|             width: 80px; | ||||
|             height: 80px; | ||||
|             text-align: center; | ||||
|             line-height: 80px; | ||||
|             color: #fff; | ||||
|             background: #197df0; | ||||
|             border: 1px solid #dddddd; | ||||
|             border-radius: 50%; | ||||
|             font-size: 28px; | ||||
|             z-index: 9; | ||||
|             // img { | ||||
|             //   width: 100%; | ||||
|             //   height: 100%; | ||||
|             //   border-radius: 50%; | ||||
|             // } | ||||
|             .avatarIcon { | ||||
|               position: absolute; | ||||
|               bottom: 0; | ||||
|               right: 0; | ||||
|               width: 38px; | ||||
|               height: 38px; | ||||
|             } | ||||
|           } | ||||
|           .cardss-right { | ||||
|             width: calc(100% - 110px); | ||||
|             display: flex; | ||||
|             justify-content: space-between; | ||||
|             .cardsss-right-left { | ||||
|               .cardssss-right-left-top { | ||||
|                 width: 300px; | ||||
|                 overflow: hidden; | ||||
|                 text-overflow: ellipsis; | ||||
|                 font-size: 32px; | ||||
|               } | ||||
|               .cardssss-right-left-bottom { | ||||
|                 margin-top: 10px; | ||||
|                 font-size: 28px; | ||||
|                 color: #666666; | ||||
|               } | ||||
|             } | ||||
|             .cardees-right-right { | ||||
|               font-size: 28px; | ||||
|               color: #999999; | ||||
|             } | ||||
|           } | ||||
|           .lines { | ||||
|             position: absolute; | ||||
|             top: 0; | ||||
|             left: 40px; | ||||
|             width: 4px; | ||||
|             height: 100%; | ||||
|             background: #eeeeee; | ||||
|           } | ||||
|         } | ||||
|         .cardes-msg-top { | ||||
|           font-size: 28px; | ||||
|           color: #343d65; | ||||
|           margin-top: 10px; | ||||
|           margin-left: 110px; | ||||
|         } | ||||
|  | ||||
|         .imgs { | ||||
|           margin-top: 10px; | ||||
|           margin-left: 110px; | ||||
|           img { | ||||
|             width: 136px; | ||||
|             height: 136px; | ||||
|             border-radius: 4px; | ||||
|             margin-right: 12px; | ||||
|           } | ||||
|           img:nth-child(4n) { | ||||
|             margin-right: 0; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|       .cards:last-child { | ||||
|         .lines { | ||||
|           width: 0; | ||||
|           height: 0; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   .fixedBtn { | ||||
|     background: #fff; | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     width: 100%; | ||||
|     box-sizing: border-box; | ||||
|     z-index: 999; | ||||
|     .status00 { | ||||
|       display: flex; | ||||
|  | ||||
|       .columns { | ||||
|         display: flex; | ||||
|         flex-direction: column; | ||||
|         align-items: center; | ||||
|         width: 22%; | ||||
|         padding: 16px 0; | ||||
|         border-top: 1px solid #ddd; | ||||
|         img { | ||||
|           width: 44px; | ||||
|           height: 42px; | ||||
|         } | ||||
|         .hint { | ||||
|           margin-top: 4px; | ||||
|           font-size: 28px; | ||||
|           color: #666666; | ||||
|         } | ||||
|       } | ||||
|       .border-r { | ||||
|         border-right: 1px solid #ddd; | ||||
|       } | ||||
|       .doIt { | ||||
|         width: 56%; | ||||
|         background: #3975c6; | ||||
|         text-align: center; | ||||
|         line-height: 112px; | ||||
|         font-size: 36px; | ||||
|         font-weight: 500; | ||||
|         color: #fff; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     .endDoIt { | ||||
|       background: #3975c6; | ||||
|       text-align: center; | ||||
|       padding: 34px 0; | ||||
|  | ||||
|       font-size: 32px; | ||||
|       font-weight: 500; | ||||
|       color: #ffffff; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,275 +0,0 @@ | ||||
| <template> | ||||
|   <div class="list"> | ||||
|     <AiTopFixed> | ||||
|       <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#3975C6" inactive-color="#fff" active-color="#fff" | ||||
|               @change="change"></u-tabs> | ||||
|       <div class="select-top"> | ||||
|         <div class="tab-item"> | ||||
|           <AiPagePicker type="custom" v-model="searchGrid" @change="confirm" valueObj nodeKey="id" formType="2" | ||||
|                         :ops="{url:'../AppGridManagement/SelectGird',label: 'girdName'}"> | ||||
|             <AiMore v-model="searchGrid.girdName" icon="arrow-down" placeholder="所属网格"/> | ||||
|           </AiPagePicker> | ||||
|         </div> | ||||
|         <div class="tab-item" @click="showType = true"> | ||||
|           <AiMore v-model="eventStatusText" icon="arrow-down" placeholder="办件状态"/> | ||||
|         </div> | ||||
|         <u-select v-model="showType" :list="listType" value-name="dictValue" label-name="dictName" @confirm="confirm"></u-select> | ||||
|       </div> | ||||
|     </AiTopFixed> | ||||
|     <template> | ||||
|       <AiCard v-for="(item, i) in datas" :key="i" @click.native="goDetail(item, 1)"> | ||||
|         <template #custom> | ||||
|           <div class="card-top"> | ||||
|             <div class="titles">{{ item.content }}</div> | ||||
|  | ||||
|             <div class="types"> | ||||
|               <span>事件类型</span> | ||||
|               <span class="types-right">{{ item.groupName }}</span> | ||||
|             </div> | ||||
|  | ||||
|             <div class="gards"> | ||||
|               <span>所属网格</span> | ||||
|               <span class="gards-right">{{ item.girdName }}</span> | ||||
|             </div> | ||||
|           </div> | ||||
|  | ||||
|           <div class="status" :class="item.eventStatus == 0 ? 'status0' : item.eventStatus == 1 ? 'status1' : item.eventStatus == 2 ? 'status2' : 'status3'" | ||||
|                v-if="item.eventStatus"> | ||||
|             <span class="icon"></span> | ||||
|             <span> | ||||
|               {{ $dict.getLabel('clapEventStatus', item.eventStatus) }} | ||||
|             </span> | ||||
|           </div> | ||||
|         </template> | ||||
|       </AiCard> | ||||
|       <AiEmpty v-if="!datas.length"></AiEmpty> | ||||
|     </template> | ||||
|     <div class="pad-b120" v-if="datas.length"></div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from 'vuex' | ||||
|  | ||||
| export default { | ||||
|   props: {}, | ||||
|   data() { | ||||
|     return { | ||||
|       datas: [], | ||||
|       tabList: [ | ||||
|         { | ||||
|           name: '全部待办', | ||||
|         }, | ||||
|         { | ||||
|           name: '办件历史', | ||||
|         }, | ||||
|       ], | ||||
|       currentTabs: 0, | ||||
|       current: 1, | ||||
|       pages: 0, | ||||
|       searchGrid: {}, | ||||
|       showType: false, | ||||
|       eventStatus: '', | ||||
|       eventStatusText: '', | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     listType() { | ||||
|       return this.$dict.getDict(this.currentTabs == 0 ? 'clapEventStatusAll' : 'clapEventStatusHistory') | ||||
|     } | ||||
|   }, | ||||
|   onLoad() { | ||||
|     uni.$on('nextList', () => { | ||||
|       this.current++ | ||||
|       this.getList() | ||||
|     }) | ||||
|     uni.$on('getListInit', () => { | ||||
|       this.current = 1 | ||||
|       this.getList() | ||||
|     }) | ||||
|  | ||||
|   }, | ||||
|   onShow() { | ||||
|     document.title = '随手拍' | ||||
|   }, | ||||
|   created() { | ||||
|     this.$dict.load('clapEventStatus', 'clapEventStatusAll', 'clapEventStatusHistory').then(() => { | ||||
|       this.getList() | ||||
|     }) | ||||
|   }, | ||||
|   methods: { | ||||
|     getList() { | ||||
|       let {current, eventStatus, searchGrid: {id: girdId}} = this | ||||
|       this.$http.post(`/app/appclapeventinfo/listByGirdMember`, null, { | ||||
|         params: { | ||||
|           size: 10, | ||||
|           current, searchType: this.currentTabs == 1 ? '1' : '0', | ||||
|           eventStatus, girdId | ||||
|         }, | ||||
|       }) | ||||
|       .then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records | ||||
|           this.pages = res.data.pages | ||||
|           this.$forceUpdate() | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     confirm(e) { | ||||
|       if (this.showType) { | ||||
|         this.eventStatus = e[0].value | ||||
|         this.eventStatusText = e[0].label | ||||
|       } | ||||
|       this.current = 1 | ||||
|       this.getList() | ||||
|     }, | ||||
|  | ||||
|     goDetail(item) { | ||||
|       uni.navigateTo({url: `./Detail?id=${item.id}`}) | ||||
|     }, | ||||
|  | ||||
|     change(index) { | ||||
|       this.current = 1 | ||||
|       this.datas = [] | ||||
|       this.eventStatus = '' | ||||
|       this.currentTabs = index | ||||
|       this.getList() | ||||
|     }, | ||||
|  | ||||
|     linkTo(url) { | ||||
|       uni.navigateTo({url}) | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .list { | ||||
|   height: 100%; | ||||
|  | ||||
|   .select-top { | ||||
|     background: #fff; | ||||
|     display: flex; | ||||
|     padding: 24px 0; | ||||
|  | ||||
|     .tab-item { | ||||
|       flex: 1; | ||||
|       text-align: center; | ||||
|       line-height: 48px; | ||||
|       font-size: 26px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #666; | ||||
|  | ||||
|       img { | ||||
|         width: 32px; | ||||
|         height: 32px; | ||||
|         margin-left: 8px; | ||||
|         vertical-align: middle; | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     .tab-item:nth-of-type(1) { | ||||
|       border-right: 1px solid #eee; | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   ::v-deep .AiTopFixed .content { | ||||
|     padding: 0; | ||||
|   } | ||||
|  | ||||
|   ::v-deep .AiCard { | ||||
|     background: #f3f6f9; | ||||
|     padding: 24px 40px 0 32px; | ||||
|  | ||||
|     .start { | ||||
|       background: #fff; | ||||
|       border-radius: 16px; | ||||
|  | ||||
|       .card-top { | ||||
|         padding: 32px; | ||||
|  | ||||
|         .titles { | ||||
|           margin-bottom: 34px; | ||||
|           font-size: 32px; | ||||
|           font-weight: 500; | ||||
|           color: #333333; | ||||
|           line-height: 1.4; | ||||
|           word-break: break-all; | ||||
|           overflow: hidden; | ||||
|           text-overflow: ellipsis; | ||||
|           display: -webkit-box; | ||||
|           -webkit-line-clamp: 2; | ||||
|           -webkit-box-orient: vertical; | ||||
|         } | ||||
|  | ||||
|         .types, | ||||
|         .gards { | ||||
|           margin-top: 8px; | ||||
|           font-size: 26px; | ||||
|  | ||||
|           .types-right, | ||||
|           .gards-right { | ||||
|             margin-left: 32px; | ||||
|             color: #333333; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .status { | ||||
|         padding: 32px; | ||||
|         border-top: 1px solid #dddddd; | ||||
|  | ||||
|         .icon { | ||||
|           display: inline-block; | ||||
|           width: 8px; | ||||
|           height: 8px; | ||||
|           vertical-align: middle; | ||||
|           margin-right: 8px; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .status0 { | ||||
|         color: #ff883c; | ||||
|  | ||||
|         .icon { | ||||
|           background: #ff883c; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .status1 { | ||||
|         color: #1aaaff; | ||||
|  | ||||
|         .icon { | ||||
|           background: #1aaaff; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .status2 { | ||||
|         color: #42d784; | ||||
|  | ||||
|         .icon { | ||||
|           background: #42d784; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .status3 { | ||||
|         color: #ff4466; | ||||
|  | ||||
|         .icon { | ||||
|           background: #ff4466; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   // ::v-deep .AiCard:last-child { | ||||
|   //   padding-bottom: 24px; | ||||
|   // } | ||||
|   .pad-b120 { | ||||
|     background-color: #f3f6f9; | ||||
|     padding-bottom: 120px; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,211 +0,0 @@ | ||||
| <template> | ||||
|   <div class="PercentageDetail"> | ||||
|     <div class="header"> | ||||
|       <div class="left"> | ||||
|         <h2>小区管理</h2> | ||||
|         <p>共21条,已办结18条</p> | ||||
|       </div> | ||||
|       <div class="right"> | ||||
|         <h4>86%</h4> | ||||
|         <p>办结率</p> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="info-content"> | ||||
|       <div class="title">分类统计</div> | ||||
|       <div class="percentage"> | ||||
|         <div class="item"> | ||||
|           <div class="mini-title">小区管理</div> | ||||
|           <div class="info"> | ||||
|             <div class="line-bg"><div class="active-bg"></div></div>共11条 | 已办结9 | ||||
|           </div> | ||||
|         </div> | ||||
|         <div class="item"> | ||||
|           <div class="mini-title">小区管理</div> | ||||
|           <div class="info"> | ||||
|             <div class="line-bg" style="width:44%;"><div class="active-bg"></div></div>共11条 | 已办结9 | ||||
|           </div> | ||||
|         </div> | ||||
|         <div class="item"> | ||||
|           <div class="mini-title">小区管理</div> | ||||
|           <div class="info"> | ||||
|             <div class="line-bg" style="width:30%;"><div class="active-bg"></div></div>共11条 | 已办结9 | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   props: {}, | ||||
|   data() { | ||||
|     return { | ||||
|       contents: [ | ||||
|         { | ||||
|           label: '待受理', | ||||
|           num: 5 | ||||
|         }, | ||||
|         { | ||||
|           label: '办理中', | ||||
|           num: 5 | ||||
|         }, | ||||
|         { | ||||
|           label: '今日上报', | ||||
|           num: 5 | ||||
|         }, | ||||
|         { | ||||
|           label: '今日办结', | ||||
|           num: 5 | ||||
|         } | ||||
|       ] | ||||
|     } | ||||
|   }, | ||||
|   onLoad() { | ||||
|  | ||||
|   }, | ||||
|   onShow() {}, | ||||
|   methods: { | ||||
|     getList() { | ||||
|       this.$http | ||||
|         .post('/app/appvisitvondolence/list', null, { | ||||
|           params: { | ||||
|             size: this.size, | ||||
|             current: this.current, | ||||
|             createUserId: this.currentTabs == 1 ? this.user.id : '', | ||||
|           }, | ||||
|         }) | ||||
|         .then((res) => { | ||||
|           if (res.code == 0) { | ||||
|             this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records | ||||
|             this.pages = res.data.pages | ||||
|           } | ||||
|         }) | ||||
|     }, | ||||
|  | ||||
|     goDetail(item) { | ||||
|       uni.navigateTo({ url: `./Detail?id=${item.id}` }) | ||||
|     }, | ||||
|  | ||||
|     change(index) { | ||||
|       this.currentTabs = index | ||||
|       this.getList() | ||||
|     }, | ||||
|   }, | ||||
|   onReachBottom() { | ||||
|     this.current = this.current + 1 | ||||
|     this.getList() | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .PercentageDetail { | ||||
|   background-color: #F3F7F8; | ||||
|   padding: 32px 30px 0; | ||||
|   .header{ | ||||
|     width: 100%; | ||||
|     background: #FFF; | ||||
|     border-radius: 16px; | ||||
|     margin-bottom: 30px; | ||||
|     display: flex; | ||||
|     padding: 32px 32px 38px 24px; | ||||
|     box-sizing: border-box; | ||||
|     .left{ | ||||
|       width: calc(100% - 112px); | ||||
|       h2{ | ||||
|         font-size: 42px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         font-weight: 400; | ||||
|         color: #333; | ||||
|         line-height: 48px; | ||||
|         margin-bottom: 16px; | ||||
|       } | ||||
|       p{ | ||||
|         font-size: 30px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         color: #999; | ||||
|         line-height: 42px; | ||||
|       } | ||||
|     } | ||||
|     .right{ | ||||
|       width: 112px; | ||||
|       background: #E6FFF1; | ||||
|       border-radius: 8px; | ||||
|       text-align: center; | ||||
|       color: #42D784; | ||||
|       h4{ | ||||
|         font-size: 36px; | ||||
|         font-family: DINAlternate-Bold, DINAlternate; | ||||
|         font-weight: bold; | ||||
|         line-height: 42px; | ||||
|         padding: 8px 0 4px 0; | ||||
|       } | ||||
|       p{ | ||||
|         font-size: 24px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         line-height: 34px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .info-content{ | ||||
|     width: 100%; | ||||
|     background: #FFF; | ||||
|     border-radius: 16px; | ||||
|     margin-bottom: 24px; | ||||
|     .title{ | ||||
|       font-size: 32px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       font-weight: 400; | ||||
|       color: #333; | ||||
|       line-height: 48px; | ||||
|       padding: 24px 16px 24px 24px; | ||||
|       img{ | ||||
|         float: right; | ||||
|         width: 40px; | ||||
|         height: 40px; | ||||
|       } | ||||
|     } | ||||
|     .percentage{ | ||||
|       padding: 16px 0 0 26px; | ||||
|       .item{ | ||||
|         width: 100%; | ||||
|         padding-bottom: 32px; | ||||
|         .mini-title{ | ||||
|           font-size: 30px; | ||||
|           font-family: PingFangSC-Regular, PingFang SC; | ||||
|           color: #333; | ||||
|           line-height: 48px; | ||||
|           margin-bottom: 14px; | ||||
|         } | ||||
|         .info{ | ||||
|           width: 100%; | ||||
|           font-size: 28px; | ||||
|           font-family: PingFangSC-Regular, PingFang SC; | ||||
|           color: #999; | ||||
|           line-height: 48px; | ||||
|           .line-bg{ | ||||
|             display: inline-block; | ||||
|             width: 56%; | ||||
|             height: 14px; | ||||
|             background: #D7D8D9; | ||||
|             border-radius: 8px; | ||||
|             margin-right: 12px; | ||||
|             .active-bg{ | ||||
|               width: 80%; | ||||
|               height: 100%; | ||||
|               background: #257FF1; | ||||
|               border-radius: 8px; | ||||
|             } | ||||
|           } | ||||
|           img{ | ||||
|             width: 32px; | ||||
|             height: 32px; | ||||
|             vertical-align: middle; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,76 +0,0 @@ | ||||
| <template> | ||||
|   <div class="set"> | ||||
|     <div class="info-content" @click="toSetList"> | ||||
|       <img src="./components/img/setting-icon.png" alt="" class="set-icon"> | ||||
|       <div class="info"> | ||||
|         <h2>配置事件类别</h2> | ||||
|         <p>提交上报时选择事件类别,有助于管理上报和统计分析</p> | ||||
|       </div> | ||||
|       <img src="./components/img/right-icon.png" alt="" class="right-icon"> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   props: {}, | ||||
|   data() { | ||||
|     return { | ||||
|  | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     toSetList() { | ||||
|       uni.navigateTo({url: './SetList'}) | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| uni-page-body { | ||||
|   height: 100%; | ||||
| } | ||||
| .set { | ||||
|   height: 100%; | ||||
|   padding: 32px 30px 0; | ||||
|   box-sizing: border-box; | ||||
|   background-color: #F3F7F8; | ||||
|   .info-content{ | ||||
|     width: 100%; | ||||
|     background-color: #fff; | ||||
|     padding: 40px 8px 34px 40px; | ||||
|     box-sizing: border-box; | ||||
|     display: flex; | ||||
|     .set-icon{ | ||||
|       width: 40px; | ||||
|       height: 40px; | ||||
|       margin-right: 44px; | ||||
|     } | ||||
|     .info{ | ||||
|       display: inline-block; | ||||
|       width: calc(100% - 216px); | ||||
|       h2{ | ||||
|         font-size: 36px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         color: #333; | ||||
|         line-height: 48px; | ||||
|         margin-bottom: 6px; | ||||
|       } | ||||
|       p{ | ||||
|         width: 100%; | ||||
|         font-size: 28px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         color: #999; | ||||
|         line-height: 40px; | ||||
|         word-break: break-all; | ||||
|       } | ||||
|     } | ||||
|     .right-icon{ | ||||
|       width: 56px; | ||||
|       height: 56px; | ||||
|       margin-left: 76px; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,122 +0,0 @@ | ||||
| <template> | ||||
|   <div class="SetList"> | ||||
|     <div class="header"> | ||||
|       <div class="title">事件类别</div> | ||||
|       <p>成员上报时需要选择事件类别,上报会按照分类进行统计。</p> | ||||
|     </div> | ||||
|     <div class="set-list"> | ||||
|       <div class="item"> | ||||
|         <div class="title">小区管理</div> | ||||
|         <div class="tips-list"> | ||||
|           <span class="tips">公共部位设置地桩锁</span> | ||||
|           <span class="tips">公共部位桩锁</span> | ||||
|           <span class="tips">地桩锁</span> | ||||
|           <span class="tips">公共部位设置地桩锁</span> | ||||
|           <span class="tips">公共部位桩锁</span> | ||||
|           <span class="tips">地桩锁</span> | ||||
|           <span class="tips">公共部位设置地桩锁</span> | ||||
|           <span class="tips">公共部位桩锁</span> | ||||
|           <span class="tips">地桩锁</span> | ||||
|         </div> | ||||
|         <img src="./components/img/right-icon.png" alt=""> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="btn" @click="toAddSet">新建分类</div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: 'SetList', | ||||
|   components: {}, | ||||
|   props: { | ||||
|     dict: Object, | ||||
|     instance: Function, | ||||
|     params: Object, | ||||
|   }, | ||||
|   data() { | ||||
|     return {} | ||||
|   }, | ||||
|   methods: { | ||||
|     toAddSet() { | ||||
|       uni.navigateTo({url: './AddSet'}) | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .SetList { | ||||
|   height: 100%; | ||||
|   background-color: #fff; | ||||
|   .header{ | ||||
|     padding: 40px 30px 74px; | ||||
|     .title{ | ||||
|       font-size: 42px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #333; | ||||
|       line-height: 48px; | ||||
|       margin-bottom: 16px; | ||||
|     } | ||||
|     p{ | ||||
|       width: 100%; | ||||
|       font-size: 30px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       color: #999; | ||||
|       line-height: 42px; | ||||
|       word-break: break-all; | ||||
|     } | ||||
|   } | ||||
|   .set-list{ | ||||
|     padding: 0 28px 120px; | ||||
|     .item{ | ||||
|       width: 100%; | ||||
|       padding-bottom: 20px; | ||||
|       border-bottom: 1px solid #E9EAEB; | ||||
|       position: relative; | ||||
|       .title{ | ||||
|         font-size: 34px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         color: #333; | ||||
|         line-height: 48px; | ||||
|         margin-bottom: 22px; | ||||
|       } | ||||
|       .tips-list{ | ||||
|         width: calc(100% - 68px); | ||||
|       } | ||||
|       .tips{ | ||||
|         display: inline-block; | ||||
|         line-height: 64px; | ||||
|         background: #F7F8F9; | ||||
|         border-radius: 8px; | ||||
|         padding: 0 20px; | ||||
|         font-size: 30px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         color: #999; | ||||
|         margin: 0 16px 24px 0; | ||||
|       } | ||||
|       img{ | ||||
|         width: 40px; | ||||
|         height: 40px; | ||||
|         position: absolute; | ||||
|         top: 50%; | ||||
|         right: 20px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .btn{ | ||||
|     width: 100%; | ||||
|     line-height: 112px; | ||||
|     background: #3975C6; | ||||
|     box-shadow: inset 0px 1px 0px 0px #EEEEEE; | ||||
|     position: fixed; | ||||
|     bottom: 0; | ||||
|     left: 0; | ||||
|     text-align: center; | ||||
|     font-size: 32px; | ||||
|     font-family: PingFangSC-Medium, PingFang SC; | ||||
|     font-weight: 500; | ||||
|     color: #FFF; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,346 +0,0 @@ | ||||
| <template> | ||||
|   <div class="statistics" v-if="pageShow"> | ||||
|     <div class="info-content"> | ||||
|       <div class="title">今日概况</div> | ||||
|       <div class="el-row"> | ||||
|         <div class="item" v-for="(item, index) in todayList" :key="index"> | ||||
|           <h2>{{item.value}}</h2> | ||||
|           <p>{{item.label}}</p> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="info-content"> | ||||
|       <div class="title">业务透视</div> | ||||
|       <div class="business"> | ||||
|         <div class="left"> | ||||
|           <div class="item"> | ||||
|             <p>受理率</p> | ||||
|             <h2>{{info.businessCountMap['受理率'] || '0'}}%</h2> | ||||
|           </div> | ||||
|           <div class="item"> | ||||
|             <p>办结率</p> | ||||
|             <h2>{{info.businessCountMap['办结率'] || '0'}}%</h2> | ||||
|           </div> | ||||
|         </div> | ||||
|         <div class="right"> | ||||
|           <div class="img"> | ||||
|             <img src="./components/img/line-img.png" alt=""> | ||||
|             <img src="./components/img/line-img.png" alt=""> | ||||
|           </div> | ||||
|           <div class="num"> | ||||
|             <div class="item bg1"> | ||||
|               <h2>累计反馈</h2> | ||||
|               <p>{{info.businessCountMap['累计反馈'] || '0'}}</p> | ||||
|             </div> | ||||
|             <div class="item bg2"> | ||||
|               <h2>累计受理</h2> | ||||
|               <p>{{info.businessCountMap['累计受理'] || '0'}}</p> | ||||
|             </div> | ||||
|             <div class="item bg3"> | ||||
|               <h2>累计办理</h2> | ||||
|               <p>{{info.businessCountMap['累计办结'] || '0'}}</p> | ||||
|             </div> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|     <div class="info-content"> | ||||
|       <div class="title" @click="toPercentageDetail">分类统计 | ||||
|         <!-- <img src="./components/img/right-icon.png" alt=""> --> | ||||
|       </div> | ||||
|       <div class="percentage"> | ||||
|         <div class="item" v-for="(item, index) in info.groupList" :key="index"> | ||||
|           <div class="mini-title">{{item.groupName}}</div> | ||||
|           <div class="info"> | ||||
|             <div class="line-bg" :style="`width:${item.width}%`" ><div class="active-bg" :style="`width:${item.percentage*100}%`"></div></div>共{{item.totalNum}}条 | 已办结{{item.finishNum}} | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </div> | ||||
|     <!-- <div class="info-content" @click="toUserList"> | ||||
|       <div class="title">成员明细 | ||||
|         <img src="./components/img/right-icon.png" alt=""> | ||||
|       </div> | ||||
|     </div> --> | ||||
|     <div class="pad-b120"></div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   props: {}, | ||||
|   data() { | ||||
|     return { | ||||
|       todayList: [], | ||||
|       info: {}, | ||||
|       pageShow: false, | ||||
|       showSelect: false, | ||||
|       myGirdList: [], | ||||
|       girdName: '全部网格' | ||||
|     } | ||||
|   }, | ||||
|   mounted() { | ||||
|     this.girdList() | ||||
|     this.getStatistics() | ||||
|   }, | ||||
|   methods: { | ||||
|     getStatistics() { | ||||
|       this.$http.post('/app/appclapeventinfo/countByGirdMember').then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           if(res.data.businessCountMap['受理率']) { | ||||
|             res.data.businessCountMap['受理率'] = Number(res.data.businessCountMap['受理率'] * 100).toFixed(1) | ||||
|           } | ||||
|           if(res.data.businessCountMap['办结率']) { | ||||
|             res.data.businessCountMap['办结率'] = Number(res.data.businessCountMap['办结率'] * 100).toFixed(1) | ||||
|           } | ||||
|           this.info = res.data | ||||
|  | ||||
|           Object.keys(res.data.todayCountMap).forEach((key) => { | ||||
|             var info = { | ||||
|               label: key, | ||||
|               value: res.data.todayCountMap[key] | ||||
|             } | ||||
|             this.todayList.push(info) | ||||
|           }) | ||||
|           if(this.info.groupList.length) { | ||||
|             this.info.groupList.map((item, index) => { | ||||
|               if(item.finishNum) { | ||||
|                 item.percentage = (item.finishNum/item.totalNum).toFixed(2) | ||||
|               }else { | ||||
|                 item.percentage = 0 | ||||
|               } | ||||
|               item.width = 56-(index*10) | ||||
|             }) | ||||
|           } | ||||
|         } | ||||
|         this.pageShow = true | ||||
|       }) | ||||
|     }, | ||||
|  | ||||
|     goDetail(item) { | ||||
|       uni.navigateTo({ url: `./Detail?id=${item.id}` }) | ||||
|     }, | ||||
|  | ||||
|     change(index) { | ||||
|       this.currentTabs = index | ||||
|       this.getList() | ||||
|     }, | ||||
|  | ||||
|     toPercentageDetail() { | ||||
|       uni.navigateTo({url: './PercentageDetail'}) | ||||
|     }, | ||||
|     toUserList() { | ||||
|       uni.navigateTo({url: './UserList'}) | ||||
|     }, | ||||
|  | ||||
|     girdList() { | ||||
|       this.$http.post(`/app/appgirdmemberinfo/queryMyGirdList`, null, { | ||||
|         params: { | ||||
|           size: 9999, | ||||
|         }, | ||||
|       }) | ||||
|       .then((res) => { | ||||
|         if (res.code == 0) { | ||||
|           this.myGirdList = res.data | ||||
|           var all = { | ||||
|             id: '', | ||||
|             girdName: '全部' | ||||
|           } | ||||
|           this.myGirdList.unshift(all) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     confirm(e) { | ||||
|  | ||||
|     } | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .statistics { | ||||
|   background-color: #F3F7F8; | ||||
|   padding: 30px 30px 0; | ||||
|   .gird-select{ | ||||
|     width: 100%; | ||||
|     background: #FFF; | ||||
|     border-radius: 16px; | ||||
|     margin: 0 0 24px; | ||||
|     text-align: center; | ||||
|     padding: 24px 0; | ||||
|     img{ | ||||
|       width: 32px; | ||||
|       height: 32px; | ||||
|       vertical-align: middle; | ||||
|     } | ||||
|     span{ | ||||
|       display: inline-block; | ||||
|       font-size: 34px; | ||||
|       font-family: PingFangSC-Medium, PingFang SC; | ||||
|       font-weight: 500; | ||||
|       color: #333; | ||||
|       line-height: 48px; | ||||
|       margin: 0 10px; | ||||
|     } | ||||
|   } | ||||
|   .info-content{ | ||||
|     width: 100%; | ||||
|     background: #FFF; | ||||
|     border-radius: 16px; | ||||
|     margin-bottom: 24px; | ||||
|     .title{ | ||||
|       font-size: 32px; | ||||
|       font-family: PingFangSC-Regular, PingFang SC; | ||||
|       font-weight: 400; | ||||
|       color: #333; | ||||
|       line-height: 48px; | ||||
|       padding: 24px 16px 24px 24px; | ||||
|       img{ | ||||
|         float: right; | ||||
|         width: 40px; | ||||
|         height: 40px; | ||||
|       } | ||||
|     } | ||||
|     .el-row{ | ||||
|       display: flex; | ||||
|       padding: 32px 0 60px 0; | ||||
|       .item{ | ||||
|         flex: 1; | ||||
|         text-align: center; | ||||
|         h2{ | ||||
|           font-size: 64px; | ||||
|           font-family: DINAlternate-Bold, DINAlternate; | ||||
|           font-weight: bold; | ||||
|           color: #3B424A; | ||||
|           line-height: 64px; | ||||
|           margin-bottom: 8px; | ||||
|         } | ||||
|         p{ | ||||
|           font-size: 28px; | ||||
|           font-family: PingFangSC-Regular, PingFang SC; | ||||
|           color: #999; | ||||
|           line-height: 40px; | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     .business{ | ||||
|       display: flex; | ||||
|       padding: 40px 0 30px 0; | ||||
|       .left{ | ||||
|         width: 220px; | ||||
|         padding: 20px 0 78px 50px; | ||||
|         .item{ | ||||
|           margin-bottom: 58px; | ||||
|         } | ||||
|         h2{ | ||||
|           font-size: 58px; | ||||
|           font-family: DINAlternate-Bold, DINAlternate; | ||||
|           font-weight: bold; | ||||
|           color: #3B424A; | ||||
|           line-height: 64px; | ||||
|           letter-spacing: -4px; | ||||
|         } | ||||
|         p{ | ||||
|           font-size: 28px; | ||||
|           font-family: PingFangSC-Regular, PingFang SC; | ||||
|           color: #666; | ||||
|           line-height: 48px; | ||||
|         } | ||||
|       } | ||||
|       .right{ | ||||
|         width: calc(100% - 220px); | ||||
|         display: flex; | ||||
|         .img{ | ||||
|           width: 140px; | ||||
|           margin-top: 42px; | ||||
|           img{ | ||||
|             width: 140px; | ||||
|             height: 144px; | ||||
|             margin-bottom: 20px; | ||||
|           } | ||||
|         } | ||||
|         .num{ | ||||
|           width: calc(100% - 140px); | ||||
|           text-align: center; | ||||
|           .item{ | ||||
|             height: 130px; | ||||
|             border-radius: 6px; | ||||
|             background-size: 100% 100%; | ||||
|             margin-bottom: 4px; | ||||
|             color: #2F7EE5; | ||||
|             h2{ | ||||
|               font-size: 26px; | ||||
|               font-family: PingFangSC-Medium, PingFang SC; | ||||
|               font-weight: 500; | ||||
|               line-height: 48px; | ||||
|               padding-top: 20px; | ||||
|             } | ||||
|             p{ | ||||
|               font-size: 40px; | ||||
|               font-family: DINAlternate-Bold, DINAlternate; | ||||
|               font-weight: bold; | ||||
|             } | ||||
|           } | ||||
|           .bg1{ | ||||
|             width: 272px; | ||||
|             background-image: url('./components/img/bg-1.png'); | ||||
|           } | ||||
|           .bg2{ | ||||
|             width: 234px; | ||||
|             background-image: url('./components/img/bg-2.png'); | ||||
|             margin-left: 16px; | ||||
|           } | ||||
|           .bg3{ | ||||
|             width: 208px; | ||||
|             background-image: url('./components/img/bg-3.png'); | ||||
|             margin-left: 32px; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|     .percentage{ | ||||
|       padding: 16px 0 0 26px; | ||||
|       .item{ | ||||
|         width: 100%; | ||||
|         padding-bottom: 32px; | ||||
|         .mini-title{ | ||||
|           font-size: 30px; | ||||
|           font-family: PingFangSC-Regular, PingFang SC; | ||||
|           color: #333; | ||||
|           line-height: 48px; | ||||
|           margin-bottom: 14px; | ||||
|         } | ||||
|         .info{ | ||||
|           width: 100%; | ||||
|           font-size: 28px; | ||||
|           font-family: PingFangSC-Regular, PingFang SC; | ||||
|           color: #999; | ||||
|           line-height: 48px; | ||||
|           .line-bg{ | ||||
|             display: inline-block; | ||||
|             height: 14px; | ||||
|             background: #D7D8D9; | ||||
|             border-radius: 8px; | ||||
|             margin-right: 12px; | ||||
|             .active-bg{ | ||||
|               height: 100%; | ||||
|               background: #257FF1; | ||||
|               border-radius: 8px; | ||||
|               min-width: 1%; | ||||
|             } | ||||
|           } | ||||
|           img{ | ||||
|             width: 32px; | ||||
|             height: 32px; | ||||
|             vertical-align: middle; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   .pad-b120{ | ||||
|     background-color: #F3F7F8; | ||||
|     padding-bottom: 120px; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,60 +0,0 @@ | ||||
| <template> | ||||
|   <div class="UserList"> | ||||
|     <div class="item"> | ||||
|       <img src="./components/img/user-img.png" alt=""> | ||||
|       <div class="info"> | ||||
|         <h2>李毅</h2> | ||||
|         <p>共受理23条 | 已办结17条</p> | ||||
|       </div> | ||||
|     </div> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: 'UserList', | ||||
|   data() { | ||||
|     return { | ||||
|  | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|  | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style scoped lang="scss"> | ||||
| .UserList { | ||||
|   height: 100%; | ||||
|   .item{ | ||||
|     padding: 24px 0 0 32px; | ||||
|     background-color: #fff; | ||||
|     img{ | ||||
|       width: 80px; | ||||
|       height: 80px; | ||||
|       margin-right: 32px; | ||||
|     } | ||||
|     .info{ | ||||
|       display: inline-block; | ||||
|       width: calc(100% - 112px); | ||||
|       padding-bottom: 24px; | ||||
|       border-bottom: 1px solid #E4E5E6; | ||||
|       h2{ | ||||
|         font-size: 32px; | ||||
|         font-family: PingFangSC-Medium, PingFang SC; | ||||
|         font-weight: 500; | ||||
|         color: #333; | ||||
|         line-height: 44px; | ||||
|         margin-bottom: 6px; | ||||
|       } | ||||
|       p{ | ||||
|         font-size: 28px; | ||||
|         font-family: PingFangSC-Regular, PingFang SC; | ||||
|         color: #666; | ||||
|         line-height: 40px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| Before Width: | Height: | Size: 623 B | 
| Before Width: | Height: | Size: 810 B | 
| Before Width: | Height: | Size: 815 B | 
| Before Width: | Height: | Size: 3.2 KiB | 
| Before Width: | Height: | Size: 2.7 KiB | 
| Before Width: | Height: | Size: 2.6 KiB | 
| Before Width: | Height: | Size: 314 B | 
| Before Width: | Height: | Size: 1.2 KiB | 
| Before Width: | Height: | Size: 1.1 KiB | 
| Before Width: | Height: | Size: 1.5 KiB | 
| Before Width: | Height: | Size: 1.5 KiB | 
| Before Width: | Height: | Size: 1.5 KiB | 
| Before Width: | Height: | Size: 1.6 KiB | 
| Before Width: | Height: | Size: 1.1 KiB | 
| Before Width: | Height: | Size: 21 KiB | 
| Before Width: | Height: | Size: 803 B | 
| Before Width: | Height: | Size: 373 B | 
| Before Width: | Height: | Size: 766 B | 
| Before Width: | Height: | Size: 1.6 KiB | 
| Before Width: | Height: | Size: 1.6 KiB | 
| Before Width: | Height: | Size: 1.3 KiB | 
| Before Width: | Height: | Size: 1.7 KiB | 
| Before Width: | Height: | Size: 1.7 KiB | 
| Before Width: | Height: | Size: 1.4 KiB | 
| Before Width: | Height: | Size: 2.7 KiB | 
| Before Width: | Height: | Size: 1.5 KiB | 
| Before Width: | Height: | Size: 1.7 KiB |