|
@@ -0,0 +1,130 @@
|
|
|
|
+<template>
|
|
|
|
+ <div id="index">
|
|
|
|
+ <template v-if="view === 'list'">
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="24" style="padding: 10px">
|
|
|
|
+ <el-button icon="el-icon-back" size="mini" @click="backLevel()" v-if="levelList.length > 0">返回</el-button>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ <data-search :fields="searchFields" v-model="searchInfo" @query="search">
|
|
|
|
+ <template #status>
|
|
|
|
+ <el-option v-for="i in statusList" :key="i.model" :label="i.label" :value="i.value"></el-option>
|
|
|
|
+ </template>
|
|
|
|
+ </data-search>
|
|
|
|
+ <data-btn :fields="btnFields" @add="toAdd" />
|
|
|
|
+ <data-table ref="dataTable" :fields="fields" :opera="opera" :data="list" :total="total" @edit="toEdit" @delete="toDelete">
|
|
|
|
+ <template #code="{ row, item }">
|
|
|
|
+ <el-link type="primary" @click="toData(row)">{{ row[item.model] }}</el-link>
|
|
|
|
+ </template>
|
|
|
|
+ </data-table>
|
|
|
|
+ </template>
|
|
|
|
+ <template v-else>
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="24">
|
|
|
|
+ <el-button icon="el-icon-back" size="mini" @click="toBack()">返回</el-button>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="24">
|
|
|
|
+ <data-form :span="12" :fields="infoFields" :rules="rules" v-model="form" labelWidth="150px" @save="toSave">
|
|
|
|
+ <template #status>
|
|
|
|
+ <el-option v-for="i in statusList" :key="i.model" :label="i.label" :value="i.value"></el-option>
|
|
|
|
+ </template>
|
|
|
|
+ </data-form>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </template>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+const _ = require('lodash');
|
|
|
|
+import methodUtil from '@/util/opera';
|
|
|
|
+import { mapState, createNamespacedHelpers } from 'vuex';
|
|
|
|
+const { mapActions } = createNamespacedHelpers('goodsTags');
|
|
|
|
+const { mapActions: dictData } = createNamespacedHelpers('dictData');
|
|
|
|
+export default {
|
|
|
|
+ name: 'index',
|
|
|
|
+ props: {},
|
|
|
|
+ components: {},
|
|
|
|
+ data: function () {
|
|
|
|
+ return {
|
|
|
|
+ view: 'list',
|
|
|
|
+ fields: [
|
|
|
|
+ { label: '显示名称', model: 'label' },
|
|
|
|
+ { label: '标签编码', model: 'code', custom: true },
|
|
|
|
+ { label: '状态', model: 'status', format: (i) => (i === '0' ? '使用中' : '已禁用') },
|
|
|
|
+ ],
|
|
|
|
+ opera: [
|
|
|
|
+ { label: '修改', method: 'edit' },
|
|
|
|
+ { label: '删除', method: 'delete', confirm: true, type: 'danger' },
|
|
|
|
+ ],
|
|
|
|
+ list: [],
|
|
|
|
+ total: 0,
|
|
|
|
+ limit: 20,
|
|
|
|
+ btnFields: [{ label: '添加', method: 'add' }],
|
|
|
|
+ defaultSearch: {},
|
|
|
|
+ searchInfo: {},
|
|
|
|
+ searchFields: [
|
|
|
|
+ { label: '显示名称', model: 'label' },
|
|
|
|
+ { label: '标签编码', model: 'code' },
|
|
|
|
+ { label: '状态', model: 'status', type: 'select' },
|
|
|
|
+ ],
|
|
|
|
+ infoFields: [
|
|
|
|
+ { label: '显示名称', model: 'label' },
|
|
|
|
+ { label: '标签编码', model: 'code' },
|
|
|
|
+ { label: '状态', model: 'status', type: 'select' },
|
|
|
|
+ ],
|
|
|
|
+ rules: {},
|
|
|
|
+ form: {},
|
|
|
|
+ statusList: [],
|
|
|
|
+
|
|
|
|
+ levelList: [],
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ ...mapState(['user']),
|
|
|
|
+ },
|
|
|
|
+ created() {
|
|
|
|
+ this.searchOthers();
|
|
|
|
+ this.search();
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ ...mapActions(['query', 'fetch', 'create', 'update', 'delete']),
|
|
|
|
+ ...dictData({ getDict: 'query' }),
|
|
|
|
+ ..._.cloneDeep(methodUtil),
|
|
|
|
+ //执行查询
|
|
|
|
+ async search({ skip = 0, limit = this.limit || 10, ...others } = {}) {
|
|
|
|
+ let query = { skip, limit, ...others };
|
|
|
|
+ if (this.searchInfo && Object.keys(this.searchInfo).length > 0) query = { ...query, ...this.searchInfo };
|
|
|
|
+ if (this.defaultSearch && Object.keys(this.defaultSearch).length > 0) query = { ...query, ...this.defaultSearch };
|
|
|
|
+ if (this.levelList.length > 0) query.pid = _.last(this.levelList);
|
|
|
|
+ const res = await this.query(query);
|
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
|
+ this.$set(this, `list`, res.data);
|
|
|
|
+ this.$set(this, `total`, res.total);
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ async searchOthers() {
|
|
|
|
+ const res = await this.getDict({ code: 'use' });
|
|
|
|
+ if (this.$checkRes(res)) this.$set(this, 'statusList', res.data);
|
|
|
|
+ },
|
|
|
|
+ initAddData() {
|
|
|
|
+ const pid = _.last(this.levelList);
|
|
|
|
+ if (pid) this.form.pid = pid;
|
|
|
|
+ },
|
|
|
|
+ toData(row) {
|
|
|
|
+ const id = _.get(row, '_id');
|
|
|
|
+ this.levelList.push(id);
|
|
|
|
+ this.search();
|
|
|
|
+ },
|
|
|
|
+ backLevel() {
|
|
|
|
+ this.levelList.pop();
|
|
|
|
+ this.search();
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ metaInfo() {
|
|
|
|
+ return { title: this.$route.meta.title };
|
|
|
|
+ },
|
|
|
|
+};
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="less" scoped></style>
|