1、角色管理新增事件标签

2、用户管理新增头像、职务

src/views/modules/sys/role-add-or-update.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-dialog :visible.sync="visible" width="1500px"
+  <el-dialog :visible.sync="visible" width="1000px"
              :title="!dataForm.id ? $t('add') : $t('update')"
              :close-on-click-modal="false"
              :close-on-press-escape="false">
@@ -29,7 +29,7 @@
                   :placeholder="$t('role.remark')"></el-input>
       </el-form-item>
       <el-row>
-        <el-col :span="5">
+        <el-col :span="7">
           <el-form-item size="mini"
                         :label="$t('role.menuList')">
             <el-tree :data="menuList"
@@ -41,7 +41,7 @@
             </el-tree>
           </el-form-item>
         </el-col>
-        <el-col :span="5">
+        <el-col :span="7">
           <el-form-item size="mini"
                         :label="$t('role.deptList')">
             <el-tree :data="deptList"
@@ -53,7 +53,20 @@
             </el-tree>
           </el-form-item>
         </el-col>
-        <el-col :span="4">
+        <el-col :span="7">
+          <el-form-item size="mini"
+                        :label="$t('role.whistleDeptList')">
+            <el-tree :data="whistleDeptList"
+                     :props="{ label: 'name', children: 'children' }"
+                     node-key="id"
+                     ref="whistleDeptListTree"
+                     accordion
+                     show-checkbox
+                     :check-strictly="true">
+            </el-tree>
+          </el-form-item>
+        </el-col>
+        <el-col :span="7">
           <el-form-item size="mini"
                         :label="$t('role.appMenuList')">
             <el-tree :data="appMenuList"
@@ -65,38 +78,37 @@
             </el-tree>
           </el-form-item>
         </el-col>
-        <el-col :span="4">
+        <el-col :span="7">
           <el-form-item size="mini"
-                        :label="$t('role.categoryList')">
-            <el-tree :data="categoryList"
+                        :label="$t('role.analysisMenuList')">
+            <el-tree :data="analysisMenuList"
                      :props="{ label: 'name', children: 'children' }"
                      node-key="id"
-                     ref="categoryListTree"
+                     ref="analysisMenuListTree"
                      accordion
                      show-checkbox>
             </el-tree>
           </el-form-item>
         </el-col>
-        <el-col :span="6">
+        <el-col :span="7">
           <el-form-item size="mini"
-                        :label="$t('role.whistleDeptList')">
-            <el-tree :data="whistleDeptList"
+                        :label="$t('role.categoryList')">
+            <el-tree :data="categoryList"
                      :props="{ label: 'name', children: 'children' }"
                      node-key="id"
-                     ref="whistleDeptListTree"
+                     ref="categoryListTree"
                      accordion
-                     show-checkbox
-                     :check-strictly="true">
+                     show-checkbox>
             </el-tree>
           </el-form-item>
         </el-col>
-        <el-col :span="5">
+        <el-col :span="7">
           <el-form-item size="mini"
-                        :label="$t('role.analysisMenuList')">
-            <el-tree :data="analysisMenuList"
-                     :props="{ label: 'name', children: 'children' }"
+                        label="事件标签授权">
+            <el-tree :data="eventsTagsList"
+                     :props="{ label: 'tagName', children: 'children' }"
                      node-key="id"
-                     ref="analysisMenuListTree"
+                     ref="eventsTagsListTree"
                      accordion
                      show-checkbox>
             </el-tree>
@@ -125,6 +137,7 @@ export default {
       categoryList: [],
       roleTypeList: [],
       analysisMenuList: [],
+      eventsTagsList: [],
       dataForm: {
         id: '',
         name: '',
@@ -134,6 +147,7 @@ export default {
         categoryIdList: [],
         whistleDeptIdList: [],
         analysisMenuIdList: [],
+        eventsTagsIdList: [],
         remark: '',
         typeKey: ''
       }
@@ -162,11 +176,13 @@ export default {
         this.$refs.categoryListTree.setCheckedKeys([])
         this.$refs.whistleDeptListTree.setCheckedKeys([])
         this.$refs.analysisMenuListTree.setCheckedKeys([])
+        this.$refs.eventsTagsListTree.setCheckedKeys([])
         Promise.all([
           this.getMenuList(),
           this.getDeptList(),
           this.getAppMenuList(),
-          this.getCategoryList()
+          this.getCategoryList(),
+          this.getEventsTagsList()
           // this.getWhistleDeptList()
           // this.getAnalysisMenuList()
         ]).then(() => {
@@ -224,6 +240,15 @@ export default {
         this.categoryList = res.data
       }).catch(() => { })
     },
+    // 获取事件标签列表
+    getEventsTagsList () {
+      return this.$http.get('/events/eventtag/eventstags').then(({ data: res }) => {
+        if (res.code !== 0) {
+          return this.$message.error(res.msg)
+        }
+        this.eventsTagsList = res.data
+      }).catch(() => { })
+    },
     // getAnalysisMenuList () {
     //   return this.$http.get('/sys/analysismenu/select').then(({ data: res }) => {
     //     if (res.code !== 0) {
@@ -248,6 +273,7 @@ export default {
         this.dataForm.categoryIdList.forEach(item => this.$refs.categoryListTree.setChecked(item, true))
         this.dataForm.analysisMenuIdList.forEach(item => this.$refs.analysisMenuListTree.setChecked(item, true))
         this.$refs.whistleDeptListTree.setCheckedKeys(this.dataForm.whistleDeptIdList)
+        this.dataForm.eventsTagsIdList.forEach(item => this.$refs.eventsTagsListTree.setChecked(item, true))
       }).catch(() => { })
     },
     // 表单提交
@@ -269,6 +295,10 @@ export default {
           ...this.$refs.categoryListTree.getCheckedKeys(),
           ...this.$refs.categoryListTree.getHalfCheckedKeys()
         ]
+        this.dataForm.eventsTagsIdList = [
+          ...this.$refs.eventsTagsListTree.getCheckedKeys(),
+          ...this.$refs.eventsTagsListTree.getHalfCheckedKeys()
+        ]
         this.dataForm.analysisMenuIdList = [
           ...this.$refs.analysisMenuListTree.getCheckedKeys(),
           ...this.$refs.analysisMenuListTree.getHalfCheckedKeys()

src/views/modules/sys/user-add-or-update.vue

@@ -117,6 +117,29 @@
           <el-radio :label="0">{{ $t('user.gender0') }}</el-radio>
         </el-radio-group>
       </el-form-item>
+      <el-form-item prop="position"
+                    label="职务">
+        <el-input v-model="dataForm.position"
+                  placeholder="职务"></el-input>
+      </el-form-item>
+      <el-form-item label="头像"
+                    v-loading="loading"
+                    prop="avatar">
+        <el-upload class="avatar-uploader"
+                   :action="uploadUrl"
+                   :show-file-list="false"
+                   :on-success="handleAvatarActSuccess"
+                   :on-error="handelError"
+                   :before-upload="beforeAvatarUpload">
+          <img v-if="dataForm.headUrl"
+               :src="dataForm.headUrl"
+               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 prop="email"
                     :label="$t('user.email')">
         <el-input v-model="dataForm.email"
@@ -168,6 +191,7 @@
 <script>
 import debounce from 'lodash/debounce'
 import { isEmail, isMobile } from '@/utils/validate'
+import Cookies from 'js-cookie'
 export default {
   data () {
     return {
@@ -198,6 +222,8 @@ export default {
         roleIdList: [],
         status: 1,
         userTagKey: '',
+        position: '',
+        headUrl: '',
         wgyInfo: {
           id: '',
           sysUserId: '',
@@ -209,7 +235,9 @@ export default {
           customerId: ''
         }
       },
-      userTagDictList: []
+      userTagDictList: [],
+      loading: false,
+      uploadUrl: ''
     }
   },
   computed: {
@@ -274,6 +302,7 @@ export default {
   methods: {
     init () {
       this.visible = true
+      this.uploadUrl = `${window.SITE_CONFIG['apiURL']}/oss/file/upload?token=${Cookies.get('token')}`
       this.$nextTick(() => {
         this.$refs['dataForm'].resetFields()
         this.roleIdListDefault = []
@@ -368,6 +397,16 @@ export default {
         }
       }).catch(() => { })
     },
+    handleAvatarActSuccess (res, file) {
+      this.loading = false
+      this.dataForm.headUrl = res.data.url
+    },
+    beforeAvatarUpload (file) {
+      this.loading = true
+    },
+    handelError () {
+      this.loading = false
+    },
     // 所属部门树, 选中
     deptListTreeCurrentChangeHandle (data, node) {
       this.dataForm.deptId = data.id
@@ -441,4 +480,27 @@ export default {
     }
   }
 }
+.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: 100px;
+  height: 100px;
+  line-height: 100px;
+  text-align: center;
+}
+.avatar {
+  width: 100px;
+  height: 100px;
+  display: block;
+}
 </style>

vue.config.js

@@ -9,7 +9,6 @@ module.exports = {
   devServer: {
     open: true,
     port: 8001,
-    public: '192.168.51.32',
     overlay: {
       errors: false,
       warnings: false