lrf402788946 5 years ago
parent
commit
b0edcb7814

+ 4 - 0
src/components/data-table.vue

@@ -40,6 +40,7 @@
       @select-all="handleSelectAll"
       v-bind="options"
       :show-summary="useSum"
+      @row-click="rowClick"
     >
       <el-table-column type="selection" width="55" v-if="select" prop="id" :reserve-selection="true"> </el-table-column>
       <template v-for="(item, index) in fields">
@@ -237,6 +238,9 @@ export default {
       this.currentPage = 1;
       this.$emit('query', { skip: 0, limit: this.limit, ...this.searchInfo });
     },
+    rowClick(row, column, event) {
+      this.$emit(`rowClick`, row);
+    },
   },
   watch: {
     selected: {

+ 2 - 1
src/layout/layout-part/menus.vue

@@ -23,7 +23,8 @@
       <el-menu-item index="/site/index"> <i class="el-icon-s-grid"></i>站点信息管理</el-menu-item>
       <el-menu-item index="/user/index"> <i class="el-icon-s-grid"></i>用户管理</el-menu-item>
       <el-menu-item index="/links/index"> <i class="el-icon-attract"></i>友情链接管理</el-menu-item>
-      <el-menu-item index="/supermaket/chanpinType"> <i class="el-icon-s-grid"></i>产品类型字典表</el-menu-item>
+      <!-- <el-menu-item index="/supermaket/chanpinType"> <i class="el-icon-s-grid"></i>产品类型字典表</el-menu-item> -->
+      <el-menu-item index="/dictionary"> <i class="el-icon-attract"></i>平台字典管理</el-menu-item>
     </el-menu>
   </div>
 </template>

+ 2 - 2
src/layout/user/mainForm.vue

@@ -83,7 +83,7 @@
 <script>
 import upload from '@/components/upload.vue';
 import { mapActions, mapState, createNamespacedHelpers } from 'vuex';
-const { mapActions: user } = createNamespacedHelpers('user');
+const { mapActions: users } = createNamespacedHelpers('users');
 export default {
   name: 'mainForm',
   props: {},
@@ -93,7 +93,7 @@ export default {
   }),
   created() {},
   methods: {
-    ...user(['fetch', 'create', 'update']),
+    ...users(['fetch', 'create', 'update']),
     async search() {
       const res = await this.fetch(this.id);
       console.log(res);

+ 5 - 0
src/router/index.js

@@ -164,5 +164,10 @@ export default new Router({
       path: '/supermaket/chanpinTypeDetail',
       component: () => import('../views/supermaket/chanpinTypeDetail.vue'),
     },
+    {
+      path: '/dictionary',
+      meta: { title: '字典管理' },
+      component: () => import('../views/dictionary/index.vue'),
+    },
   ],
 });

+ 38 - 0
src/store/code-category.js

@@ -0,0 +1,38 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import _ from 'lodash';
+Vue.use(Vuex);
+const api = {
+  interface: `/api/setting/codecategory`,
+};
+const state = () => ({});
+const mutations = {};
+
+const actions = {
+  async query({ commit }, { skip = 0, limit, ...info } = {}) {
+    const res = await this.$axios.$get(api.interface, { skip, limit, ...info });
+    return res;
+  },
+  async create({ commit }, payload) {
+    const res = await this.$axios.$post(`${api.interface}`, payload);
+    return res;
+  },
+  async fetch({ commit }, payload) {
+    const res = await this.$axios.$get(`${api.interface}/${payload}`);
+    return res;
+  },
+  async update({ commit }, { id, ...info } = {}) {
+    const res = await this.$axios.$post(`${api.interface}/${id}`, { ...info });
+    return res;
+  },
+  async delete({ commit }, payload) {
+    const res = await this.$axios.$delete(`${api.interface}/${payload}`);
+    return res;
+  },
+};
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions,
+};

+ 38 - 0
src/store/code-item.js

@@ -0,0 +1,38 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import _ from 'lodash';
+Vue.use(Vuex);
+const api = {
+  interface: `/api/setting/codeitem`,
+};
+const state = () => ({});
+const mutations = {};
+
+const actions = {
+  async query({ commit }, { skip = 0, limit, ...info } = {}) {
+    const res = await this.$axios.$get(api.interface, { skip, limit, ...info });
+    return res;
+  },
+  async create({ commit }, payload) {
+    const res = await this.$axios.$post(`${api.interface}`, payload);
+    return res;
+  },
+  async fetch({ commit }, payload) {
+    const res = await this.$axios.$get(`${api.interface}/${payload}`);
+    return res;
+  },
+  async update({ commit }, { id, ...info } = {}) {
+    const res = await this.$axios.$post(`${api.interface}/${id}`, { ...info });
+    return res;
+  },
+  async delete({ commit }, payload) {
+    const res = await this.$axios.$delete(`${api.interface}/${payload}`);
+    return res;
+  },
+};
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions,
+};

+ 6 - 2
src/store/index.js

@@ -19,7 +19,9 @@ import talentResume from './talentResume';
 import dictionary from './dictionary';
 import protype from './protype';
 
-import user from './user';
+import users from './user';
+import codeCategory from './code-category';
+import codeItem from './code-item';
 import * as ustate from './user/state';
 import * as umutations from './user/mutations';
 Vue.use(Vuex);
@@ -43,7 +45,9 @@ export default new Vuex.Store({
     talentResume,
     dictionary,
     protype,
-    user,
+    users,
+    codeCategory,
+    codeItem,
   },
   state: { ...ustate },
   mutations: { ...umutations },

+ 69 - 0
src/views/dictionary/index.vue

@@ -0,0 +1,69 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="top">
+          <topInfo :topTitle="pageTitle"></topInfo>
+        </el-col>
+        <el-col :span="24" class="main">
+          <el-col :span="7" class="column">
+            <column @setCategory="data => (category = data)" @setList="data => (categoryList = data)"></column>
+          </el-col>
+          <el-col :span="17" class="message">
+            <item-list :category="category" :categoryList="categoryList"></item-list>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import topInfo from '@/layout/public/top.vue';
+import column from './parts/column.vue';
+import itemList from './parts/itemList.vue';
+import dataTable from '@/components/data-table.vue';
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'index',
+  props: {},
+  components: { topInfo, column, itemList },
+  data: () => {
+    return {
+      category: undefined,
+      categoryList: [],
+    };
+  },
+  created() {},
+  methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.main {
+  padding: 20px;
+  margin: 10px 20px;
+  border: 1px solid #ccc;
+  width: 96%;
+}
+.column {
+  width: 258px;
+  min-height: 500px;
+  border: 1px solid #ccc;
+  margin: 0 20px 0 0;
+}
+.message {
+  border: 1px solid #ccc;
+  min-height: 500px;
+  // min-width: 715px;
+}
+</style>

+ 124 - 0
src/views/dictionary/parts/column.vue

@@ -0,0 +1,124 @@
+<template>
+  <div id="column">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="top">
+          <el-col :span="12" class="topTitle">
+            <span>字典类别</span>
+          </el-col>
+          <el-col :span="12" class="topAdd">
+            <el-button type="primary" size="mini" @click="toAdd()"><i class="el-icon-plus"></i></el-button>
+          </el-col>
+        </el-col>
+        <el-col :span="24" class="list">
+          <data-table :fields="fields" @delete="toDelete" :data="list" :opera="opera" @edit="toEdit" @rowClick="rowClick" :usePage="false"></data-table>
+        </el-col>
+      </el-col>
+      <el-drawer title="字典类别" :visible.sync="drawer" direction="rtl" @closed="handleClose" :destroy-on-close="true">
+        <data-form :fields="fields" :data="form" :rules="{}" @save="drawerSave" :isNew="drawerIsNew"></data-form>
+      </el-drawer>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import dataForm from '@/components/form.vue';
+import dataTable from '@/components/data-table.vue';
+import { mapActions, mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: codeCategory } = createNamespacedHelpers('codeCategory');
+export default {
+  name: 'column',
+  props: {
+    columnInfo: null,
+  },
+  components: { dataTable, dataForm },
+  data: () => ({
+    drawer: false,
+    form: {},
+    drawerIsNew: true,
+    opera: [
+      {
+        label: '编辑',
+        icon: 'el-icon-edit',
+        method: 'edit',
+      },
+      {
+        label: '删除',
+        icon: 'el-icon-delete',
+        method: 'delete',
+        confirm: true,
+      },
+    ],
+    fields: [
+      { label: '名称', prop: 'name', model: 'name' },
+      { label: '代码', prop: 'code', model: 'code' },
+    ],
+    list: [],
+    total: 0,
+  }),
+  created() {
+    this.search();
+  },
+  computed: {},
+  methods: {
+    ...codeCategory(['query', 'create', 'update', 'delete']),
+    async search({ skip = 0, limit = 10, ...info } = {}) {
+      const res = await this.query({ ...info });
+      if (this.$checkRes(res)) {
+        this.$set(this, `list`, res.data);
+        this.$set(this, `total`, res.total);
+        this.$emit('setList', res.data);
+      }
+    },
+    toAdd() {
+      this.drawer = true;
+    },
+    toEdit({ data }) {
+      this.$set(this, 'form', data);
+      this.drawer = true;
+      this.drawerIsNew = false;
+    },
+    async drawerSave({ data, isNew }) {
+      let res;
+      let msg;
+      if (isNew) {
+        res = await this.create(data);
+        msg = '字典类别创建成功';
+      } else {
+        res = await this.update(data);
+        msg = '字典类别修改成功';
+      }
+      if (this.$checkRes(res, msg, res.errmsg)) {
+        this.handleClose();
+        this.search();
+      }
+    },
+    async toDelete({ data }) {
+      const res = await this.delete(data.id);
+      if (this.$checkRes(res, '删除成功', res.errmsg || '删除失败')) this.search();
+    },
+    handleClose() {
+      this.drawer = false;
+      this.form = {};
+      this.drawerIsNew = true;
+    },
+    rowClick(row) {
+      this.$emit('setCategory', row.code);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.top {
+  padding: 15px 0;
+  border-bottom: 1px solid #cccc;
+}
+.top .topTitle {
+  padding: 0 10px;
+}
+.top .topAdd {
+  padding: 0 10px 0 0;
+  text-align: right;
+}
+</style>

+ 158 - 0
src/views/dictionary/parts/itemList.vue

@@ -0,0 +1,158 @@
+<template>
+  <div id="itemList">
+    <el-row>
+      <el-col :span="24" class="info">
+        <el-col :span="24" class="top">
+          <el-col :span="12" class="topTitle">
+            <span>{{ pageTitle }}</span>
+          </el-col>
+          <el-col :span="12" class="topAdd">
+            <el-button type="primary" size="mini" @click="toAdd()"><i class="el-icon-plus"></i></el-button>
+          </el-col>
+        </el-col>
+        <el-col :span="24" class="list">
+          <data-table :fields="fields" @delete="toDelete" :data="list" :opera="opera" @edit="toEdit" :usePage="false"></data-table>
+        </el-col>
+      </el-col>
+      <el-drawer title="字典项" :visible.sync="drawer" direction="rtl" @closed="handleClose" :destroy-on-close="true">
+        <data-form :fields="fields" :data="form" :rules="{}" @save="drawerSave" :isNew="drawerIsNew">
+          <template #options="{item}">
+            <template v-if="item.model === 'category'">
+              <el-option v-for="(i, index) in categoryList" :key="index" :label="i.name" :value="i.code"></el-option>
+            </template>
+          </template>
+        </data-form>
+      </el-drawer>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import dataForm from '@/components/form.vue';
+import dataTable from '@/components/data-table.vue';
+import { mapActions, mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: codeItem } = createNamespacedHelpers('codeItem');
+const { mapActions: codeCategory } = createNamespacedHelpers('codeCategory');
+export default {
+  name: 'itemList',
+  props: {
+    category: String,
+    categoryList: Array,
+  },
+  components: { dataTable, dataForm },
+  data: () => {
+    return {
+      pageTitle: '字典项',
+      drawer: false,
+      form: {},
+      drawerIsNew: true,
+      opera: [
+        {
+          label: '编辑',
+          icon: 'el-icon-edit',
+          method: 'edit',
+        },
+        {
+          label: '删除',
+          icon: 'el-icon-delete',
+          method: 'delete',
+          confirm: true,
+        },
+      ],
+      fields: [
+        { label: '名称', prop: 'name', model: 'name' },
+        { label: '代码', prop: 'code', model: 'code' },
+        { label: '类别代码', prop: 'category', model: 'category', type: 'select' },
+      ],
+      list: [],
+      total: 0,
+    };
+  },
+  created() {},
+  methods: {
+    ...codeItem(['query', 'create', 'update', 'delete']),
+    async search({ skip = 0, limit = 10, ...info } = {}) {
+      const res = await this.query({ ...info, category: this.category });
+      if (this.$checkRes(res)) {
+        this.$set(this, `list`, res.data);
+        this.$set(this, `total`, res.total);
+      }
+    },
+    toAdd() {
+      this.drawer = true;
+    },
+    toEdit({ data }) {
+      this.$set(this, 'form', data);
+      this.drawer = true;
+      this.drawerIsNew = false;
+    },
+    async drawerSave({ data, isNew }) {
+      let res;
+      let msg;
+      if (isNew) {
+        res = await this.create(data);
+        msg = '字典项创建成功';
+      } else {
+        res = await this.update(data);
+        msg = '字典项修改成功';
+      }
+      if (this.$checkRes(res, msg, res.errmsg)) {
+        this.handleClose();
+        this.search();
+      }
+    },
+    async toDelete({ data }) {
+      const res = await this.delete(data.id);
+      if (this.$checkRes(res, '删除成功', res.errmsg || '删除失败')) this.search();
+    },
+    handleClose() {
+      this.drawer = false;
+      this.form = {};
+      if (this.category) this.form.category = this.category;
+      this.drawerIsNew = true;
+    },
+    async getOtherList() {
+      let res = await this.getCategoryList();
+      if (this.$checkRes(res)) this.$set(this, `categoryList`, res.data);
+    },
+  },
+  watch: {
+    category: {
+      handler(val) {
+        if (val) {
+          this.search();
+          this.$set(this.form, `category`, val);
+          let res = this.categoryList.find(f => f.code == val);
+          console.log(res);
+          if (res) this.$set(this, `pageTitle`, res.name);
+        }
+      },
+      immediate: true,
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.top {
+  padding: 15px 0;
+  border-bottom: 1px solid #cccc;
+}
+.top .topTitle {
+  padding: 0 10px;
+}
+.top .topAdd {
+  padding: 0 10px 0 0;
+  text-align: right;
+}
+.page {
+  padding: 20px 0;
+  text-align: center;
+}
+</style>

+ 2 - 10
src/views/user/index.vue

@@ -23,30 +23,23 @@
         </el-col>
       </el-col>
     </el-row>
-    <el-dialog title="用户审核" :visible.sync="dialog" center :destroy-on-close="true">
-      <data-form :data="info" :fields="fields" :rules="{}" @save="handleSave" :isNew="true"> </data-form>
-    </el-dialog>
   </div>
 </template>
 
 <script>
 import topInfo from '@/layout/public/top.vue';
-import searchInfo from '@/layout/user/searchInfo.vue';
-import dataForm from '@/components/form.vue';
 import dataTable from '@/components/data-table.vue';
 import { mapActions, mapState, createNamespacedHelpers } from 'vuex';
-const { mapActions: user } = createNamespacedHelpers('user');
+const { mapActions: users } = createNamespacedHelpers('users');
 export default {
   name: 'index',
   props: {},
   components: {
     topInfo, //头部标题
-    // searchInfo, //搜索
     dataTable,
   },
   data: () => ({
     topTitle: '用户管理',
-    dialog: false,
     opera: [
       {
         label: '编辑',
@@ -67,7 +60,6 @@ export default {
       { label: '状态', prop: 'status', format: i => (i == '0' ? '待审核' : i == '1' ? '审核成功' : '审核拒绝') },
     ],
     list: [],
-    form: {},
     total: 0,
   }),
   created() {
@@ -75,7 +67,7 @@ export default {
   },
   computed: {},
   methods: {
-    ...user(['query', 'delete', 'update']),
+    ...users(['query', 'delete', 'update']),
     async search({ skip = 0, limit = 10, ...info } = {}) {
       const res = await this.query({ skip, limit, ...info });
       if (this.$checkRes(res)) {