feat: optionset

src/components/OptionSet/index.vue

@@ -1,11 +1,6 @@
 <template>
   <el-select v-model="valueTurn" :multiple="multiple" :placeholder="placeholder">
-    <el-option
-      v-for="item in options"
-      :key="item.value"
-      :label="item.text"
-      :value="item.value"
-    />
+    <el-option v-for="item in options" :key="item.value" :label="item.text" :value="item.value" />
   </el-select>
 </template>
 <script>
@@ -36,52 +31,16 @@ export default {
     }
   },
   computed: {
-    // valueTurn() {
-    //   get: () => {
-    // typeof this.value === 'string' ? return this.value : return this.value.toString()
-    //     if (typeof this.value === 'string') {
-    //       return this.value
-    //     } else {
-    //       return this.value.toString()
-    //     }
-    //   }
-    // }
     valueTurn: {
       get: function() {
-        if (typeof this.value === 'string') {
-          return this.value
-        } else if (typeof this.value === 'number') {
-          return this.value.toString()
-        } else if (typeof this.value === 'object') {
-          return this.value
-        }
         return this.value
       },
       set: function(newValue) {
-        if (typeof this.value === 'string') {
-          // this.value = newValue
-          this.$emit('update:value', newValue)
-        } else if (typeof this.value === 'number') {
-          // this.value = parseInt(newValue)
-          this.$emit('update:value', parseInt(newValue))
-        } else if (typeof this.value === 'object') {
-          this.$emit('update:value', newValue)
-        }
+        this.$emit('update:value', newValue)
       }
     }
   },
-  watch: {
-    // 'value': function(newVal, oldVal) {
-    //   debugger
-    //   typeof newVal === 'string' ? this.selectValue = newVal : this.selectValue = newVal.toString()
-    // },
-    // 'selectValue': function(newVal, oldVal) {
-    //   debugger
-    //   typeof this.value === 'string' ? this.$emit('update:value', newVal) : this.$emit('update:value', parseInt(newVal))
-    // }
-  },
   created() {
-    this.multiple
     this.getOptions()
   },
   methods: {

src/components/Sheet/index.vue

@@ -96,7 +96,6 @@
           </div>
         </template>
       </el-table-column>
-      <!--endregion-->
     </el-table>
     <div class="clearfix" style="height: 32px;margin: 10px 24px 0 10px;">
       <el-pagination
@@ -218,10 +217,7 @@ export default {
     },
     formatter(row, column) {
       if (this.optionsets[column.formatter] !== undefined) {
-        let colValue
-        typeof row[column.prop] === 'number'
-          ? (colValue = row[column.prop].toString())
-          : (colValue = row[column.prop])
+        const colValue = row[column.prop]
         for (var i = 0; i < this.optionsets[column.formatter].length; i++) {
           if (this.optionsets[column.formatter][i].value === colValue) {
             return this.optionsets[column.formatter][i].text
@@ -254,10 +250,7 @@ export default {
         }
       })
       for (var i = 0; i < codes.length; i++) {
-        this.optionsets[codes[i]] = await this.$store.dispatch(
-          'optionset/formatterData',
-          codes[i]
-        )
+        this.optionsets[codes[i]] = await this.$store.dispatch('optionset/formatterData', codes[i])
       }
       this.dataLoading = true
       this.dataQuery

src/store/modules/optionset.js

@@ -0,0 +1,38 @@
+import { get } from '@/api/modules/sys_optionset'
+
+const state = {
+}
+
+const mutations = {
+}
+
+const actions = {
+  async formatterData({ dispatch, commit }, code) {
+    await dispatch('getOptionsets', code)
+    return state[code]
+  },
+  async flattenData({ dispatch, commit }, code) {
+    await dispatch('getOptionsets', code)
+    const stateObj = {}
+    state[code].forEach(item => {
+      stateObj[item.value] = item.text
+    })
+    return stateObj
+  },
+  async getOptionsets({ commit }, code) {
+    if (state[code] === undefined) {
+      const { data: { value } = {}} = await get({ code: code })
+      if (value) {
+        state[code] = JSON.parse(value)
+      }
+    }
+  }
+}
+
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions
+}
+

src/views/menu/index.vue

@@ -87,9 +87,7 @@
           <el-input v-model="temp.perms" placeholder="Please input perms" />
         </el-form-item>
         <el-form-item label="Type:" prop="type">
-          <el-select v-model="temp.type" placeholder="Please input type" style="width: 100%;">
-            <el-option v-for="item in menuTypes" :key="item.id" :label="item.name" :value="item.id" />
-          </el-select>
+          <option-set :value.sync="temp.type" placeholder="Please input type" code="sys_menu_type" />
         </el-form-item>
         <el-form-item label="Parent:" prop="parent">
           <cascader
@@ -109,7 +107,6 @@
         </el-button>
       </footer>
     </el-dialog>
-
   </el-container>
 </template>
 
@@ -118,10 +115,11 @@ import { mapGetters } from 'vuex'
 import Tree from '@/components/Tree'
 import Sheet from '@/components/Sheet'
 import Cascader from '@/components/Cascader'
+import OptionSet from '@/components/OptionSet'
 
 export default {
   name: 'Menu',
-  components: { Tree, Sheet, Cascader },
+  components: { Tree, Sheet, Cascader, OptionSet },
   data() {
     return {
       tableColumns: [
@@ -202,7 +200,7 @@ export default {
         icon: '',
         order: 0,
         perms: '',
-        type: '',
+        type: 0,
         hidden: 0
       },
       rules: {

src/views/user/index.vue

@@ -198,7 +198,7 @@ export default {
         { prop: 'mobile', label: 'Mobile', align: 'center', minWidth: 150, maxWidth: 180 },
         { prop: 'org_name', label: 'Org', align: 'center', minWidth: 150, maxWidth: 180 },
         { prop: 'role_name', label: 'Role', align: 'center', minWidth: 150, maxWidth: 180 },
-        { prop: 'status', label: 'Status', align: 'center', minWidth: 150, maxWidth: 180 }
+        { prop: 'status', formatter: 'sys_user_status', label: 'Status', align: 'center', minWidth: 150, maxWidth: 180 }
       ],
       operates: {
         list: [
@@ -264,12 +264,10 @@ export default {
     ])
   },
   mounted() {
-    // 设置表头查询表单高度，使table高度自适应
     var height = this.$refs.searchForm.$el.offsetHeight
     this.$store.dispatch('app/pageTableHeaderHeight', { height: height })
   },
   destroyed() {
-    // 页面注销，设置pageTableHeaderHeight为0
     this.$store.dispatch('app/pageTableHeaderHeight', { height: 0 })
   },
   created() {
@@ -286,7 +284,6 @@ export default {
       console.log(row, event, column, event.currentTarget)
     },
     handleEdit(index, row, col) {
-      debugger
     },
     handleDelete(index, dataIndex) {
       this.temp_items[dataIndex].value.splice(index, 1)
@@ -358,7 +355,7 @@ export default {
       this.$refs['tempForm'].validate((valid) => {
         if (valid) {
           this.temp.temp_value = JSON.stringify(this.temp_items)
-          this.$api.user.create(this.temp).then((res) => {
+          this.$api.sysUser.create(this.temp).then((res) => {
             this.dialogVisible = false
             if (res.code === 200) {
               this.$message({
@@ -409,21 +406,11 @@ export default {
       this.$refs['tempForm'].validate((valid) => {
         if (valid) {
           this.temp.temp_value = JSON.stringify(this.temp_items)
-          this.$api.user.update(this.temp).then((res) => {
-            if (res.code === 200) {
-              this.dialogVisible = false
-              this.$message({
-                message: '修改成功',
-                type: 'success'
-              })
-              this.$refs.qtable.getData()
-            } else {
-              this.dialogVisible = false
-              this.$message({
-                message: '修改失败',
-                type: 'error'
-              })
-            }
+          this.$api.sysUser.update(this.temp).then((res) => {
+            this.$message({
+              message: '修改成功',
+              type: 'success'
+            })
           })
         }
       })
@@ -433,7 +420,7 @@ export default {
         type: 'warning'
       }).then(() => {
         const data = [{ id: row.id }]
-        this.$api.user.del(data).then((res) => {
+        this.$api.sysUser.del(data).then((res) => {
           if (res.code === 200) {
             this.$refs.qtable.getData()
             this.$message({

src/views/user/templ_detail/index.vue

@@ -96,11 +96,7 @@
             </el-table-column>
             <el-table-column label="操作">
               <template slot-scope="scope">
-                <el-button
-                  size="small"
-                  type="danger"
-                  @click="handleDelete(scope.$index, scope.row)"
-                >删除</el-button>
+                <el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                 <el-button
                   v-if="scope.$index == colsData.length - 1"
                   size="small"