From 37bf1881da02c75b7276716edf4337cd1e3cd134 Mon Sep 17 00:00:00 2001
From: aixianling <aixianling@sinoecare.com>
Date: Mon, 21 Mar 2022 17:23:12 +0800
Subject: [PATCH] =?UTF-8?q?=E5=9C=B0=E5=8C=BA=E7=BB=84=E4=BB=B6=E5=AE=8C?=
 =?UTF-8?q?=E5=85=A8=E9=87=8D=E6=9E=84=E5=85=BC=E5=AE=B9=E8=8B=B9=E6=9E=9C?=
 =?UTF-8?q?=E7=89=88=E6=9C=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/apps/AppCountryAlbum/AppCountryAlbum.vue  |  18 +-
 .../AppEpidemicSituation/BackUserList.vue     |   8 +-
 src/apps/AppEpidemicSituation/Health.vue      |   1 -
 src/apps/AppPeopleList/ExamineList.vue        |   1 -
 src/apps/AppPovertyAlleviation/MonitorAdd.vue |   1 -
 .../AppVideoSurveillance.vue                  |   6 +-
 .../AppVillageDiscuss/AppVillageDiscuss.vue   |   3 -
 src/components/AiAreaPicker.vue               | 317 ++--------------
 src/components/AiMore.vue                     |   6 +-
 src/components/pages/selectArea.vue           | 344 ++++++++++++++++++
 .../AppIntelligentSecurity.vue                |   6 +-
 src/saas/AppAskForm/AddForm.vue               |   2 +-
 .../AppConflictMediation/PercentageDetail.vue |   4 -
 13 files changed, 399 insertions(+), 318 deletions(-)
 create mode 100644 src/components/pages/selectArea.vue

diff --git a/src/apps/AppCountryAlbum/AppCountryAlbum.vue b/src/apps/AppCountryAlbum/AppCountryAlbum.vue
index aed10621..3bc74647 100644
--- a/src/apps/AppCountryAlbum/AppCountryAlbum.vue
+++ b/src/apps/AppCountryAlbum/AppCountryAlbum.vue
@@ -3,11 +3,11 @@
     <div class="list">
       <AiTopFixed>
         <div class="area-content">
-          <AiAreaPicker :areaId="user.areaId" :value="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 v-model="areaId" :name.sync="areaName">
+            <div flex>
+              <img src="./img/local-icon.png" alt="">
+              <AiMore v-model="areaName" icon="arrow-down"/>
+            </div>
           </AiAreaPicker>
         </div>
       </AiTopFixed>
@@ -38,18 +38,16 @@ export default {
     }
   },
   computed: {...mapState(['user'])},
-  onShow() {
+  created() {
     this.areaId = this.user.areaId
     this.areaName = this.user.areaName
+  },
+  onShow() {
     this.getList()
     this.cdn = this.$cdn.replace("/dvcp/h5", "");
     document.title = '乡村相册'
   },
   methods: {
-    areaSelect(e) {
-      this.areaId = e
-      this.getList()
-    },
     getList() {
       this.$http.post(`/app/appvillagepicturealbum/queryAlbumMenu`, null, {
         params: {
diff --git a/src/apps/AppEpidemicSituation/BackUserList.vue b/src/apps/AppEpidemicSituation/BackUserList.vue
index 949e9c1b..180aaff8 100644
--- a/src/apps/AppEpidemicSituation/BackUserList.vue
+++ b/src/apps/AppEpidemicSituation/BackUserList.vue
@@ -64,9 +64,11 @@ export default {
     }
   },
   computed: { ...mapState(['user']) },
-  onShow() {
+  created() {
     this.areaId = this.user.areaId
     this.areaName = this.user.areaName
+  },
+  onShow() {
     document.title = '返乡登记'
     this.getList()
     this.getTotal()
@@ -134,7 +136,7 @@ export default {
     .tab-item{
       flex: 1;
       text-align: center;
-     
+
       h2{
         font-size: 52px;
         font-family: DINAlternate-Bold, DINAlternate;
@@ -244,7 +246,7 @@ export default {
     .placeholder {
       .content {
         padding: 0 !important;
-       
+
       }
     }
     .fixed {
diff --git a/src/apps/AppEpidemicSituation/Health.vue b/src/apps/AppEpidemicSituation/Health.vue
index feb3f1d4..1098b825 100644
--- a/src/apps/AppEpidemicSituation/Health.vue
+++ b/src/apps/AppEpidemicSituation/Health.vue
@@ -123,7 +123,6 @@ export default {
     })
   },
   onShow() {
-    this.areaId = this.user.areaId
     document.title = '健康上报'
   },
   methods: {
diff --git a/src/apps/AppPeopleList/ExamineList.vue b/src/apps/AppPeopleList/ExamineList.vue
index ca513448..1266b12c 100644
--- a/src/apps/AppPeopleList/ExamineList.vue
+++ b/src/apps/AppPeopleList/ExamineList.vue
@@ -76,7 +76,6 @@ export default {
     ...mapState(['user']),
   },
   onLoad() {
-    console.log(this.user)
     this.areaId = this.user.areaId
     this.areaName = this.user.areaName
     this.$dict.load('householdRelation', 'auditStatus').then(() => {
diff --git a/src/apps/AppPovertyAlleviation/MonitorAdd.vue b/src/apps/AppPovertyAlleviation/MonitorAdd.vue
index e639f4a0..a507ab65 100644
--- a/src/apps/AppPovertyAlleviation/MonitorAdd.vue
+++ b/src/apps/AppPovertyAlleviation/MonitorAdd.vue
@@ -128,7 +128,6 @@ export default {
   },
 
   created() {
-    this.$areaId = this.$store.state.user.areaId
     this.areaName = this.$store.state.user.areaFullName
     this.$dict.load(['fpType', 'fpYesOrNo'])
   },
diff --git a/src/apps/AppVideoSurveillance/AppVideoSurveillance.vue b/src/apps/AppVideoSurveillance/AppVideoSurveillance.vue
index 82ee640e..1c6245db 100644
--- a/src/apps/AppVideoSurveillance/AppVideoSurveillance.vue
+++ b/src/apps/AppVideoSurveillance/AppVideoSurveillance.vue
@@ -170,10 +170,12 @@ export default {
       option && this.Echart.setOption(option)
     },
   },
-  onShow() {
-    document.title = '视频监控'
+  created() {
     this.areaId = this.user.areaId
     this.areaName = this.user.areaName
+  },
+  onShow() {
+    document.title = '视频监控'
     this.getList()
   },
   mounted() {
diff --git a/src/apps/AppVillageDiscuss/AppVillageDiscuss.vue b/src/apps/AppVillageDiscuss/AppVillageDiscuss.vue
index 5798b109..b9de0a48 100644
--- a/src/apps/AppVillageDiscuss/AppVillageDiscuss.vue
+++ b/src/apps/AppVillageDiscuss/AppVillageDiscuss.vue
@@ -95,11 +95,8 @@ export default {
     },
   },
   onLoad(o) {
-    console.log(this.user)
     this.moduleId = o.moduleId
     this.listName = o.listName
-
-    this.$areaId = this.user.areaName
     this.areaName = this.user.areaName
     this.areaId = this.user.areaId
 
diff --git a/src/components/AiAreaPicker.vue b/src/components/AiAreaPicker.vue
index 528be162..7ee19580 100644
--- a/src/components/AiAreaPicker.vue
+++ b/src/components/AiAreaPicker.vue
@@ -1,60 +1,26 @@
 <template>
   <section class="AiAreaPicker">
-    <ai-search-popup mode="bottom" ref="areaSelector" length="85%" :disabled="disabled">
-      <div slot="btn" @tap="handleInit">
-        <slot v-if="$slots.default"/>
-        <div v-else-if="isForm">
-          <ai-more v-model="areaName"/>
-        </div>
-        <div v-else class="areaSelector">
-          <image :src="locationIcon" class="location"/>
-          <div v-text="areaName"/>
-        </div>
+    <div @tap="handleJump">
+      <slot v-if="$slots.default"/>
+      <div v-else-if="isForm">
+        <ai-more v-model="areaName"/>
       </div>
-      <div class="areaSelector">
-        <div class="fixedTop">
-          <b>选择地区</b>
-          <em>选择区域</em>
-          <div class="selectedArea" v-if="hasSelected">
-            <p v-for="area in fullArea" :key="area.id" v-text="area.name"/>
-            <p v-if="selected.type==5" v-text="selected.name"/>
-          </div>
-          <div/>
-          <span v-if="all" v-text="`省`" @click="selectNode({}, -1)"/>
-          <span v-for="(area,i) in fullArea.filter(e=>e.type<valueLevel)" :key="area.id"
-                v-text="area.levelLabel" @click="selectNode(area, i)"/>
-        </div>
-        <!--用来作为占位的-->
-        <div class="fixedPlaceholder" style="line-height: 60px;" v-if="false">
-          <b>选择地区</b>
-          <em>选择区域</em>
-          <div class="selectedArea" v-if="hasSelected"/>
-          <span v-text="'行政区域'"/>
-        </div>
-        <!--end-->
+      <div v-else class="areaBtn">
+        <image :src="locationIcon" class="location"/>
+        <div v-text="areaName"/>
       </div>
-      <scroll-view class="fill pendingList" scroll-y :style="{height: height}">
-        <div class="pendingItem flexRow" flex v-for="op in pending" :key="op.id" @tap.stop="getChild(op)">
-          <div class="fill" :class="{ self: index == op.id }" v-html="op.name"/>
-          <u-icon v-if="index == op.id" name="checkbox-mark" color="#4181FF"/>
-        </div>
-      </scroll-view>
-      <div class="bottomBtns">
-        <div @click.stop="closePopup">取消</div>
-        <div class="primary fill" @click.stop="handleSelect">确定</div>
-      </div>
-    </ai-search-popup>
+    </div>
   </section>
 </template>
 
 <script>
-import AiSearchPopup from './AiSearchPopup'
 import {mapState} from 'vuex'
 import AiMore from "./AiMore";
+import qs from "query-string"
 
 export default {
   name: 'AiAreaPicker',
-  components: {AiMore, AiSearchPopup},
+  components: {AiMore},
   model: {
     prop: "value",
     event: "select"
@@ -69,7 +35,7 @@ export default {
     valueLevel: {default: 5},
     fullName: {default: ''},
     disabled: Boolean,
-    selectRoot: Boolean
+    selectRoot: Boolean,
   },
   computed: {
     ...mapState(['user']),
@@ -91,21 +57,10 @@ export default {
     locationIcon() {
       return this.$cdn + this.icon
     },
-    pending() {
-      return this.list.map(e => ({...e, levelLabel: this.levelLabels[e.type]}))
-    },
-    hasSelected() {
-      return this.fullArea?.length > 0
-    }
   },
   data() {
     return {
       fullArea: [],
-      index: '',
-      list: [],
-      levelLabels: ["省", "市", "县/区", "镇/街道", "村/社区"],
-      selected: {},
-      height: '500px',
       areaName: ""
     }
   },
@@ -116,36 +71,23 @@ export default {
     value(v) {
       v && !this.areaName && this.getAreaName(this.value)
     },
-    fullArea: {
-      handler(v) {
-        this.$nextTick(() => {
-          if (v) {
-            this.scrollHeight()
-          }
-        })
-      }
+    fullArea(v) {
+      v && this.$emit('update:fullName', v?.map(e => e.name)?.join("") || "")
+    },
+    areaName(v) {
+      v && this.$emit('update:name', v)
     }
   },
   created() {
     this.value && this.getAreaName(this.value)
   },
   methods: {
-    show() {
-      this.handleInit()
-      this.$refs.areaSelector.showPopup()
-    },
-    scrollHeight() {
-      this.height = document.querySelector('.areaSelector') && `calc(100% - ${document.querySelector('.areaSelector').offsetHeight}px)`
-    },
     getInfo(areaId) {
       return areaId && this.$http.post('/admin/area/getAllParentAreaId', null, {
         withoutToken: true,
         params: {areaId},
       }).then(res => {
         if (res?.data) {
-          res.data.forEach((e) => {
-            e && (e.levelLabel = this.levelLabels[e.type])
-          })
           return res.data.reverse()
         }
       })
@@ -160,237 +102,36 @@ export default {
         return this.fullArea
       })
     },
-    getChildAreas(id) {
-      id && this.$http.post('/admin/area/queryAreaByParentId', null, {
-        withoutToken: true,
-        params: {id},
-      }).then((res) => {
-        if (res?.data) {
-          this.list = res.data
-          if (this.selectRoot) {
-            let root = JSON.parse(JSON.stringify(this.fullArea?.[0]))
-            this.list.unshift(root)
-          }
-          this.scrollHeight()
-        }
-      })
-    },
-    getProvinces() {
-      this.$http.post('/admin/area/queryProvinceList', null, {withoutToken: true}).then((res) => {
-        if (res?.data) {
-          this.list = res.data
-        }
-      })
-    },
-    handleSelect() {
-      this.$emit('select', this.index)
-      this.$emit('update:name', this.selected.name)
-      this.getAreaName(null, this.selected.name)
-      this.closePopup()
-    },
-    getChild(op) {
-      if (op.id != this.index) {
-        if (op.type < this.valueLevel && op.type < 5 && (/0{3}$/g.test(this.index) || !this.index)) {
-          this.fullArea.push(op)
-          this.getChildAreas(op.id)
-        }
-        this.selected = op
-        this.index = op.id
-      }
-      this.$nextTick(() => {
-        this.scrollHeight()
-      })
-    },
-    selectNode(area, i) {
-      let deleteCount = this.fullArea.length - i
-      if (deleteCount > 0) {
-        this.fullArea.splice(i + 1, deleteCount)
-      }
-      if (this.all && !area.id) {
-        this.index = ''
-        this.getProvinces()
-      } else {
-        this.index = area.id
-        this.getChildAreas(area.id)
-      }
-    },
-    handleInit() {
-      //初始化
-      this.index = this.value || this.root
+    handleJump() {
       if (!this.disabled) {
-        if (this.value) {
-          this.getFullArea(this.value).then(() => {
-            let area = this.fullArea.find(e => e.id == this.value) || {}
-            if (area.type == this.valueLevel) this.getChildAreas(area.parentId)
-            else this.getChildAreas(area.id)
-          })
-        } else if (this.all) {
-          this.getProvinces()
-        } else {
-          this.getFullArea(this.root).then(() => {
-            this.getChildAreas(this.root)
-          })
-        }
+        uni.$once('selectArea', data => {
+          this.$emit("select", data.id)
+          this.areaName = data.name
+          this.fullArea = data.fullArea
+        })
+        let {value, all, valueLevel, selectRoot, areaId} = this.$props
+        let url = qs.stringifyUrl({
+          url: "/components/pages/selectArea", query: {...this.$attrs, value, all, valueLevel, selectRoot, areaId}
+        })
+        uni.navigateTo({url})
       }
     },
     getAreaName(area, name) {
       name ? this.areaName = name : this.getFullArea(area).then(list => {
         let arr = JSON.parse(JSON.stringify(list))
-        console.log(arr)
         this.areaName = arr?.reverse()?.[0]?.name
       })
-      let fullName = this.fullArea.map(e => e.name).join("")
-      if (this.selected.type == 5) {
-        fullName = fullName + name
-      }
-      this.$emit('update:fullName', fullName)
     },
-    closePopup() {
-      this.$refs.areaSelector?.handleSelect()
-    }
   }
 }
 </script>
 
 <style lang="scss" scoped>
 .AiAreaPicker {
-  ::v-deep .areaSelector {
+
+  .areaBtn {
     display: flex;
     align-items: center;
-
-    span {
-      cursor: pointer;
-      color: #333;
-      font-weight: bold;
-      line-height: 112px;
-      margin-right: 72px;
-      position: relative;
-
-      &:last-of-type {
-        margin-right: 0;
-
-        &:after {
-          content: " ";
-          display: block;
-          position: absolute;
-          bottom: -26px;
-          left: 50%;
-          transform: translate(-50%, 100%);
-          width: 40px;
-          height: 8px;
-          background: #4181FF;
-          border-radius: 4px;
-        }
-      }
-    }
-
-    b {
-      display: block;
-      width: 100%;
-      line-height: 96px;
-      text-align: center;
-    }
-
-    em {
-      font-style: normal;
-      font-size: 24px;
-      font-weight: 400;
-      color: #999999;
-      line-height: 34px;
-    }
-
-    .selectedArea {
-      display: flex;
-      align-items: center;
-      width: fit-content;
-      max-width: calc(100vw - 128px);
-      overflow: hidden;
-      text-overflow: ellipsis;
-      padding: 0 32px;
-      height: 80px;
-      background: #ECF2FF;
-      border-radius: 40px;
-      font-size: 32px;
-      font-family: PingFangSC-Medium, PingFang SC;
-      font-weight: 500;
-      color: #4181FF !important;
-      margin: 16px 0 32px;
-      white-space: nowrap;
-    }
-
-    .fixedTop {
-      // position: fixed;
-      top: 0;
-      width: 100%;
-      left: 0;
-      background: #fff;
-      border-bottom: 4px solid #f5f5f5;
-      z-index: 1;
-      text-align: start;
-      padding: 0 32px;
-      box-sizing: border-box;
-    }
-  }
-
-  ::v-deep.u-drawer-content {
-
-    .areaSelector {
-      box-sizing: border-box;
-      // border-bottom: 1px solid #f5f5f5;
-    }
-  }
-
-  ::v-deep .pendingList {
-    height: 500px;
-    overflow-y: auto;
-    padding: 0 32px 120px;
-    box-sizing: border-box;
-
-    .pendingItem {
-      color: #333;
-      height: 84px;
-      text-align: start;
-
-      .self {
-        font-weight: bold;
-      }
-    }
-  }
-
-  ::v-deep.bottomBtns {
-    position: fixed;
-    left: 0;
-    bottom: 0;
-    width: 100vw;
-    display: flex;
-    align-items: center;
-    text-align: center;
-    height: 120px;
-    font-size: 34px;
-    font-family: PingFangSC-Medium, PingFang SC;
-    font-weight: 500;
-    color: #3671EE;
-    background: #fff;
-    padding: 0 32px;
-    box-sizing: border-box;
-
-    & > div {
-      padding: 0 92px;
-      line-height: 88px;
-      height: 88px;
-      border: 1px solid #A0C0FF;
-      border-radius: 16px;
-
-      &.primary {
-        color: #fff;
-        background: #4181FF;
-        border-color: #4181FF;
-      }
-
-      & + div {
-        margin-left: 32px;
-      }
-    }
   }
 
   .location {
diff --git a/src/components/AiMore.vue b/src/components/AiMore.vue
index 6f819560..52298fd4 100644
--- a/src/components/AiMore.vue
+++ b/src/components/AiMore.vue
@@ -1,6 +1,7 @@
 <template>
   <section class="AiMore">
-    <u-icon name="arrow-right" color="#ddd" :label="value||placeholder" label-pos="left" :label-color="labelColor" label-size="32"/>
+    <u-icon :name="icon" color="#ddd" :label="value||placeholder" label-pos="left" :label-color="labelColor"
+            label-size="32"/>
   </section>
 </template>
 
@@ -13,7 +14,8 @@ export default {
   },
   props: {
     placeholder: {default: "请选择"},
-    value: String
+    value: String,
+    icon: {default: "arrow-right"}
   },
   computed: {
     isEmpty() {
diff --git a/src/components/pages/selectArea.vue b/src/components/pages/selectArea.vue
new file mode 100644
index 00000000..dc0fd05a
--- /dev/null
+++ b/src/components/pages/selectArea.vue
@@ -0,0 +1,344 @@
+<template>
+  <section class="selectArea">
+    <div class="areaSelector">
+      <div class="fixedTop">
+        <b>选择地区</b>
+        <em>选择区域</em>
+        <div class="selectedArea">
+          <p v-if="hasSelected" v-text="fullArea.map(e=>e.name).join('')"/>
+          <p v-else>请选择</p>
+        </div>
+        <div/>
+        <span v-if="all" v-text="`省`" @click="selectNode({}, -1)"/>
+        <span v-for="(area,i) in fullArea.filter(e=>e.type<valueLevel)" :key="area.id"
+              v-text="area.levelLabel" @click="selectNode(area, i)"/>
+      </div>
+    </div>
+    <scroll-view class="fill pendingList" scroll-y>
+      <div class="pendingItem flexRow" flex v-for="op in pending" :key="op.id" @tap.stop="getChild(op)">
+        <div class="fill" :class="{ self: index == op.id }" v-html="op.name"/>
+        <u-icon v-if="index == op.id" name="checkbox-mark" color="#4181FF"/>
+      </div>
+      <AiEmpty v-if="pending.length==0" description="无下级地区数据"/>
+    </scroll-view>
+    <div class="bottomBtns">
+      <div @click.stop="back">取消</div>
+      <div class="primary fill" @click.stop="handleSelect">确定</div>
+    </div>
+  </section>
+</template>
+
+<script>
+import {mapState} from "vuex";
+import AiEmpty from "../AiEmpty";
+
+export default {
+  name: "selectArea",
+  components: {AiEmpty},
+  appName: "选择地区",
+  computed: {
+    ...mapState(['user']),
+    dataRange() {
+      if (this.all || this.disabled) return 0
+      return this.getAreaType(this.root)
+    },
+    root() {
+      return this.areaId || this.user.areaId || this.$areaId
+    },
+    pending() {
+      return this.list?.map(e => ({...e, levelLabel: this.levelLabels[e.type]})) || []
+    },
+    hasSelected() {
+      return this.fullArea?.length > 0
+    },
+    hasLastLevelValue() {
+      return this.fullArea.some(e => e.type >= this.valueLevel)
+    }
+  },
+  data() {
+    Object.keys(this.$route.query).map(k => this.$route.query[k] = this.$route.query[k] == "false" ? false : this.$route.query[k])
+    return {
+      ...this.$route.query,
+      fullArea: [],
+      index: '',
+      list: [],
+      levelLabels: ["省", "市", "县/区", "镇/街道", "村/社区"],
+      selected: {},
+    }
+  },
+  watch: {
+    root(v) {
+      v && (this.getFullArea(v))
+    }
+  },
+  methods: {
+    getInfo(areaId) {
+      return areaId && this.$http.post('/admin/area/getAllParentAreaId', null, {
+        withoutToken: true,
+        params: {areaId},
+      }).then(res => {
+        if (res?.data) {
+          res.data.forEach((e) => {
+            e && (e.levelLabel = this.levelLabels[e.type])
+          })
+          return res.data.reverse()
+        }
+      })
+    },
+    getFullArea(areaId) {
+      return this.fullArea?.length > 0 ? Promise.resolve(this.fullArea) : this.getInfo(areaId).then(meta => {
+        if (meta.length > 1) {
+          this.fullArea = meta.slice(this.dataRange)
+        } else {
+          this.fullArea = meta
+        }
+        return this.fullArea
+      })
+    },
+    getChildAreas(id) {
+      id && this.$http.post('/admin/area/queryAreaByParentId', null, {
+        withoutToken: true,
+        params: {id},
+      }).then((res) => {
+        if (res?.data) {
+          this.list = res.data
+          if (this.selectRoot) {
+            if (this.hasLastLevelValue) {
+              let parent = JSON.parse(JSON.stringify(this.fullArea?.slice(-2)?.[0]))
+              this.list.unshift(parent)
+            } else {
+              let parent = JSON.parse(JSON.stringify(this.fullArea?.slice(-1)?.[0]))
+              this.list.unshift(parent)
+            }
+          }
+        }
+      })
+    },
+    getProvinces() {
+      this.$http.post('/admin/area/queryProvinceList', null, {withoutToken: true}).then((res) => {
+        if (res?.data) {
+          this.list = res.data
+        }
+      })
+    },
+    handleSelect() {
+      let {selected, fullArea} = this
+      uni.$emit("selectArea", {...selected, fullArea})
+      this.back()
+    },
+    getChild(op) {
+      if (op.id != this.index) {
+        this.selected = op
+        this.index = op.id
+        if (op.type == this.valueLevel) {
+          if (this.hasLastLevelValue) {
+            this.fullArea.splice(this.fullArea.length - 1, 1, op)
+          } else this.fullArea.push(op)
+        } else if (op.type < this.valueLevel) {
+          if (this.hasLastLevelValue) {
+            this.fullArea.splice(this.fullArea.length - 1, 1)
+          } else {
+            this.fullArea.push(op)
+            this.getChildAreas(op.id)
+          }
+        }
+      }
+    },
+    selectNode(area, i) {
+      let deleteCount = this.fullArea.length - i
+      if (deleteCount > 0) {
+        this.fullArea.splice(i + 1, deleteCount)
+      }
+      if (this.all && !area.id) {
+        this.index = ''
+        this.getProvinces()
+      } else {
+        this.index = area.id
+        this.getChildAreas(area.id)
+      }
+    },
+    handleInit() {
+      //初始化
+      this.index = this.value || this.root
+      if (!this.disabled) {
+        if (this.value) {
+          this.getFullArea(this.value).then(() => {
+            let area = this.fullArea.find(e => e.id == this.value) || {}
+            //当前选择列表必须是可选范围内的值
+            let top = area.type == this.valueLevel ? area.parentId : area.id
+            if (this.getAreaType(top) >= this.dataRange) {
+              this.getChildAreas(top)
+            }
+          })
+        } else if (this.all) {
+          this.getProvinces()
+        } else {
+          this.getFullArea(this.root).then(() => {
+            this.getChildAreas(this.root)
+          })
+        }
+      }
+    },
+    back() {
+      uni.navigateBack({})
+    },
+    getAreaType(area) {
+      let rules = [10, 8, 6, 3, 0], level = 0
+      if (area) {
+        rules.some((e, i) => {
+          let reg = new RegExp(`0{${e}}`, 'g')
+          if (reg.test(area)) {
+            return (level = i)
+          }
+        })
+      }
+      return level
+    }
+  },
+  created() {
+    this.handleInit()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.selectArea {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  background: #fff;
+
+  ::v-deep .areaSelector {
+    display: flex;
+    align-items: center;
+
+    span {
+      cursor: pointer;
+      color: #333;
+      font-weight: bold;
+      line-height: 112px;
+      margin-right: 72px;
+      position: relative;
+
+      &:last-of-type {
+        margin-right: 0;
+
+        &:after {
+          content: " ";
+          display: block;
+          position: absolute;
+          bottom: -26px;
+          left: 50%;
+          transform: translate(-50%, 100%);
+          width: 40px;
+          height: 8px;
+          background: #4181FF;
+          border-radius: 4px;
+        }
+      }
+    }
+
+    b {
+      display: block;
+      width: 100%;
+      line-height: 96px;
+      text-align: center;
+    }
+
+    em {
+      font-style: normal;
+      font-size: 24px;
+      font-weight: 400;
+      color: #999999;
+      line-height: 34px;
+    }
+
+    .selectedArea {
+      display: flex;
+      align-items: center;
+      width: fit-content;
+      max-width: calc(100vw - 128px);
+      padding: 0 32px;
+      height: 80px;
+      background: #ECF2FF;
+      border-radius: 40px;
+      font-size: 32px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #4181FF !important;
+      margin: 16px 0 32px;
+      white-space: nowrap;
+
+      & > p {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        direction: rtl;
+      }
+    }
+
+    .fixedTop {
+      top: 0;
+      width: 100vw;
+      left: 0;
+      background: #fff;
+      border-bottom: 4px solid #f5f5f5;
+      z-index: 1;
+      text-align: start;
+      padding: 0 32px;
+      box-sizing: border-box;
+    }
+  }
+
+  ::v-deep .pendingList {
+    padding: 0 32px;
+    box-sizing: border-box;
+
+    .emptyWrap {
+      width: 100%;
+    }
+
+    .pendingItem {
+      color: #333;
+      height: 84px;
+      text-align: start;
+
+      .self {
+        font-weight: bold;
+      }
+    }
+  }
+
+  ::v-deep.bottomBtns {
+    width: 100vw;
+    display: flex;
+    align-items: center;
+    text-align: center;
+    height: 120px;
+    font-size: 34px;
+    font-family: PingFangSC-Medium, PingFang SC;
+    font-weight: 500;
+    color: #3671EE;
+    background: #fff;
+    padding: 0 32px;
+    box-sizing: border-box;
+
+    & > div {
+      padding: 0 92px;
+      line-height: 88px;
+      height: 88px;
+      border: 1px solid #A0C0FF;
+      border-radius: 16px;
+
+      &.primary {
+        color: #fff;
+        background: #4181FF;
+        border-color: #4181FF;
+      }
+
+      & + div {
+        margin-left: 32px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/project/shandong10086/AppIntelligentSecurity/AppIntelligentSecurity.vue b/src/project/shandong10086/AppIntelligentSecurity/AppIntelligentSecurity.vue
index e29b11a9..ddd48928 100644
--- a/src/project/shandong10086/AppIntelligentSecurity/AppIntelligentSecurity.vue
+++ b/src/project/shandong10086/AppIntelligentSecurity/AppIntelligentSecurity.vue
@@ -170,10 +170,12 @@ export default {
       option && this.Echart.setOption(option)
     },
   },
-  onShow() {
-    document.title = '智慧安防'
+  created() {
     this.areaId = this.user.areaId
     this.areaName = this.user.areaName
+  },
+  onShow() {
+    document.title = '智慧安防'
     this.getList()
   },
   mounted() {
diff --git a/src/saas/AppAskForm/AddForm.vue b/src/saas/AppAskForm/AddForm.vue
index 9f13ef53..5fdea15d 100644
--- a/src/saas/AppAskForm/AddForm.vue
+++ b/src/saas/AppAskForm/AddForm.vue
@@ -197,7 +197,7 @@ export default {
     })
   },
 
-  onShow () {
+  onShow() {
     document.title = !this.id ? '新建表单' : '编辑表单'
   },
   methods: {
diff --git a/src/saas/AppConflictMediation/PercentageDetail.vue b/src/saas/AppConflictMediation/PercentageDetail.vue
index dfd5e63d..f7e76dbc 100644
--- a/src/saas/AppConflictMediation/PercentageDetail.vue
+++ b/src/saas/AppConflictMediation/PercentageDetail.vue
@@ -61,10 +61,6 @@ export default {
       ]
     }
   },
-  onLoad() {
-    
-  },
-  onShow() {},
   methods: {
     getList() {
       this.$http