|
@@ -1,46 +1,48 @@
|
|
|
<template>
|
|
|
- <div id="index">
|
|
|
- <el-row>
|
|
|
- <el-col :span="24" class="main animate__animated animate__backInRight">
|
|
|
- <el-col :span="24" class="one"> <span>店铺账号</span> </el-col>
|
|
|
- <el-col :span="24" class="two">
|
|
|
- <search-1 :form="searchForm" @onSubmit="search" @toReset="toClose"></search-1>
|
|
|
+ <div id="goods">
|
|
|
+ <template v-if="view === 'list'">
|
|
|
+ <el-col :span="24" class="one"> <span>店铺管理</span> </el-col>
|
|
|
+ <data-search :fields="searchFields" v-model="searchInfo" @query="search"> </data-search>
|
|
|
+ <data-btn :fields="btnList" @add="toAdd"></data-btn>
|
|
|
+ <data-table
|
|
|
+ ref="dataTable"
|
|
|
+ :fields="fields"
|
|
|
+ :opera="opera"
|
|
|
+ :data="list"
|
|
|
+ :total="total"
|
|
|
+ :limit="limit"
|
|
|
+ @query="search"
|
|
|
+ @manage="toManage"
|
|
|
+ @edit="toEdit"
|
|
|
+ @del="toDel"
|
|
|
+ ></data-table>
|
|
|
+ </template>
|
|
|
+ <template v-else>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-button type="primary" size="mini" @click="toBackList()">返回</el-button>
|
|
|
</el-col>
|
|
|
- <el-col :span="24" class="four">
|
|
|
- <data-table
|
|
|
- :select="true"
|
|
|
- :selected="selected"
|
|
|
- @handleSelect="handleSelect"
|
|
|
- :fields="fields"
|
|
|
- :opera="opera"
|
|
|
- @query="search"
|
|
|
- :data="list"
|
|
|
- :total="total"
|
|
|
- @manage="toManage"
|
|
|
- >
|
|
|
- </data-table>
|
|
|
+ <el-col :span="24">
|
|
|
+ <data-form :fields="infoFields" :rules="rules" v-model="form" labelWidth="150px" @save="toSave"> </data-form>
|
|
|
</el-col>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
+ </el-row>
|
|
|
+ </template>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
const _ = require('lodash');
|
|
|
-import { mapState, mapGetters, createNamespacedHelpers } from 'vuex';
|
|
|
+import methodsUtil from '@/util/opera';
|
|
|
+import { mapState, createNamespacedHelpers } from 'vuex';
|
|
|
const { mapActions: shop } = createNamespacedHelpers('shop');
|
|
|
const { mapActions: dictData } = createNamespacedHelpers('dictData');
|
|
|
export default {
|
|
|
name: 'index',
|
|
|
props: {},
|
|
|
- components: {
|
|
|
- search1: () => import('./parts/search-1.vue'),
|
|
|
- },
|
|
|
+ components: {},
|
|
|
data: function () {
|
|
|
- const that = this;
|
|
|
return {
|
|
|
- // 列表
|
|
|
- opera: [{ label: '账号管理', method: 'manage' }],
|
|
|
+ view: 'list',
|
|
|
fields: [
|
|
|
{ label: '店铺编号', model: 'code' },
|
|
|
{ label: '店铺名称', model: 'name' },
|
|
@@ -53,91 +55,129 @@ export default {
|
|
|
label: '店铺状态',
|
|
|
model: 'status',
|
|
|
format: (i) => {
|
|
|
- let data = that.statusList.find((f) => f.value == i);
|
|
|
+ let data = this.statusList.find((f) => f.value == i);
|
|
|
if (data) return data.label;
|
|
|
else return '暂无';
|
|
|
},
|
|
|
},
|
|
|
],
|
|
|
+ opera: [
|
|
|
+ { label: '修改', method: 'edit' },
|
|
|
+ { label: '删除', method: 'del', confirm: true, type: 'danger' },
|
|
|
+ ],
|
|
|
+ btnList: [{ label: '添加', method: 'add' }],
|
|
|
+ searchFields: [{ label: '店铺名称', model: 'name' }],
|
|
|
+ searchInfo: {},
|
|
|
list: [],
|
|
|
total: 0,
|
|
|
- // 查询
|
|
|
- searchForm: {},
|
|
|
- // 多选值
|
|
|
- selected: [],
|
|
|
+ limit: 10,
|
|
|
+ // info部分
|
|
|
+ infoFields: [
|
|
|
+ { label: '店铺名称', model: 'name' },
|
|
|
+ { label: '店铺编号', model: 'code' },
|
|
|
+ { label: '店铺logo', model: 'logo', type: 'upload', limit: 1, url: '/files/point/shopLogo/upload' },
|
|
|
+ { label: '店主', model: 'person' },
|
|
|
+ { label: '联系电话', model: 'phone' },
|
|
|
+ { label: '地址', model: 'address' },
|
|
|
+ { label: '证件照片', model: 'file', type: 'upload', url: '/files/point/shopFile/upload' },
|
|
|
+ { label: '店铺二维码', model: 'qrcode', type: 'upload', url: '/files/point/shopFile/upload' },
|
|
|
+ ],
|
|
|
+ rules: {},
|
|
|
+ form: {},
|
|
|
// 店铺状态列表
|
|
|
statusList: [],
|
|
|
};
|
|
|
},
|
|
|
- async created() {
|
|
|
- await this.searchOther();
|
|
|
- await this.search();
|
|
|
+ created() {
|
|
|
+ this.searchOthers();
|
|
|
+ this.search();
|
|
|
},
|
|
|
methods: {
|
|
|
+ ...methodsUtil,
|
|
|
...dictData({ getDict: 'query' }),
|
|
|
...shop(['query', 'delete', 'fetch', 'update', 'create']),
|
|
|
- async search({ skip = 0, limit = 10, ...info } = {}) {
|
|
|
- let condition = _.cloneDeep(this.searchForm);
|
|
|
- let res = await this.query({ skip, limit, ...condition, ...info });
|
|
|
+ async search({ skip = 0, limit = this.limit, ...others } = {}) {
|
|
|
+ let query = { skip, limit, ...others };
|
|
|
+ if (Object.keys(this.searchInfo).length > 0) query = { ...query, ...this.searchInfo };
|
|
|
+ const res = await this.query(query);
|
|
|
if (this.$checkRes(res)) {
|
|
|
- this.$set(this, 'list', res.data);
|
|
|
- this.$set(this, 'total', res.total);
|
|
|
+ this.$set(this, `list`, res.data);
|
|
|
+ this.$set(this, `total`, res.total);
|
|
|
}
|
|
|
},
|
|
|
+ initAddData() {
|
|
|
+ const obj = { status: '1' };
|
|
|
+ this.$set(this, 'form', obj);
|
|
|
+ },
|
|
|
// 账号管理
|
|
|
async toManage({ data }) {
|
|
|
this.$router.push({ path: '/platmanag/storeAcc/detail', query: { id: data._id } });
|
|
|
},
|
|
|
- // 重置
|
|
|
- toClose() {
|
|
|
- this.searchForm = {};
|
|
|
- this.search();
|
|
|
+ // 修改
|
|
|
+ async toEdit({ data }) {
|
|
|
+ const res = await this.fetch(data._id);
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ let data = res.data;
|
|
|
+ this.$set(this, `form`, data);
|
|
|
+ this.view = 'info';
|
|
|
+ } else {
|
|
|
+ this.$message.error('未找到指定数据');
|
|
|
+ }
|
|
|
},
|
|
|
- // 多选
|
|
|
- handleSelect(data) {
|
|
|
- this.$set(this, `selected`, data);
|
|
|
+ // 删除
|
|
|
+ async toDel({ data }) {
|
|
|
+ let res = await this.delete(data._id);
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ this.$message({ type: `success`, message: `刪除信息成功` });
|
|
|
+ this.search();
|
|
|
+ }
|
|
|
},
|
|
|
- async searchOther() {
|
|
|
+ // 保存
|
|
|
+ async toSave({ data }) {
|
|
|
+ data.status = '1';
|
|
|
+ let res;
|
|
|
+ if (data.id) res = await this.update(data);
|
|
|
+ else res = await this.create(data);
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
+ this.$message({ type: `success`, message: `维护信息成功` });
|
|
|
+ this.search();
|
|
|
+ this.toBackList();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async searchOthers() {
|
|
|
let res;
|
|
|
- // 类型
|
|
|
res = await this.getDict({ code: 'shop_status' });
|
|
|
if (this.$checkRes(res)) {
|
|
|
this.$set(this, `statusList`, res.data);
|
|
|
}
|
|
|
},
|
|
|
+ toBackList() {
|
|
|
+ this.view = 'list';
|
|
|
+ this.form = {};
|
|
|
+ },
|
|
|
},
|
|
|
computed: {
|
|
|
- ...mapState(['user']),
|
|
|
- },
|
|
|
- metaInfo() {
|
|
|
- return { title: this.$route.meta.title };
|
|
|
- },
|
|
|
- watch: {
|
|
|
- test: {
|
|
|
- deep: true,
|
|
|
- immediate: true,
|
|
|
- handler(val) {},
|
|
|
+ id() {
|
|
|
+ return this.$route.query.id;
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
-.main {
|
|
|
- .one {
|
|
|
- margin: 0 0 10px 0;
|
|
|
+.one {
|
|
|
+ margin: 0 0 10px 0;
|
|
|
|
|
|
- span:nth-child(1) {
|
|
|
- font-size: 20px;
|
|
|
- font-weight: 700;
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
- }
|
|
|
- .two {
|
|
|
- margin: 0 0 10px 0;
|
|
|
- }
|
|
|
- .thr {
|
|
|
- margin: 0 0 10px 0;
|
|
|
+ span:nth-child(1) {
|
|
|
+ font-size: 20px;
|
|
|
+ font-weight: 700;
|
|
|
+ margin-right: 10px;
|
|
|
}
|
|
|
}
|
|
|
+.two {
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+}
|
|
|
+.thr {
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+}
|
|
|
</style>
|