|
@@ -0,0 +1,122 @@
|
|
|
+<template>
|
|
|
+ <div id="spec">
|
|
|
+ <template v-if="view === 'list'">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" style="padding: 10px">
|
|
|
+ <el-button icon="el-icon-back" size="mini" @click="toBack()">返回</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('goodsSpec');
|
|
|
+const { mapActions: dictData } = createNamespacedHelpers('dictData');
|
|
|
+export default {
|
|
|
+ name: 'spec',
|
|
|
+ props: {},
|
|
|
+ components: {},
|
|
|
+ data: function () {
|
|
|
+ return {
|
|
|
+ view: 'list',
|
|
|
+ fields: [
|
|
|
+ { label: '规格名称', model: 'name' },
|
|
|
+ { label: '库存', model: 'num' },
|
|
|
+ { label: '实际销售价格', model: 'sell_money' },
|
|
|
+ { label: '划掉销售价格', model: 'flow_money' },
|
|
|
+ { label: '运费', model: 'freight' },
|
|
|
+ { label: '状态', model: 'status', format: (i) => (i === '0' ? '使用中' : '已禁用') },
|
|
|
+ ],
|
|
|
+ opera: [
|
|
|
+ { label: '修改', method: 'edit' },
|
|
|
+ { label: '删除', method: 'delete', confirm: true, type: 'danger' },
|
|
|
+ ],
|
|
|
+ list: [],
|
|
|
+ total: 0,
|
|
|
+ limit: 10,
|
|
|
+ btnFields: [{ label: '添加', method: 'add' }],
|
|
|
+ defaultSearch: {},
|
|
|
+ searchInfo: {},
|
|
|
+ searchFields: [
|
|
|
+ { label: '规格名称', model: 'name' },
|
|
|
+ { label: '状态', model: 'status', type: 'select' },
|
|
|
+ ],
|
|
|
+ infoFields: [
|
|
|
+ { label: '规格名称', model: 'name' },
|
|
|
+ { label: '库存', model: 'num', type: 'number' },
|
|
|
+ { label: '实际销售价格', model: 'sell_money', type: 'number' },
|
|
|
+ { label: '划掉销售价格', model: 'flow_money', type: 'number' },
|
|
|
+ { label: '运费', model: 'freight', type: 'number' },
|
|
|
+ { label: '状态', model: 'status', type: 'select' },
|
|
|
+ ],
|
|
|
+ rules: {},
|
|
|
+ form: {},
|
|
|
+
|
|
|
+ statusList: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState(['user']),
|
|
|
+ goods() {
|
|
|
+ return this.$route.params.id;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.defaultSearch.goods = this.goods;
|
|
|
+ this.searchOthers();
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...dictData({ getDict: 'query' }),
|
|
|
+ ...mapActions(['query', 'fetch', 'update', 'delete', 'create']),
|
|
|
+ ...methodUtil,
|
|
|
+ initAddData() {
|
|
|
+ const obj = { goods: this.goods, status: '0' };
|
|
|
+ this.$set(this, 'form', obj);
|
|
|
+ },
|
|
|
+
|
|
|
+ toBack() {
|
|
|
+ this.$router.push('/selfShop/goods');
|
|
|
+ },
|
|
|
+ async searchOthers() {
|
|
|
+ let res = await this.getDict({ code: 'status' });
|
|
|
+ if (this.$checkRes(res)) this.$set(this, 'statusList', res.data);
|
|
|
+ },
|
|
|
+ },
|
|
|
+ metaInfo() {
|
|
|
+ return { title: this.$route.meta.title };
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped></style>
|