From 95195334c25d6f767b3b1a1e48b3460b6d4fc3cf Mon Sep 17 00:00:00 2001
From: Jackwang <wt373747285@163.com>
Date: Tue, 14 Sep 2021 14:49:51 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BD=91=E6=A0=BC=E9=98=9F=E4=BC=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../modules/sys/gridmember-add-or-update.vue  | 178 +++++++++++++-----
 src/views/modules/sys/gridmember.vue          |  89 ++++++---
 2 files changed, 198 insertions(+), 69 deletions(-)

diff --git a/src/views/modules/sys/gridmember-add-or-update.vue b/src/views/modules/sys/gridmember-add-or-update.vue
index ae50d3b..ed481c4 100644
--- a/src/views/modules/sys/gridmember-add-or-update.vue
+++ b/src/views/modules/sys/gridmember-add-or-update.vue
@@ -2,14 +2,41 @@
   <el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false" :close-on-press-escape="false">
     <el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'">
           <el-form-item label="姓名" prop="name">
-          <el-input v-model="dataForm.name" placeholder="姓名"></el-input>
-      </el-form-item>
-          <el-form-item label="头像" prop="imgUrl">
-          <el-input v-model="dataForm.imgUrl" placeholder="头像"></el-input>
-      </el-form-item>
-          <el-form-item label="党员标识：0否1是" prop="partyFlag">
-          <el-input v-model="dataForm.partyFlag" placeholder="党员标识：0否1是"></el-input>
+          <el-input v-model="dataForm.name" placeholder="姓名" style="width: 260px"></el-input>
       </el-form-item>
+        <el-form-item label="党员标识" prop="partyFlag">
+            <el-select v-model="dataForm.partyFlag" clearable placeholder="党员标识" style="width: 260px">
+                <el-option v-for="item in partyFlagList" :key="item.dictValue" :label="item.dictName" :value="item.dictValue">
+                </el-option>
+            </el-select>
+        </el-form-item>
+        <el-form-item label="头像"
+                      v-loading="loading"
+                      prop="imgUrl">
+            <el-upload class="avatar-uploader"
+                       :action="uploadUrl"
+                       :show-file-list="false"
+                       :on-success="handleAvatarSuccess"
+                       :before-upload="beforeAvatarUpload">
+                <img v-if="dataForm.imgUrl"
+                     :src="dataForm.imgUrl"
+                     class="avatar">
+                <i v-else
+                   class="el-icon-plus avatar-uploader-icon"></i>
+                <div slot="tip"
+                     class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
+            </el-upload>
+        </el-form-item>
+        <el-form-item label="所属组织"
+                      prop="allDeptIdsShow">
+            <el-cascader v-model="dataForm.allDeptIdsShow"
+                         :options="options"
+                         :props="{  multiple: false, emitPath: true }"
+                         clearable
+                         @change="changeHandle"
+                         collapse-tags
+                         style="width: 500px"></el-cascader>
+        </el-form-item>
           <el-form-item label="格言" prop="motto">
           <el-input v-model="dataForm.motto" placeholder="格言"></el-input>
       </el-form-item>
@@ -22,42 +49,43 @@
           <el-form-item label="电话" prop="mobile">
           <el-input v-model="dataForm.mobile" placeholder="电话"></el-input>
       </el-form-item>
-          <el-form-item label="所属网格名称" prop="dept">
-          <el-input v-model="dataForm.dept" placeholder="所属网格名称"></el-input>
-      </el-form-item>
-          <el-form-item label="所属网格id" prop="deptId">
-          <el-input v-model="dataForm.deptId" placeholder="所属网格id"></el-input>
-      </el-form-item>
-          <el-form-item label="父所有部门" prop="parentDeptIds">
-          <el-input v-model="dataForm.parentDeptIds" placeholder="父所有部门"></el-input>
-      </el-form-item>
-          <el-form-item label="父所有部门" prop="parentDeptNames">
-          <el-input v-model="dataForm.parentDeptNames" placeholder="父所有部门"></el-input>
-      </el-form-item>
-          <el-form-item label="所有部门ID" prop="allDeptIds">
-          <el-input v-model="dataForm.allDeptIds" placeholder="所有部门ID"></el-input>
-      </el-form-item>
-          <el-form-item label="所有部门名称" prop="allDeptNames">
-          <el-input v-model="dataForm.allDeptNames" placeholder="所有部门名称"></el-input>
-      </el-form-item>
-          <el-form-item label="乐观锁" prop="revision">
-          <el-input v-model="dataForm.revision" placeholder="乐观锁"></el-input>
-      </el-form-item>
-          <el-form-item label="创建人" prop="createdBy">
-          <el-input v-model="dataForm.createdBy" placeholder="创建人"></el-input>
-      </el-form-item>
-          <el-form-item label="创建时间" prop="createdTime">
-          <el-input v-model="dataForm.createdTime" placeholder="创建时间"></el-input>
-      </el-form-item>
-          <el-form-item label="更新人" prop="updatedBy">
-          <el-input v-model="dataForm.updatedBy" placeholder="更新人"></el-input>
-      </el-form-item>
-          <el-form-item label="更新时间" prop="updatedTime">
-          <el-input v-model="dataForm.updatedTime" placeholder="更新时间"></el-input>
-      </el-form-item>
-          <el-form-item label="删除标记" prop="delFlag">
-          <el-input v-model="dataForm.delFlag" placeholder="删除标记"></el-input>
-      </el-form-item>
+<!--          <el-form-item label="所属网格名称" prop="dept">-->
+<!--          <el-input v-model="dataForm.dept" placeholder="所属网格名称"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="所属网格" prop="deptId">-->
+<!--          <el-input v-model="dataForm.deptId" placeholder="所属网格"></el-input>-->
+<!--      </el-form-item>-->
+
+<!--          <el-form-item label="父所有部门" prop="parentDeptIds">-->
+<!--          <el-input v-model="dataForm.parentDeptIds" placeholder="父所有部门"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="父所有部门" prop="parentDeptNames">-->
+<!--          <el-input v-model="dataForm.parentDeptNames" placeholder="父所有部门"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="所有部门ID" prop="allDeptIds">-->
+<!--          <el-input v-model="dataForm.allDeptIds" placeholder="所有部门ID"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="所有部门名称" prop="allDeptNames">-->
+<!--          <el-input v-model="dataForm.allDeptNames" placeholder="所有部门名称"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="乐观锁" prop="revision">-->
+<!--          <el-input v-model="dataForm.revision" placeholder="乐观锁"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="创建人" prop="createdBy">-->
+<!--          <el-input v-model="dataForm.createdBy" placeholder="创建人"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="创建时间" prop="createdTime">-->
+<!--          <el-input v-model="dataForm.createdTime" placeholder="创建时间"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="更新人" prop="updatedBy">-->
+<!--          <el-input v-model="dataForm.updatedBy" placeholder="更新人"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="更新时间" prop="updatedTime">-->
+<!--          <el-input v-model="dataForm.updatedTime" placeholder="更新时间"></el-input>-->
+<!--      </el-form-item>-->
+<!--          <el-form-item label="删除标记" prop="delFlag">-->
+<!--          <el-input v-model="dataForm.delFlag" placeholder="删除标记"></el-input>-->
+<!--      </el-form-item>-->
       </el-form>
     <template slot="footer">
       <el-button @click="visible = false">{{ $t('cancel') }}</el-button>
@@ -68,6 +96,7 @@
 
 <script>
 import debounce from 'lodash/debounce'
+import Cookies from 'js-cookie'
 export default {
   data () {
     return {
@@ -92,8 +121,16 @@ export default {
         createdTime: '',
         updatedBy: '',
         updatedTime: '',
-        delFlag: ''
-      }
+        delFlag: '',
+        allDeptIdsShow:[]
+      },
+        uploadUrl: '',
+        loading: false,
+        options: [],
+        partyFlagList: [
+            {dictValue: '0', dictName: '否'},
+            {dictValue: '1', dictName: '是'},
+        ]
     }
   },
   computed: {
@@ -159,7 +196,33 @@ export default {
       }
     }
   },
+    created () {
+        this.$http
+            .get(`/sys/user/deptOptions/getAllByLoginUser`)
+            .then(({ data: res }) => {
+                if (res.code !== 0) {
+                    return this.$message.error(res.msg)
+                }
+                this.options = res.data.options
+            })
+            .catch(() => { })
+        this.$nextTick(() => {
+            this.uploadUrl = `${window.SITE_CONFIG['apiURL']}/oss/file/upload?token=${Cookies.get('token')}`
+        })
+
+    },
   methods: {
+      changeHandle(value) {
+          this.dataForm.deptId = this.dataForm.allDeptIdsShow[this.dataForm.allDeptIdsShow.length - 1]
+      },
+      // 上传图片
+      handleAvatarSuccess (res, file) {
+          this.loading = false
+          this.dataForm.imgUrl = res.data.url
+      },
+      beforeAvatarUpload (file) {
+          this.loading = true
+      },
     init () {
       this.visible = true
       this.$nextTick(() => {
@@ -206,3 +269,28 @@ export default {
   }
 }
 </script>
+<style>
+    .avatar-uploader .el-upload {
+        border: 1px dashed #d9d9d9;
+        border-radius: 6px;
+        cursor: pointer;
+        position: relative;
+        overflow: hidden;
+    }
+    .avatar-uploader .el-upload:hover {
+        border-color: #409eff;
+    }
+    .avatar-uploader-icon {
+        font-size: 28px;
+        color: #8c939d;
+        width: 178px;
+        height: 178px;
+        line-height: 178px;
+        text-align: center;
+    }
+    .avatar {
+        width: 178px;
+        height: 178px;
+        display: block;
+    }
+</style>
\ No newline at end of file
diff --git a/src/views/modules/sys/gridmember.vue b/src/views/modules/sys/gridmember.vue
index c830f9c..c6f6a9b 100644
--- a/src/views/modules/sys/gridmember.vue
+++ b/src/views/modules/sys/gridmember.vue
@@ -2,45 +2,64 @@
   <el-card shadow="never" class="aui-card--fill">
     <div class="mod-sys__gridmember}">
       <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
-        <el-form-item>
-          <el-input v-model="dataForm.id" placeholder="id" clearable></el-input>
+        <el-form-item label="姓名" prop="name">
+        <el-input v-model="dataForm.name"
+                  placeholder="姓名"
+                  clearable></el-input>
+      </el-form-item>
+        <el-form-item label="电话" prop="mobile">
+          <el-input v-model="dataForm.mobile"
+                    placeholder="电话"
+                    clearable></el-input>
+        </el-form-item>
+        <el-form-item label="所属部门"
+                      prop="allDeptIds">
+          <el-cascader v-model="allDeptIds"
+                       :options="options"
+                       :props="{  checkStrictly: true,multiple: false, emitPath: true }"
+                       clearable
+                       @change="changeHandle"
+                       collapse-tags></el-cascader>
         </el-form-item>
         <el-form-item>
           <el-button @click="getDataList()">{{ $t('query') }}</el-button>
         </el-form-item>
         <el-form-item>
-          <el-button v-if="$hasPermission('sys:gridmember:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
+          <el-button type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button>
         </el-form-item>
         <el-form-item>
           <el-button v-if="$hasPermission('sys:gridmember:delete')" type="danger" @click="deleteHandle()">{{ $t('deleteBatch') }}</el-button>
         </el-form-item>
       </el-form>
       <el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%;">
-        <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
-        <el-table-column prop="id" label="主键" header-align="center" align="center"></el-table-column>
+        <el-table-column type="index"
+                         width="50"
+                         label="序号" align="center"></el-table-column>
+<!--        <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>-->
+<!--        <el-table-column prop="id" label="主键" header-align="center" align="center"></el-table-column>-->
         <el-table-column prop="name" label="姓名" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="imgUrl" label="头像" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="partyFlag" label="党员标识：0否1是" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="motto" label="格言" header-align="center" align="center"></el-table-column>
+<!--        <el-table-column prop="imgUrl" label="头像" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="partyFlag" label="党员标识" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="motto" label="格言" header-align="center" align="center"></el-table-column>-->
         <el-table-column prop="duty" label="职责" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="territory" label="负责区域" header-align="center" align="center"></el-table-column>
+<!--        <el-table-column prop="territory" label="负责区域" header-align="center" align="center"></el-table-column>-->
         <el-table-column prop="mobile" label="电话" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="dept" label="所属网格名称" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="deptId" label="所属网格id" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="parentDeptIds" label="父所有部门" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="parentDeptNames" label="父所有部门" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="allDeptIds" label="所有部门ID" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="allDeptNames" label="所有部门名称" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="revision" label="乐观锁" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="createdBy" label="创建人" header-align="center" align="center"></el-table-column>
+        <el-table-column prop="dept" label="所属部门" header-align="center" align="center"></el-table-column>
+<!--        <el-table-column prop="deptId" label="所属网格id" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="parentDeptIds" label="父所有部门" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="parentDeptNames" label="父所有部门" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="allDeptIds" label="所有部门ID" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="allDeptNames" label="所有部门名称" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="revision" label="乐观锁" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="createdBy" label="创建人" header-align="center" align="center"></el-table-column>-->
         <el-table-column prop="createdTime" label="创建时间" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="updatedBy" label="更新人" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="updatedTime" label="更新时间" header-align="center" align="center"></el-table-column>
-        <el-table-column prop="delFlag" label="删除标记" header-align="center" align="center"></el-table-column>
+<!--        <el-table-column prop="updatedBy" label="更新人" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="updatedTime" label="更新时间" header-align="center" align="center"></el-table-column>-->
+<!--        <el-table-column prop="delFlag" label="删除标记" header-align="center" align="center"></el-table-column>-->
         <el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150">
           <template slot-scope="scope">
-            <el-button v-if="$hasPermission('sys:gridmember:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</el-button>
-            <el-button v-if="$hasPermission('sys:gridmember:delete')" type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>
+            <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</el-button>
+            <el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -74,11 +93,33 @@ export default {
       },
       dataForm: {
         id: ''
-      }
+      },
+      options: [],
+      allDeptIds:{}
     }
   },
   components: {
     AddOrUpdate
-  }
+  },
+  watch: {
+    allDeptIds: function (val) {
+      if (val.length === 0) {
+        this.dataForm.deptId = ''
+      } else {
+        this.dataForm.deptId = this.allDeptIds[val.length - 1]
+      }
+    }
+  },
+  created () {
+    this.$http
+            .get(`/sys/user/deptOptions/getAllByLoginUser`)
+            .then(({ data: res }) => {
+              if (res.code !== 0) {
+                return this.$message.error(res.msg)
+              }
+              this.options = res.data.options
+            })
+            .catch(() => { })
+  },
 }
 </script>