selectType

src/apps/AppWalkask/add.vue

@@ -5,18 +5,18 @@
         <u-form :model="forms" ref="uForm" label-width="auto">
           <u-form-item label="区域选择" prop="areaId" class="areaIds" style="position: relative">
             <AiAreaPicker v-model="forms.areaId" :areaId="areaIdProps" @select="areaSelect" style="color: #333"></AiAreaPicker>
-            <u-icon name="arrow-right" color="rgb(192, 196, 204)" size="30" style="margin-left:4px;" />
+            <u-icon name="arrow-right" color="rgb(192, 196, 204)" size="30" style="margin-left: 4px" />
           </u-form-item>
 
           <div class="line"></div>
 
-          <u-form-item label="走访对象" prop="create_user_name" required :right-icon=" id ? '' : 'arrow-right'" class="create_user_names">
+          <u-form-item label="走访对象" prop="create_user_name" required :right-icon="id ? '' : 'arrow-right'" class="create_user_names">
             <u-input v-model="forms.create_user_name" disabled placeholder="请选择走访对象" @click="toWalkObject" />
           </u-form-item>
 
           <div class="line"></div>
 
-          <u-form-item label="现实状态" prop="reality" :right-icon=" id ? '' : 'arrow-right'" class="realitys">
+          <u-form-item label="现实状态" prop="reality" :right-icon="id ? '' : 'arrow-right'" class="realitys">
             <u-input v-model="forms.reality" disabled placeholder="请选择现实状态" @click="realityClick" />
 
             <u-select v-model="showStstus" :list="$dict.getDict('realityStatus')" value-name="dictValue" label-name="dictName" @confirm="realityStstus"></u-select>
@@ -47,18 +47,19 @@
       <div class="btn" @click="submit">保存</div>
     </div>
 
-    <component v-else :is="comp" @back="backlist"></component>
+    <!-- <component v-else :is="comp" @back="backlist"></component> -->
   </div>
 </template>
 
 <script>
 import { mapState } from 'vuex'
-import walkObject from './walkObject'
+// import walkObject from './walkObject'
 
 export default {
   name: 'add',
   components: {
-    walkObject,
+    // walkObject,
+    // selectType,
   },
   props: {},
   data() {
@@ -89,7 +90,7 @@ export default {
   onLoad(o) {
     this.id = o.id
     this.areaIdProps = this.user.areaId
-    if(!this.id) {
+    if (!this.id) {
       this.forms.areaId = this.user.areaId
       this.areaName = this.user.areaName
     }
@@ -103,7 +104,7 @@ export default {
   mounted() {},
   methods: {
     realityClick() {
-      if(this.id) return 
+      if (this.id) return
       if (!this.forms.create_user_name) {
         return this.$u.toast('请选择走访对象')
       }
@@ -195,10 +196,11 @@ export default {
     },
 
     toWalkObject() {
-      if(this.id) return
+      if (this.id) return
-      this.addList = false
+      // this.addList = false
-      this.comp = 'walkObject'
+      // this.comp = 'selectType'
-      this.paramss = 111
+      // this.paramss = 111
+      uni.navigateTo({ url: `./selectType` })
     },
   },
 }

src/apps/AppWalkask/selectType.vue

@@ -0,0 +1,217 @@
+<template>
+  <div class="selectType">
+    <div class="header-top">
+      <u-search v-model="keyword" placeholder="请输入姓名" :show-action="false" bg-color="#F5F5F5" search-icon-color="#CCCCCC" placeholder-color="#999999" @search="handerSearch" @clear="handerClear"></u-search>
+    </div>
+
+    <div class="header-middle">
+      <div class="hint">
+        <span :style="{ color: applicationName ? '#3F8DF5' : '' }" @click="back">可选范围</span>
+        <span> {{ applicationName ? ' / ' + applicationName : '' }}</span>
+      </div>
+
+      <div class="showTypes" v-if="showType">
+        <div class="empty-div"></div>
+
+        <div v-if="typeList.length > 0">
+          <div class="cards" v-for="(item, i) in typeList" :key="i" @click="toUserSelect(item)">
+            <img src="./img/user-img.png" alt="" />
+
+            <div class="right">
+              <div class="applicationNames">{{ item.applicationName }}</div>
+
+              <img src="./img/2.png" alt="" class="imgs" />
+            </div>
+          </div>
+        </div>
+
+        <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
+      </div>
+
+      <div class="showUsers" v-else>
+        <div v-if="userList.length > 0">
+          <div class="cards" v-for="(e, index) in userList" :key="index">
+            <img src="./img/user-img.png" alt="" />
+
+            <div class="right">
+              <div class="applicationNames">{{ e.create_user_name }}</div>
+
+              <!-- <img src="./img/2.png" alt="" class="imgs" /> -->
+            </div>
+          </div>
+        </div>
+
+        <AiEmpty description="暂无数据" class="emptyWrap" v-else></AiEmpty>
+      </div>
+    </div>
+
+    <!-- <AiBck /> -->
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'selectType',
+  components: {},
+  props: {},
+  data() {
+    return {
+      typeList: [],
+      userList: [],
+      keyword: '',
+      current: 1,
+      showType: true,
+      applicationName: '',
+    }
+  },
+  computed: {},
+  watch: {},
+  onLoad() {
+    this.getTypeList()
+  },
+  onShow() {},
+  methods: {
+    getTypeList() {
+      this.userList = []
+      this.$http.post(`/app/appapplicationinfo/queryApplicationListByType?type=0&status=1`).then((res) => {
+        if (res.code == 0) {
+          this.typeList = res.data
+        }
+      })
+    },
+
+    getUser(data) {
+      this.$http.post(`/app/appapplicationinfo/list?appId=${data.id}&current=${this.current}&size=${999}`, { searchParam: this.keyword }).then((res) => {
+        if (res.code == 0) {
+          this.userList = res.data.records
+        }
+      })
+    },
+
+    toUserSelect(item) {
+      console.log(item)
+      this.applicationName = item.applicationName
+      this.showType = false
+      this.getUser(item)
+    },
+
+    back() {
+      this.keyword = ''
+      this.typeList = []
+      this.userList = []
+      this.applicationName = ''
+      this.showType = true
+      this.getTypeList()
+    },
+
+    handerSearch(e) {
+      if (this.showType) {
+        this.keyword = e
+        this.current = 1
+        this.getUser()
+      }
+    },
+
+    handerClear() {
+      this.keyword = ''
+      this.current = 1
+      this.getUser()
+    },
+  },
+}
+</script>
+
+<style scoped lang="scss">
+.selectType {
+  height: 100%;
+  background: #fff;
+  .header-top {
+    background: #fff;
+    padding: 20px 32px;
+  }
+
+  .header-middle {
+    .hint {
+      padding: 0 20px 0 32px;
+      height: 112px;
+      line-height: 112px;
+      box-shadow: 0px 1px 0px 0px #e4e5e6;
+      font-size: 30px;
+      font-weight: 500;
+    }
+
+    .showTypes {
+      .empty-div {
+        height: 16px;
+        background: #f5f5f5;
+      }
+
+      .cards {
+        display: flex;
+        align-items: center;
+        height: 120px;
+        line-height: 120px;
+        // background: pink;
+        padding: 0 20px 0 32px;
+
+        img {
+          width: 74px;
+          height: 74px;
+          border-radius: 8px;
+        }
+        .right {
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          margin-left: 32px;
+          border-bottom: 1px solid #e4e5e6;
+          .applicationNames {
+            font-size: 36px;
+            font-weight: 500;
+            color: #333333;
+          }
+          .imgs {
+            width: 40px;
+            height: 40px;
+          }
+        }
+      }
+    }
+
+    .showUsers {
+      .cards {
+        display: flex;
+        align-items: center;
+        height: 120px;
+        line-height: 120px;
+        // background: pink;
+        padding: 0 20px 0 32px;
+
+        img {
+          width: 74px;
+          height: 74px;
+          border-radius: 8px;
+        }
+        .right {
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          margin-left: 32px;
+          border-bottom: 1px solid #e4e5e6;
+          .applicationNames {
+            font-size: 36px;
+            font-weight: 500;
+            color: #333333;
+          }
+          .imgs {
+            width: 40px;
+            height: 40px;
+          }
+        }
+      }
+    }
+  }
+}
+</style>

src/apps/AppWalkask/walkObject.vue

@@ -2,24 +2,28 @@
   <div class="detail">
     <div>
       <div class="item-content" v-for="(item, index) in userList" :key="index">
-        <div class="title" @click="showUserType(index)">
+        <div class="title" @click="showUserType(item, index)">
           <h2>{{ item.label }}</h2>
           <img src="./img/down-icon.png" alt="" :class="item.check ? 'img-active' : ''" />
         </div>
         <div class="user-list" v-if="item.check">
-          <div class="user-item" v-for="(e, indexs) in item.value" :key="indexs" v-if="item.value && item.value.length">
+          <div v-if="statisticsList.length > 0">
+            <div class="user-item" v-for="(e, indexs) in statisticsList" :key="indexs">
+              <!-- v-if="item.value && item.value.length" -->
               <div class="user-img">
                 <img src="./img/user-img.png" alt="" />
               </div>
               <div class="user-info">
                 <p class="name">{{ e.name }}</p>
-              <div class="phone">
+                <!-- <div class="phone">
                 <span>{{ idNumberInit(e.idNumber) }}</span>
                 <span>{{ e.phone }}</span>
+              </div> -->
               </div>
             </div>
           </div>
-          <p class="text" v-if="!item.value.length">{{ '暂无' + item.label + '信息' }}</p>
+
+          <p class="text" v-else>{{ '暂无' + item.label + '信息' }}</p>
         </div>
       </div>
 
@@ -112,10 +116,10 @@ export default {
       //   },
       // ],
       // nameList: [],
-      // current: 1,
+      current: 1,
-      // appId: '',
+      appId: '',
       // value: '',
-      // menuLevel3Name: '',
+      menuLevel3Name: '',
       // num: 1,
       // flag: false,
     }
@@ -124,15 +128,10 @@ export default {
   computed: {
     ...mapState(['user']),
   },
-  // created() {
+
-  //   console.log(1)
-  //   this.getDiyList()
-  // },
   created() {
-    this.getStatistic()
     this.getUserList()
     uni.$on('specialPeopleList', () => {
-      this.getStatistic()
       this.getUserList()
     })
   },
@@ -149,29 +148,33 @@ export default {
       })
     },
 
-    getStatistic() {
+    getStatistic(item) {
-      this.statisticsList = []
+      // this.statisticsList = []
-      this.$http.post(`/app/appapplicationinfo/specialStatistic?type=0&range=0`).then((res) => {
+      this.menuLevel3Name = item.value.menuLevel3Name
+      this.appId = item.value.id
+      this.$http.post(`/app/appapplicationinfo/list?appId=${item.value.id}&current=${this.current}&size=${999}`).then((res) => {
         if (res.code == 0) {
-          for (let i in res.data) {
+          this.statisticsList = res.data.records
-            var obj = {
+
-              label: i,
+          // for (let i in res.data) {
-              value: res.data[i],
+          //   var obj = {
-            }
+          //     label: i,
-            this.statisticsList.push(obj)
+          //     value: res.data[i],
-          }
+          //   }
+          //   this.statisticsList.push(obj)
+          // }
         }
       })
     },
 
     getUserList() {
       this.userList = []
-      this.$http.post(`/app/appapplicationinfo/queryApplicationListByType?type=0`).then((res) => {
+      this.$http.post(`/app/appapplicationinfo/queryApplicationListByType?type=0&status=1`).then((res) => {
         if (res.code == 0) {
-          console.log(res.data);
           for (let i in res.data) {
             var obj = {
-              label: i,
+              // label: i,
+              label: res.data[i].applicationName,
               value: res.data[i],
               check: false,
             }
@@ -190,16 +193,24 @@ export default {
       return idNumber
     },
 
-    showUserType(index) {
+    showUserType(item, index) {
+      this.getStatistic(item)
       if (this.userList[index].check) {
         this.userList[index].check = false
+        console.log(1)
+        this.statisticsList = []
       } else {
         this.userList.map((item) => {
           item.check = false
+          this.statisticsList = []
         })
         this.userList[index].check = true
       }
     },
+
+    radioGroupChange(e) {
+      console.log(e)
+    },
   },
 
   // methods: {
@@ -207,11 +218,11 @@ export default {
   //     this.num = this.num + 1
   //     this.$forceUpdate()
   //     if (this.num % 2 == 0) {
-  //       console.log('偶数')
+  //
   //       this.flag == true
   //       this.$forceUpdate()
   //     } else {
-  //       console.log('奇数')
+  //
   //       this.flag == false
   //       this.$forceUpdate()
   //     }
@@ -229,7 +240,7 @@ export default {
   //   this.userList = []
   //   this.menuLevel3Name = item.menuLevel3Name
   //   this.appId = item.id
-  //     this.$http.post(`/app/appapplicationinfo/list?appId=${item.id}&current=${this.current}&size=${99}`, { searchParam: this.keyword }).then((res) => {
+  //   this.$http.post(`/app/appapplicationinfo/list?appId=${'2677c070764f4779920c1a2923a8afb0'}&current=${this.current}&size=${99}`, { searchParam: this.keyword }).then((res) => {
   //     if (res.code == 0) {
   //       this.userList = res.data.records
   //     }
@@ -357,6 +368,7 @@ export default {
       .user-item {
         padding: 24px 32px;
         display: flex;
+        align-items: center;
         .user-img {
           width: 112px;
           img {