From 2551827d9908acd834db422ee0d223ae13a3b00d Mon Sep 17 00:00:00 2001
From: shijingjing <1789544664@qq.com>
Date: Fri, 2 Sep 2022 10:59:05 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8D=8F=E5=90=8C=E5=AE=A3=E5=8F=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../addPropaganda.vue                         | 104 +++---
 .../AppCooperationPropaganda/scopedSelect.vue |   4 +-
 .../selectGridMember.vue                      | 306 ++++++++++++++++++
 3 files changed, 375 insertions(+), 39 deletions(-)
 create mode 100644 src/project/saas/AppCooperationPropaganda/selectGridMember.vue

diff --git a/src/project/saas/AppCooperationPropaganda/addPropaganda.vue b/src/project/saas/AppCooperationPropaganda/addPropaganda.vue
index cc8f6d7a..f0f10268 100644
--- a/src/project/saas/AppCooperationPropaganda/addPropaganda.vue
+++ b/src/project/saas/AppCooperationPropaganda/addPropaganda.vue
@@ -2,7 +2,7 @@
   <div class="addPropaganda">
     <div class="task_name">
       <div><span class="color_red">*</span><span class="title">任务名称</span></div>
-      <u-input v-model="value" type="text" placeholder="请输入" maxlength="15" class="inpt"/>
+      <u-input v-model="form.taskTitle" type="text" placeholder="请输入" maxlength="15" class="inpt"/>
     </div>
 
     <div class="send_scope">
@@ -18,13 +18,13 @@
         <div style="color: #3399FF;" @click="preview">预览</div>
       </div>
       <div class="content_text">
-        <u-input v-model="value" type="textarea" height="372" :auto-height="true" placeholder="请输入政策、活动、节日问候等内容" />
+        <u-input v-model="content" type="textarea" height="372" :auto-height="true" placeholder="请输入政策、活动、节日问候等内容" />
       </div>
       <div class="content_fodder">
         <!-- <div style="color: #8E8F91;">添加素材</div> -->
         <div class="fodder_alls">
           <!-- <div class="fodder_add"><u-icon name="plus" color="#CCD0D3" size="32"></u-icon></div> -->
-          <AiUploader v-model="form.files" placeholder="添加素材" type="file" :limit="9" multiple action="/admin/file/add2"></AiUploader>
+          <AiUploader :def.sync="files" placeholder="添加素材" type="file" :limit="9" multiple action="/admin/file/add2"></AiUploader>
         </div>
       </div>
     </div>
@@ -32,55 +32,55 @@
     <div class="isExamine">
       <div class="examineChange">
         <div>宣发需要审批</div>
-        <u-switch v-model="checked" size="40" @change="checked = !!checked"></u-switch>
+        <u-switch v-model="enableExamine" size="40" @change="enableExamine = !!enableExamine"></u-switch>
       </div>
-      <div class="examine_person" v-if="checked == true" @click="getDeptUser">
+      <div class="examine_person" v-if="enableExamine == true" @click="getDeptUser">
         <div><span class="color_red">*</span><span class="title">审批人</span></div>
         <div>
-          <span v-if="userList.length">请选择人员</span><span><u-icon name="arrow-right" color="#CCD0D3"></u-icon></span>
-          <div v-if="!userList.length">
+          <span v-if="!userList.length">请选择人员 <u-icon name="arrow-right" color="#CCD0D3"/></span>
+          <div v-if="userList.length">
             <AiOpenData type="departmentName" :openid="departmentId"/>
           </div>
         </div>
       </div>
+      <div class="examineChange">
+        <div>定时发送</div>
+        <u-switch v-model="isTimedTask" size="40" @change="isTimedTask = !!isTimedTask"></u-switch>
+      </div>
+      <div class="examine_person" v-if="isTimedTask == true" @click="getDeptUser">
+        <div><span class="color_red">*</span><span class="title">发送时间</span></div>
+        <div @click="showTaskTime = true">
+          <span style="color: '#CCD0D3'" v-if="!form.choiceTime.length">请选择</span>
+          <span v-if="form.choiceTime.length">{{ form.choiceTime }}</span>
+          <u-icon name="arrow-right" color="#CCD0D3"/>
+        </div>
+      </div>
     </div>
 
+    <u-picker v-model="showTaskTime" :params="params" mode="time" @confirm="choiceTime"></u-picker>
+
     <div class="mask" v-show="showPopup" @tap="showPopup = false">
       <div class="noticeModal" @tap.stop>
         <div class="body">
 
-          <div class="text_content">
+          <div class="text_content" v-if="content.length">
             <img class="text_left" src="https://cdn.cunwuyun.cn/dvcp/announce/avatar.png" />
-            <div class="text_right">
-              居民每个月最多接收来自同一企业管理员的4条群发消息，咨询电话：
-            </div>
+            <div class="text_right">{{ content }}</div>
           </div>
         
-          <div class="file_content">
+          <div class="file_content" v-for="item in files" :key="item.id">
             <img class="text_left" src="https://cdn.cunwuyun.cn/dvcp/announce/avatar.png" />
-            <div class="text_right file_right">
+            <img :src="item.url" alt="" v-if="getExtension(item.name) == '.jpg' || getExtension(item.name) == '.jepg'">
+            <div class="text_right file_right" v-else>
               <div class="cont_left">
-                <h4>企微协同宣发测cs试测试pptx</h4>
-                <p>847k</p>
+                <h4>{{ item.name }}</h4>
+                <p>{{ item.fileSizeStr }}</p>
               </div>
               <div class="cont_right">
-                <!-- zip rar -->
-                <!-- <img src="https://cdn.cunwuyun.cn/dvcp/announce/zip.png" alt=""> -->
-                <!-- doc docx -->
-                <!-- <img src="https://cdn.cunwuyun.cn/dvcp/announce/world.png" alt=""> -->
-                <!-- xls xlsx -->
-                <!-- <img src="https://cdn.cunwuyun.cn/dvcp/announce/xls.png" alt=""> -->
-                <!-- txt -->
-                <!-- <img src="https://cdn.cunwuyun.cn/dvcp/announce/txt.png" alt=""> -->
-                <!-- pdf -->
-                <!-- <img src="https://cdn.cunwuyun.cn/dvcp/announce/pdf.png" alt=""> -->
-                <!-- .ppt', '.pptx' -->
-                <!-- <img src="https://cdn.cunwuyun.cn/dvcp/announce/ppt.png" alt=""> -->
-
-                <!-- <img :src="fileIcon(item.name)" alt=""> -->
+                <img :src="fileIcon(item.name)" alt="">
               </div>
             </div>
-            <!-- <img src="https://cdn.cunwuyun.cn/dvcp/announce/ppt.png" alt=""> -->
+            
           </div>
 
         </div>
@@ -91,7 +91,7 @@
     </div>
 
     <div class="btn">
-      <div class="submitBtn">发送</div>
+      <div class="submitBtn" @click="confirm">发送</div>
     </div>
 
   </div>
@@ -104,13 +104,32 @@ export default {
   data() {
     return {
       type: '',
-      value: '',
-      checked: false,
-      form: { 
-        files: []
+      form: {
+        taskTitle: '',
+        wxGroups: [], // 发送范围
+        contents: [], // 发送内容
+        enableExamine: '0', // 是否需要审批  0否 1是
+        examines: [], // 审批人
+        choiceTime: '', // 定时发送时间
+        sendScope: '', // 0：全部居民群、1：按部门选择、2：按网格选择
+        sendType: '0', // 0：立即发送、1：定时发送
       },
+      enableExamine: false,
+      isTimedTask: false,
+      content: '',
+      files: [], 
+      showTaskTime: false,
       userList: [],
       showPopup: false,
+      params: {
+        year: true,
+        month: true,
+        day: true,
+        hour: true,
+        minute: true,
+        second: true,
+        timestamp: false,
+      }
     }
   },
   methods: {
@@ -124,7 +143,7 @@ export default {
     },
 
     fileIcon(name) {
-      if (['.zip', '.rar'].indexOf(this.getExtension(name)) !== -1) {
+      if (['.zip', '.rar','.mp4'].indexOf(this.getExtension(name)) !== -1) {
         return 'https://cdn.cunwuyun.cn/dvcp/announce/zip.png'
       }
 
@@ -153,6 +172,14 @@ export default {
       return name.substring(name.lastIndexOf('.'))
     },
 
+    choiceTime(e) {
+      this.form.choiceTime = e.year + '-' + e.month + '-' + e.day + ' ' + e.hour + ':' + e.minute + ':' + e.second
+    },
+
+    confirm() {
+
+    },
+
     getDeptUser() {
       this.selectEnterpriseContact({
         fromDepartmentId: 0,
@@ -240,11 +267,12 @@ export default {
       justify-content: space-between;
       padding: 26px 0px;
       box-sizing: border-box;
+      border-top: 2px solid #DDD;
     }
 
     .examine_person {
-      border-top: 2px solid #DDD;
-      padding: 26px 0 0 0;
+      
+      // padding: 26px 0 0 0;
     }
   }
   .color_red {
diff --git a/src/project/saas/AppCooperationPropaganda/scopedSelect.vue b/src/project/saas/AppCooperationPropaganda/scopedSelect.vue
index c6e7b519..d41c4a98 100644
--- a/src/project/saas/AppCooperationPropaganda/scopedSelect.vue
+++ b/src/project/saas/AppCooperationPropaganda/scopedSelect.vue
@@ -62,7 +62,9 @@ export default {
   },
   methods: {
     // 选人
-    selectUser() {},
+    selectUser() {
+      uni.navigateTo({url: `./selectGridMember`})
+    },
 
     toTagsList(e) {
       uni.navigateTo({url: `./tagsList?type=${e}`})
diff --git a/src/project/saas/AppCooperationPropaganda/selectGridMember.vue b/src/project/saas/AppCooperationPropaganda/selectGridMember.vue
new file mode 100644
index 00000000..b29b67b7
--- /dev/null
+++ b/src/project/saas/AppCooperationPropaganda/selectGridMember.vue
@@ -0,0 +1,306 @@
+<template>
+  <section class="selectGridMember">
+    <div class="header-middle">
+      <div class="hint">
+        <span v-for="(item, index) in selectGridPath" :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="cards" v-for="(item, index) in treeList" :key="item.id" @click="itemClick(item)">
+        <div class="imges">
+          <!-- <img src="./images/xzh.png" alt="" class="imgselect" v-if="item.isChecked"
+               @click.stop="girdClick(item, index)"/>
+          <img src="./images/xz.png" alt="" class="imgselect" v-else
+               @click.stop="girdClick(item, index)"/> -->
+          <img src="./images/gird--select-icon.png" alt="" class="avatras"/>
+        </div>
+        <div class="rightes">
+          <div class="applicationNames">{{ item.girdName }}</div>
+          <img src="./images/right-icon.png" alt="" class="imgs"/>
+        </div>
+      </div>
+      <div class="userCards" v-for="(e, index) in userList" :key="e.id">
+        <div class="imges">
+          <img src="./images/xzh.png" alt="" class="imgselect" v-if="e.isChecked" @click="userClick(e, index)"/>
+          <img src="./images/xz.png" alt="" class="imgselect" v-else @click="userClick(e, index)"/>
+          <img src="./images/tx@2x.png" alt="" class="avatras"/>
+        </div>
+        <div class="rights fill">
+          <div class="applicationNames">
+            <AiOpenData v-if="e.name" type="userName" :openid="e.name" style="display: block;"/>
+          </div>
+          <div class="idNumbers">{{ e.phone }}</div>
+        </div>
+      </div>
+      <AiEmpty description="暂无数据" v-if="!hasData"/>
+    </div>
+    <div class="subBtn" @click="submit">
+      <div>确定选择</div>
+    </div>
+
+  </section>
+</template>
+
+<script>
+export default {
+  name: "selectGridMember",
+  appName: "选择人员(网格成员)",
+  data() {
+    return {
+      selected: {},
+      allData: null,
+      treeList: [],
+      selectGridPath: [],
+      userList: [],
+    }
+  },
+  computed: {
+    hasData() {
+      return this.treeList?.length > 0 || this.userList?.length > 0
+    }
+  },
+  onLoad() {
+    this.selected.id = this.$route.query.id
+    this.getAllGrids()
+  },
+  onShow() {
+    document.title = '选择人员'
+  },
+  methods: {
+    getAllGrids() {
+      this.$http.post('/app/appgirdinfo/listByInfo').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.gridInit()
+        }
+      })
+    },
+    gridInit() {
+      this.treeList = this.allData.filter(e => !e.parentGirdId)
+      this.selectGridPath = [{girdName: "可选范围", id: ''}]
+    },
+    itemClick({id, girdName}) {
+      this.selectGridPath.push({girdName, id})
+      this.getGridsAndUsersByParent(id)
+    },
+
+    getGridsAndUsersByParent(id) {
+      this.treeList = this.allData.filter(e => e.parentGirdId == id)
+      this.userList = []
+      this.$http.post(`/app/appgirdmemberinfo/listByGirdIdByThree?girdId=${id}`).then((res) => {
+        if (res?.data) {
+          this.userList = res.data.map(e => ({...e, isChecked: e.id == this.selected.id}))
+        }
+      })
+    },
+    girdNameClick(row, index) {
+      this.userList = []
+      if (!index) { //第一级别
+        this.gridInit()
+      } else {
+        let length = this.selectGridPath.length - index
+        this.selectGridPath.splice(index, length)
+        this.getGridsAndUsersByParent(row.id)
+      }
+    },
+    // girdClick(row, index) {
+    //   if (this.treeList[index].isChecked) {
+    //     //取消
+    //     this.treeList[index].isChecked = false
+    //     this.selected = {}
+    //   } else {
+    //     this.treeList.map((item, i) => {
+    //       item.isChecked = index == i
+    //     })
+    //     this.selected = {...row, kind: "grid"}
+    //   }
+    //   this.$forceUpdate()
+    // },
+
+    userClick(row, index) {
+      if (this.userList[index].isChecked) {//取消
+        this.userList[index].isChecked = false
+        this.selected = {}
+      } else {
+        this.userList.map((item, i) => {
+          item.isChecked = index == i
+        })
+        this.selected = {...row, kind: "user"}
+      }
+      this.$forceUpdate()
+    },
+
+    submit() {
+      if (this.selected.id != null) {
+        uni.navigateBack({
+          success: () => {
+            uni.$emit("pagePicker:custom", this.selected)
+          }
+        })
+      } else {
+        return this.$u.toast('请选择网格或网格员')
+      }
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.selectGridMember {
+  height: 100%;
+  background: #fff;
+
+  .header-top {
+    background: #fff;
+    padding: 20px 32px;
+  }
+
+  .header-middle {
+    padding-bottom: 140px;
+
+    .hint {
+      padding: 28px 20px 28px 32px;
+      line-height: 56px;
+      box-shadow: 0 1px 0 0 #e4e5e6;
+      font-size: 30px;
+      font-weight: 500;
+      // word-break: break-all;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+    }
+
+    .empty-div {
+      height: 16px;
+      background: #f5f5f5;
+    }
+
+    .cards {
+      display: flex;
+      align-items: center;
+      height: 120px;
+      line-height: 120px;
+      padding: 0 0 0 32px;
+
+      .imges {
+        display: flex;
+        align-items: center;
+
+        .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% - 160px);
+        display: flex;
+        align-items: center;
+        margin-left: 32px;
+        border-bottom: 1px solid #e4e5e6;
+
+        .applicationNames {
+          flex: 1;
+          min-width: 0;
+          font-size: 36px;
+          font-weight: 500;
+          color: #333333;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+        }
+
+        .imgs {
+          width: 40px;
+          height: 40px;
+          margin-right: 20px;
+        }
+      }
+    }
+
+    .userCards {
+      display: flex;
+      align-items: center;
+      height: 120px;
+      line-height: 120px;
+      padding: 0 0 0 32px;
+
+      .imges {
+        display: flex;
+        align-items: center;
+
+        .imgselect {
+          width: 48px;
+          height: 48px;
+        }
+
+        .avatras {
+          width: 74px;
+          height: 74px;
+          border-radius: 8px;
+          margin-left: 36px;
+        }
+      }
+
+      .rights {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-left: 32px;
+        border-bottom: 1px solid #e4e5e6;
+        padding-right: 40px;
+        height: inherit;
+
+        .applicationNames {
+          font-size: 36px;
+          font-weight: 500;
+          color: #333333;
+          overflow: hidden;
+          white-space: nowrap;
+          text-overflow: ellipsis;
+        }
+
+        .idNumbers {
+          color: #666;
+        }
+      }
+    }
+  }
+
+  .subBtn {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 118px;
+    background: #f4f8fb;
+
+    div {
+      width: 192px;
+      height: 80px;
+      line-height: 80px;
+      text-align: center;
+      background: #1365dd;
+      border-radius: 4px;
+      font-size: 32px;
+      color: #fff;
+      margin: 20px 34px 0 0;
+      float: right;
+    }
+  }
+}
+</style>