From 20d48ec589e182b6f86795887babaa7d887c022b Mon Sep 17 00:00:00 2001
From: chenrui <1950717904@qq.com>
Date: Fri, 27 Sep 2024 16:35:07 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B0=91=E7=94=9F=E8=AF=89=E6=B1=82=E4=B8=BB?=
 =?UTF-8?q?=E4=BD=93=E6=90=9C=E7=B4=A2=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../enterprise/compaint/selectMssqFilter.vue  | 380 ++++++++++++++++++
 1 file changed, 380 insertions(+)
 create mode 100644 src/views/enterprise/compaint/selectMssqFilter.vue

diff --git a/src/views/enterprise/compaint/selectMssqFilter.vue b/src/views/enterprise/compaint/selectMssqFilter.vue
new file mode 100644
index 0000000..ba5c14e
--- /dev/null
+++ b/src/views/enterprise/compaint/selectMssqFilter.vue
@@ -0,0 +1,380 @@
+<template>
+  <div v-if="visible" class="van-overlay"></div>
+  <div v-if="visible" class="popup">
+      <div class="popup-title">部门查询</div>
+     <!-- 返回按钮 -->
+      <label class="btn-goback"><van-icon name="arrow-left" @click="next"/></label>
+      <!-- 关闭按钮 -->
+      <label class="close-button" @click="closePopup"></label>
+
+      <!-- 弹窗的内容 -->
+      <div class="popup-content">
+          <div class="subsearch">
+            <input class="searchbox" v-model="searchParam.complaintItemName" placeholder="请输入部门名称"/>
+            <van-icon class="ibtn-reset" name="clear" @click="cancel()" title="重置"/>
+            <button class='btn-search' @click="queryList()">搜索</button>
+            <button class='btn-search' @click="selectData()">确定</button>
+          </div>
+          <div class="search-result">
+              <van-checkbox-group v-model="checked">
+                  <van-cell-group inset>
+                      <!-- <van-cell v-for="(item, index) in dataList" :key="item"  @click="toDrill(item.deptId, item.parentId)" clickable>
+                          <div style="display: flex; justify-content: space-between;">
+                              <div style="width: 70%; text-align: left;">
+                                  {{item.deptName}}
+                              </div>
+                              <div style="width: 30%;"><van-icon name="arrow" size="0.35rem" /></div>
+                          </div>
+                      </van-cell> -->
+                      <van-cell v-for="(item, index) in dataList" :key="item">
+                          <div style="display: flex; justify-content: space-between;">
+                              <div @click="toggle(item.complaintItemCode)">
+                                  <van-checkbox :name="item.complaintItemCode+';-;'+item.complaintItemName" :ref="el => checkboxRefs[item.complaintItemCode] = el" @click.stop>
+                                      {{item.complaintItemName}}
+                                  </van-checkbox>
+                              </div>
+                              <div>
+                                <!-- <van-button 
+                                type="primary" 
+                                size="mini"
+                                icon="add-o"
+                                @click="toDrill(item.deptId, item.parentId)"
+                                >展开</van-button> -->
+                              </div>
+                          </div>
+                          
+                      </van-cell>
+                  </van-cell-group>
+
+                  <!-- <van-cell-group inset>
+                      <van-cell v-for="(item, index) in userList" :key="item" clickable>
+                          <div style="display: flex; justify-content: space-between;">
+                              <div style="width: 70%;" @click="toggle(item.deptId)">
+                                  <van-checkbox :name="item.userId+';-;'+item.userName+';-;'+item.deptId+';-;'+item.dept.deptName" :ref="el => checkboxRefs[item.userId] = el" @click.stop>
+                                      {{item.userName}}
+                                  </van-checkbox>
+                              </div>
+                          </div>
+                      </van-cell>
+                  </van-cell-group> -->
+              </van-checkbox-group>
+          </div>
+      </div>
+  </div>
+</template>
+
+<script>
+  import {ref} from 'vue'
+  import { queryComplaintItemList } from '@/api/enterprise'
+  import {Icon, showSuccessToast,showToast } from 'vant';
+
+  const {useCommon} = $globalStore
+  const router = useRouter();
+  export default {
+      props: {
+          visible: {
+              type: Boolean,
+              default: false
+          },
+          content: {
+              type: String,
+              default: ''
+          },
+      },
+      data() {
+          return {
+              searchParam: {
+                  //搜索框
+                  dataScopeId: useCommon.userId,
+                  deptName: '',
+                  parentId: '0',
+                  complaintItemName:"",
+              },
+              searchKey: "",
+              dataList: [],
+              checked: ref([]),
+              checkboxRefs: ref([]),
+              nextParentId: '0',
+              userList: [],
+          }
+      },
+      created() {
+          this.queryList()
+      },
+      methods: {
+          toggle(index) {
+              this.checkboxRefs[index].toggle();
+          },
+          toDrill(deptId, parentId) {
+              this.nextParentId = parentId;
+              this.searchParam.parentId = deptId;
+              this.queryList();
+          },
+          next() {
+              if (null != this.nextParentId) {
+                  this.searchParam.parentId = this.nextParentId;
+                  this.searchParam.deptName = "";
+                  nextDeptByparentId(this.searchParam, success => {
+                      this.nextParentId = success.data.parentId;
+                      this.queryList();
+                  }, error => {
+                  })
+              }
+          },
+          closePopup() {
+              this.$emit('close');
+          },
+          queryList() {
+            queryComplaintItemList(this.searchParam, success => {
+                  if (null != success.rows && success.rows.length > 0) {
+                      this.userList = [];
+                      this.dataList = success.rows
+                  } else {
+                      showToast ("暂无数据！")
+                  }
+              }, error => {
+              })
+          },
+          queryUserList() {
+              if (null == this.searchKey || "" == this.searchKey) {
+                  showSuccessToast('人员过多, 请输入关键字!');
+                  return;
+              }
+              queryUsersNoPermission({"userName": this.searchKey}, success => {
+                  this.dataList = [];
+                  this.userList = success.data;
+              }, error => {
+              });
+          },
+          cancel() {
+              this.searchParam.complaintItemName = '';
+              this.queryList()
+          },
+          selectData() {
+              let res = [];
+              let checkeds = JSON.parse(JSON.stringify(this.checked));
+              for (var i=0; i<checkeds.length; i++) {
+                  var item = checkeds[i].split(";-;");
+                  res.push({"deptId":item[0], "deptName":item[1]});
+              }
+              // this.$emit("reciveData", JSON.parse(JSON.stringify(this.checked)));
+              this.$emit("reciveData", res);
+              this.$emit('close');
+          },
+      },
+  }
+</script>
+
+<style scoped>
+  .popup {
+      position: fixed;
+      z-index: 999;
+      top: 3rem;
+      left: 0;
+      width: 100%;
+      height: calc(100% - 3rem);;
+      background: #fff;
+      overflow: hidden;
+  }
+
+  .popup-title {
+      margin: 0.3rem 0 0;
+      width: 100%;
+      height: 1rem;
+      border-bottom: 1px solid #f3f4f5;
+      text-align: center;
+      font-size: 0.42rem;
+      font-weight: 600;
+  }
+
+  .btn-goback {
+      position: absolute;
+      top: 0.267rem;
+      left: 0.3rem;
+      width: 0.8rem;
+      height: 0.8rem;
+      font-size: 0.5rem;
+      font-weight: bold;
+      color: #333;
+      line-height: 1.5;
+  }
+
+  .close-button {
+      position: absolute;
+      top: 0.15rem;
+      right: 0.1rem;
+      width: 0.8rem;
+      height: 0.8rem;
+      background-color: rgba(255, 255, 255, .5);
+      border: 0.05rem solid rgba(255, 255, 255, .7);
+      border-radius: 50%;
+      transform: rotate(45deg);
+  }
+
+  .close-button:before,
+  .close-button:after {
+      content: '';
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      background: #333;
+      border-radius: 50%;
+      transform: translate(-50%, -50%);
+      height: 0.4rem;
+      width: 0.02rem;
+  }
+
+  .close-button:after {
+      height: 0.02rem;
+      width: 0.4rem;
+  }
+
+  .popup-content {
+      margin: 0.25rem 0 0;
+      padding-bottom: 3rem;
+      width: 100%;
+      height: calc(100% - 1.6rem);
+      overflow-y: auto;
+      font-size: 0.37rem;
+  }
+
+  .subsearch {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 1% 0.43rem 3%;
+    width: calc(100% - 0.86rem);
+    height: 1.25rem;
+    font-size: 0.37rem;
+  }
+
+  .subsearch .ibtn-reset {
+    margin: 0 0.5rem 0 -1rem;
+    width: 1rem;
+    color: #cfcbcb;
+    font-size: 0.5rem;
+  }
+
+  .subsearch .btn-search {
+    margin: 0 0.8rem 0 -0.2rem;
+    width: 20%;
+    height: 1rem;
+    background: #eeeff1 url(/src/assets/images/icon_sou.png) no-repeat;
+    background-position: left 0.3rem center;
+    background-size: auto 50%;
+    border-radius: 0 0.15rem 0.15rem 0;
+    border: 1px solid rgba(0, 0, 0, .1);
+    border-left: 1px solid #eee;
+    line-height: 10rem;
+    overflow: hidden;
+  }
+
+  .subsearch .btn-search:last-child {
+    margin-right: 0;
+    border-radius: 0.15rem;
+    background: #1367fe;
+    border-color: #1367fe;
+    color: #fff;
+    line-height: 1;
+  }
+
+
+  .searchbox {
+    margin: 2% 0;
+    padding: 0.1rem 1.2rem 0.1rem 0.3rem;
+    width: 100%;
+    height: 1rem;
+    /*background: #f6f7fe url(../../assets/images/icon_sou.png) no-repeat;
+    background-position: left 0.25rem center;
+    background-size: auto 50%;*/
+    box-sizing: border-box;
+    border: 1px solid rgba(0, 0, 0, .1);
+    border-radius: 0.15rem 0 0 0.15rem;
+    color: #999999;
+    outline: none;
+  }
+
+  .subtitle {
+      margin: 0.5rem 0 0.25rem;
+      font-size: 0.4rem;
+      font-weight: 600;
+  }
+
+  .quick-item {
+      display: flex;
+  }
+
+  .quick-item span {
+      display: inline-block;
+      margin: 1% 0 2% 3.5%;
+      padding: 2% 3.75%;
+      background: #f2f3f4;
+      border: 0;
+      border-radius: 8px;
+      color: #4c4c4c;
+  }
+
+  .quick-item span.seled {
+      background: #e9f2fb;
+      color: #1367fe;
+  }
+
+  .btnbox {
+      display: flex;
+      justify-content: center;
+      margin: 5% 2%;
+      width: 96%;
+      height: 1.0rem;
+  }
+
+  .btn-reset,
+  .btn-search {
+      display: inline-block;
+      margin: 0 2%;
+      padding: 0;
+      width: 60%;
+      color: #fff;
+      font-size: 0.37rem;
+      border-radius: 1rem;
+      background: #1367fe;
+      border: 1px solid #1367fe;
+      text-align: center;
+  }
+
+  .btn-reset {
+      width: 35%;
+      background-color: #fff;
+      border-color: rgba(19, 103, 254, .7);
+      color: #1367fe;
+  }
+
+  .search-result {
+    width: 100%;
+    height: calc(100% - 3rem);
+    padding-bottom: 1rem;
+    overflow-y: auto;
+  }
+
+  .search-result .van-cell-group {
+    margin: 0;
+  }
+
+  .case-item {
+      margin: 3% 2%;
+      padding: 2% 0;
+      width: 96%;
+      font-size: 0.35rem;
+      border-bottom: 1px solid #f4f4f4;
+      color: #999;
+      line-height: 2;
+  }
+
+  .case-title {
+      margin: 2% 0;
+      font-size: 0.42rem;
+      color: #333;
+      line-height: 1.25;
+  }
+
+
+</style>
\ No newline at end of file