From e3d316d37485da0614b64c642e189ec8db922516 Mon Sep 17 00:00:00 2001
From: liuye <liuye@sinoecare.com>
Date: Tue, 3 Jan 2023 15:28:15 +0800
Subject: [PATCH] =?UTF-8?q?=E9=BB=94=E8=A5=BF=E5=8D=97-=E5=B1=85=E6=B0=91?=
 =?UTF-8?q?=E5=88=86=E7=B1=BB=E4=BF=A1=E6=81=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../AppResidentsType/AppResidentsType.vue     | 324 ++++++++++++++++++
 1 file changed, 324 insertions(+)
 create mode 100644 project/qianxinan/AppResidentsType/AppResidentsType.vue

diff --git a/project/qianxinan/AppResidentsType/AppResidentsType.vue b/project/qianxinan/AppResidentsType/AppResidentsType.vue
new file mode 100644
index 00000000..aa853aa1
--- /dev/null
+++ b/project/qianxinan/AppResidentsType/AppResidentsType.vue
@@ -0,0 +1,324 @@
+<template>
+  <section class="AppResidentsType">
+    <ai-list>
+      <template #content>
+        <ai-search-bar>
+          <template #left>
+            <ai-area-get
+              style="width: 180px;"
+              placeholder="请选择地区"
+              :instance="instance"
+              v-model="search.areaId"
+              @select="onAreaChange"/>
+            <el-cascader ref="cascader1" clearable v-model="departIdList" :options="girdOptions" placeholder="所属部门" size="small"
+              :props="defaultProps" :show-all-levels="false" @change="gridChange"></el-cascader>
+          </template>
+          <template #right>
+            <el-input size="small" placeholder="姓名" v-model="search.name" clearable
+              @clear="current = 1, search.name = '', getTableData()" suffix-icon="iconfont iconSearch"
+              v-throttle="() => {(current = 1), getTableData();}"/>
+          </template>
+        </ai-search-bar>
+        <ai-table :tableData="tableData" :total="total" :current.sync="current" :size.sync="size"
+                  @getList="getTableData()" :col-configs="colConfigs" :dict="dict">
+          <el-table-column slot="options" label="操作"  align="center">
+            <template slot-scope="{ row }">
+              <el-button type="text" @click="edit(row)">编辑</el-button>
+              <el-button type="text" @click="del(row.id)">删除</el-button>
+            </template>
+          </el-table-column>
+        </ai-table>
+      </template>
+    </ai-list>
+    <ai-dialog
+        title="分类信息详情"
+        :visible.sync="dialog"
+        :destroyOnClose="true"
+        width="720px"
+        @onConfirm="onConfirm"
+        @closed="form={}">
+      <ai-wrapper>
+        <ai-info-item label="姓名" :value="form.name"></ai-info-item>
+        <ai-info-item label="部门" :value="form.departmentName"></ai-info-item>
+        <ai-info-item label="手机号" :value="form.phone"></ai-info-item>
+        <ai-info-item label="行政区划" :value="form.areaName"></ai-info-item>
+      </ai-wrapper>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="登记数" prop="registerCount">
+          <el-input v-model.trim="form.registerCount" placeholder="请输入正整数" size="small"></el-input>
+        </el-form-item>
+        <el-form-item label="朋友数" prop="friendCount">
+          <el-input v-model.trim="form.friendCount" placeholder="请输入正整数" size="small"></el-input>
+        </el-form-item>
+        <el-form-item label="知己数" prop="confidantCount">
+          <el-input v-model.trim="form.confidantCount" placeholder="请输入正整数" size="small"></el-input>
+        </el-form-item>
+      </el-form>
+    </ai-dialog>
+  </section>
+
+</template>
+
+<script>
+import { mapState } from "vuex";
+export default {
+  name: "AppResidentsType",
+  label: '居民分类信息（黔西南）',
+  props: {
+    instance: Function,
+    dict: Object,
+    permissions: Function,
+    menuName:String
+  },
+  data() {
+    return {
+      search: {
+        name: '',
+        departId: '',
+        current: 1,
+        size: 10,
+        areaId: '',
+      },
+      departIdList: [],
+      tableData: [],
+      size: 10,
+      total: 0,
+      current: 1,
+      girdList: [],
+      form: {
+        registerCount: 0,
+        friendCount: 0,
+        confidantCount: 0
+      },
+      personList: [],
+      dialog: false,
+      girdOptions: [],
+      defaultProps: {
+        label: 'name',
+        value: 'id',
+        checkStrictly: true,
+      },
+      chooseUserList: [],
+      flag: false,
+    }
+  },
+  created() {
+    this.$dict.load('integralCalcType')
+    this.getTableData()
+    this.getGridList()
+  },
+  computed: {
+    ...mapState(['user']),
+    colConfigs() {
+      return [
+        { prop: "name", label: '提交人', align: "left"},
+        { prop: "departmentName", label: '部门'},
+        { prop: "areaName", label: '行政区划'},
+        { prop: "phone", label: '手机号'},
+        { prop: "registerCount", label: '登记数'},
+        { prop: "friendCount", label: '朋友数'},
+        { prop: "confidantCount", label: '知己数'},
+        { prop: "createTime", label: '创建时间'},
+        { slot: "options" },
+      ]
+    },
+    rules() {
+      return {
+        registerCount: [{required: true, message: '请输入登记数', trigger: 'blur' },
+          {pattern: /^[0-9]+$/, message: '请输入正整数'}],
+        friendCount: [{required: true, message: '请输入朋友数', trigger: 'blur' },
+          {pattern: /^[0-9]+$/, message: '请输入正整数'}],
+        confidantCount: [{required: true, message: '请输入知己数', trigger: 'blur' },
+          {pattern: /^[0-9]+$/, message: '请输入正整数'}],
+      }
+    },
+  },
+  methods: {
+    getTableData() {
+      this.instance.post(`/app/appwxuserfamiliarityrate/list`,null,{
+        params: {
+          ...this.search,
+          current: this.current,
+          size: this.size,
+          total: this.total
+        }
+      }).then(res => {
+        if(res?.data) {
+          this.tableData = res.data.records
+          this.total = res.data.total
+        }
+      })
+    },
+    onAreaChange () {
+      this.search.current = 1
+
+      this.$nextTick(() => {
+        this.getTableData()
+      })
+    },
+    del(row) {
+      this.$confirm('确定删除该数据？').then(() => {
+        this.instance.post(`/app/appwxuserfamiliarityrate/delete?id=${row.id}`).then(res => {
+          if (res.code == 0) {
+            this.$message.success('删除成功！')
+            this.getTableData()
+          }
+        })
+      })
+    },
+
+    edit(row) {
+      this.dialog = true
+      this.form = {...row}
+    },
+
+    selectPerson(val) {
+      console.log(val)
+      if (val) {
+        this.personList = val
+        this.form.ids = [...this.personList.map(e => e.sysUserId)]
+      } else {
+        this.form.ids = this.chooseUserList.map(e => e.sysUserId)
+      }
+    },
+
+    getGridList() {
+      this.instance.post(`/app/wxcp/wxdepartment/listAll`).then((res) => {
+        if (res.code == 0) {
+          this.girdOptions = this.toTree(res.data)
+        }
+      })
+    },
+
+    // 转树形结构
+    toTree(data) {
+      let result = [];
+      if (!Array.isArray(data)) {
+        return result
+      }
+      let map = {};
+      data.forEach(item => {
+        map[item.id] = item;
+      });
+      data.forEach(item => {
+        let parent = map[item.parentid];
+        if (parent) {
+          (parent.children || (parent.children = [])).push(item);
+        } else {
+          result.push(item);
+        }
+      });
+      return result;
+    },
+
+    gridChange(val) {
+      this.departIdList = val
+      this.search.departId = val?.[val.length - 1]
+      this.$refs.cascader1.dropDownVisible = false;
+      this.getTableData()
+    },
+
+    onConfirm() {
+      if(this.flag) return
+
+      this.$refs.form.validate((valid)=> {
+        if(valid) {
+          this.flag = true
+          this.instance.post(`/app/appwxuserfamiliarityrate/webUpdate`,{...this.form}).then(res => {
+            if(res?.code == 0) {
+              this.$message.success('分类信息修改成功')
+              setTimeout(() =>{
+                this.dialog = false
+                this.getTableData()
+                this.flag = false
+              }, 600)
+            } else {
+              this.flag = false
+            }
+          })
+        }
+      })
+
+    },
+
+    toDetail(id) {
+      this.$emit('change', {
+        type: 'Detail',
+        params: {
+          id: id
+        }
+      })
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.AppResidentsType {
+  height: 100%;
+
+  :deep( .ai-dialog .ai-dialog__content ){
+    max-height: 600px!important;
+  }
+
+
+
+  .userlist {
+    display: inline-block;
+  }
+
+  .userlist, .user {
+    display: inline-block;
+  }
+
+  .user {
+    position: relative;
+    width: 70px;
+    text-align: center;
+
+    .remove-icon {
+      position: absolute;
+      right: 7px;
+      top: -4px;
+      line-height: 1;
+      padding: 6px 0;
+      font-size: 16px;
+      cursor: pointer;
+
+      &:hover {
+        color: crimson;
+      }
+    }
+
+    img, h2 {
+      display: block;
+      width: 40px;
+      height: 40px;
+      line-height: 40px;
+      text-align: center;
+      margin: 0 auto 4px;
+      font-size: 14px;
+      color: #fff;
+      border-radius: 50%;
+    }
+
+    h2 {
+      background-color: $primaryColor;
+    }
+
+    span {
+      color: #666;
+      font-size: 14px;
+      white-space: nowrap;
+      overflow: hidden;
+      word-break: break-all;
+      text-overflow: ellipsis;
+    }
+  }
+
+  :deep( .selectCont .pagination ){
+    width: 100%!important;
+    background: pink;
+  }
+}
+</style>