|
@@ -0,0 +1,274 @@
|
|
|
|
+<template>
|
|
|
|
+ <div id="goodsEdit">
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="24" class="main animate__animated animate__backInRight">
|
|
|
|
+ <el-col class="top-btn">
|
|
|
|
+ <el-button type="primary" size="mini" @click="toBack()">返回</el-button>
|
|
|
|
+ </el-col>
|
|
|
|
+ <!-- <el-col :span="24">参加平台活动商品设置</el-col> -->
|
|
|
|
+ <el-col :span="24" class="one">
|
|
|
|
+ <el-form :model="form" ref="form" label-width="180px">
|
|
|
|
+ <el-form-item label="设置" prop="config">
|
|
|
|
+ <el-form ref="config" :model="config" :rules="rules" label-width="80px">
|
|
|
|
+ <!-- 特价 -->
|
|
|
|
+ <el-form-item label="特价" prop="sp_price" v-if="form.platform_act_type == '3'">
|
|
|
|
+ <el-input v-model="config.sp_price" type="number" placeholder="请输入金额"></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <!-- 买赠 -->
|
|
|
|
+ <el-form-item label="买赠" v-if="form.platform_act_type == '2'">
|
|
|
|
+ <el-col :span="24" style="margin: 0 0 10px 0">
|
|
|
|
+ <el-button type="primary" size="mini" @click="toAdd()">添加</el-button>
|
|
|
|
+ </el-col>
|
|
|
|
+ <data-table :usePage="false" :fields="fields_gift" :opera="opera" :data="list" @edit="toEdit" @del="toDel"> </data-table>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <!-- 加价购 -->
|
|
|
|
+ <el-form-item label="商品类型" prop="goods_type" v-if="form.platform_act_type == '4'">
|
|
|
|
+ <el-select v-model="config.goods_type" clearable filterable placeholder="请选择商品类型" size="small" style="width: 100%">
|
|
|
|
+ <el-option v-for="i in goods_typeList" :key="i.value" :label="i.label" :value="i.value"> </el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="加价金额" prop="plus_money" v-if="config.goods_type == 'plus'">
|
|
|
|
+ <el-input v-model="config.plus_money" type="number" placeholder="请输入加价金额"></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-button type="primary" @click="onSubmit('form')">保存</el-button>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ <e-dialog :dialog="dialog" @toClose="toClose">
|
|
|
|
+ <template v-slot:info>
|
|
|
|
+ <el-form :model="fieldform" ref="fieldform" label-width="100px" class="demo-ruleForm">
|
|
|
|
+ <!-- 买赠 -->
|
|
|
|
+ <el-form-item label="赠品类型" prop="type" v-if="form.platform_act_type == '2'">
|
|
|
|
+ <el-select v-model="fieldform.type" clearable filterable placeholder="请选择赠品类型" size="small" style="width: 100%">
|
|
|
|
+ <el-option v-for="i in typeList" :key="i.value" :label="i.label" :value="i.value"> </el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="商品名称" prop="goods" v-if="form.platform_act_type == '2' && fieldform.type == '0'">
|
|
|
|
+ <el-select
|
|
|
|
+ v-model="fieldform.goods"
|
|
|
|
+ filterable
|
|
|
|
+ remote
|
|
|
|
+ reserve-keyword
|
|
|
|
+ placeholder="请选择商品名称"
|
|
|
|
+ :remote-method="querySearch"
|
|
|
|
+ :loading="loading"
|
|
|
|
+ @change="goodsSelect"
|
|
|
|
+ size="small"
|
|
|
|
+ style="width: 100%"
|
|
|
|
+ >
|
|
|
|
+ <el-option v-for="item in goodsList" :key="item._id" :label="item.name" :value="item._id"> </el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="赠品规格" prop="spec" v-if="form.platform_act_type == '2' && fieldform.type == '0'">
|
|
|
|
+ <el-select v-model="fieldform.spec" clearable filterable placeholder="请选择赠品规格" size="small" style="width: 100%" @change="specSelect">
|
|
|
|
+ <el-option v-for="i in specList" :key="i._id" :label="i.name" :value="i._id"> </el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="商品名称" prop="goods" v-if="form.platform_act_type == '2' && fieldform.type == '1'">
|
|
|
|
+ <el-input v-model="fieldform.goods" placeholder="请输入商品名称" size="small" @input="goodsInput"></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="赠品规格" prop="spec" v-if="form.platform_act_type == '2' && fieldform.type == '1'">
|
|
|
|
+ <el-input v-model="fieldform.spec" placeholder="请输入赠品规格" size="small" @input="specInput"></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="赠品数量" prop="num" v-if="form.platform_act_type == '2'">
|
|
|
|
+ <el-input v-model="fieldform.num" placeholder="请输入赠品数量" size="small" type="Number"></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item label="赠品描述" prop="desc" v-if="form.platform_act_type == '2'">
|
|
|
|
+ <el-input v-model="fieldform.desc" placeholder="请输入赠品描述" size="small" type="textarea"></el-input>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-col>
|
|
|
|
+ <el-button type="primary" @click="toSave()"> 保存 </el-button>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </template>
|
|
|
|
+ </e-dialog>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+const _ = require('lodash');
|
|
|
|
+const moment = require('moment');
|
|
|
|
+import { mapState, mapGetters, createNamespacedHelpers } from 'vuex';
|
|
|
|
+const { mapActions } = createNamespacedHelpers('goodsJoinAct');
|
|
|
|
+const { mapActions: dictData } = createNamespacedHelpers('dictData');
|
|
|
|
+const { mapActions: goods } = createNamespacedHelpers('goods');
|
|
|
|
+const { mapActions: goodsSpec } = createNamespacedHelpers('goodsSpec');
|
|
|
|
+
|
|
|
|
+export default {
|
|
|
|
+ name: 'goodsEdit',
|
|
|
|
+ props: {
|
|
|
|
+ ids: { type: String },
|
|
|
|
+ type: { type: String },
|
|
|
|
+ },
|
|
|
|
+ components: {},
|
|
|
|
+ data: function () {
|
|
|
|
+ return {
|
|
|
|
+ form: {},
|
|
|
|
+ list: [],
|
|
|
|
+ // 操作
|
|
|
|
+ opera: [
|
|
|
|
+ { label: '修改', method: 'edit' },
|
|
|
|
+ { label: '删除', method: 'del', confirm: true, type: 'danger' },
|
|
|
|
+ ],
|
|
|
|
+ fields_gift: [
|
|
|
|
+ { label: '赠品', model: 'goods_name' },
|
|
|
|
+ { label: '规格', model: 'spec_name' },
|
|
|
|
+ { label: '赠品描述', model: 'desc' },
|
|
|
|
+ ],
|
|
|
|
+ // 弹框
|
|
|
|
+ dialog: { title: '信息管理', show: false, type: '1' },
|
|
|
|
+ loading: false,
|
|
|
|
+ // 赠品
|
|
|
|
+ // 赠品商品列表
|
|
|
|
+ goodsList: [],
|
|
|
|
+ // 赠品规格列表
|
|
|
|
+ specList: [],
|
|
|
|
+ rules: {},
|
|
|
|
+ config: {},
|
|
|
|
+ // 是否使用
|
|
|
|
+ isuseList: [],
|
|
|
|
+ // 赠品类型
|
|
|
|
+ typeList: [
|
|
|
|
+ { label: '平台商品', value: '0' },
|
|
|
|
+ { label: '输入商品', value: '1' },
|
|
|
|
+ ],
|
|
|
|
+ // 加价购商品类型
|
|
|
|
+ goods_typeList: [
|
|
|
|
+ { label: '基础商品', value: 'basic' },
|
|
|
|
+ { label: '加价商品', value: 'plus' },
|
|
|
|
+ ],
|
|
|
|
+ fieldform: {},
|
|
|
|
+ };
|
|
|
|
+ },
|
|
|
|
+ async created() {
|
|
|
|
+ await this.searchOther();
|
|
|
|
+ await this.search();
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ ...dictData({ dictQuery: 'query' }),
|
|
|
|
+ ...mapActions(['fetch', 'create', 'update']),
|
|
|
|
+ ...goods({ goodsQuery: 'query', goodsFetch: 'fetch' }),
|
|
|
|
+ ...goodsSpec({ specQuery: 'query', specFetch: 'fetch' }),
|
|
|
|
+ // 查询
|
|
|
|
+ async search() {
|
|
|
|
+ let res = await this.fetch(this.ids);
|
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
|
+ this.$set(this, `form`, res.data);
|
|
|
|
+ if (res.data.config) this.$set(this, `config`, res.data.config);
|
|
|
|
+ if (res.data.platform_act_type == '2') this.$set(this, `list`, res.data.config.gift);
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ // 远程查询
|
|
|
|
+ async querySearch(value) {
|
|
|
|
+ this.loading = true;
|
|
|
|
+ let res = await this.goodsQuery({ name: value });
|
|
|
|
+ if (this.$checkRes(res)) this.$set(this, 'goodsList', res.data);
|
|
|
|
+ this.loading = false;
|
|
|
|
+ },
|
|
|
|
+ // 选择商品
|
|
|
|
+ async goodsSelect(value) {
|
|
|
|
+ let res = await this.goodsFetch(value);
|
|
|
|
+ if (this.$checkRes(res)) this.$set(this.fieldform, `goods_name`, res.data.name);
|
|
|
|
+ this.querySpec(value);
|
|
|
|
+ },
|
|
|
|
+ // 输入商品
|
|
|
|
+ goodsInput(value) {
|
|
|
|
+ this.$set(this.fieldform, `goods_name`, value);
|
|
|
|
+ },
|
|
|
|
+ // 获取规格列表
|
|
|
|
+ async querySpec(id) {
|
|
|
|
+ let res = await this.specQuery({ goods: id });
|
|
|
|
+ if (this.$checkRes(res)) this.$set(this, 'specList', res.data);
|
|
|
|
+ },
|
|
|
|
+ // 选择规格
|
|
|
|
+ async specSelect(value) {
|
|
|
|
+ let res = await this.specFetch(value);
|
|
|
|
+ if (this.$checkRes(res)) this.$set(this.fieldform, `spec_name`, res.data.name);
|
|
|
|
+ },
|
|
|
|
+ // 输入规格
|
|
|
|
+ specInput(value) {
|
|
|
|
+ this.$set(this.fieldform, `spec_name`, value);
|
|
|
|
+ },
|
|
|
|
+ // 新增
|
|
|
|
+ async toAdd() {
|
|
|
|
+ this.dialog = { title: '信息管理', show: true, type: '1' };
|
|
|
|
+ },
|
|
|
|
+ // 提交
|
|
|
|
+ toSave() {
|
|
|
|
+ let data = this.fieldform;
|
|
|
|
+ if (!data.id) data.id = moment(new Date()).valueOf();
|
|
|
|
+ let info = this.list.find((f) => f.id == data.id);
|
|
|
|
+ if (info == '' || info == undefined) this.list.push(data);
|
|
|
|
+ this.toClose();
|
|
|
|
+ },
|
|
|
|
+ // 关闭
|
|
|
|
+ toClose() {
|
|
|
|
+ this.fieldform = {};
|
|
|
|
+ this.dialog = { title: '信息管理', show: false, type: '1' };
|
|
|
|
+ },
|
|
|
|
+ // 修改
|
|
|
|
+ toEdit({ data }) {
|
|
|
|
+ this.$set(this, `fieldform`, data);
|
|
|
|
+ this.dialog = { title: '信息管理', show: true, type: '1' };
|
|
|
|
+ },
|
|
|
|
+ // 删除
|
|
|
|
+ toDel({ data }) {
|
|
|
|
+ let newList = this.list.filter((i) => i.id != data.id);
|
|
|
|
+ this.$set(this, `list`, newList);
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 提交
|
|
|
|
+ async onSubmit(formName) {
|
|
|
|
+ this.$refs[formName].validate(async (valid) => {
|
|
|
|
+ if (valid) {
|
|
|
|
+ let form = this.form;
|
|
|
|
+ let config = this.config;
|
|
|
|
+ if (form.platform_act_type == '3') config.sp_price = Number(config.sp_price);
|
|
|
|
+ if (form.platform_act_type == '2') config.gift = this.list;
|
|
|
|
+ form.config = config;
|
|
|
|
+ let res;
|
|
|
|
+ if (form.id) res = await this.update(form);
|
|
|
|
+ else res = await this.create(form);
|
|
|
|
+ if (this.$checkRes(res)) {
|
|
|
|
+ this.$message({ type: `success`, message: `维护信息成功` });
|
|
|
|
+ this.toBack();
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ return false;
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ },
|
|
|
|
+ // 查询其他信息
|
|
|
|
+ async searchOther() {
|
|
|
|
+ let res;
|
|
|
|
+ // 是否使用;
|
|
|
|
+ res = await this.dictQuery({ code: 'use' });
|
|
|
|
+ if (this.$checkRes(res)) this.$set(this, `isuseList`, res.data);
|
|
|
|
+ },
|
|
|
|
+ // 返回
|
|
|
|
+ toBack() {
|
|
|
|
+ this.$emit('toBack');
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ computed: {},
|
|
|
|
+ metaInfo() {
|
|
|
|
+ return { title: this.$route.meta.title };
|
|
|
|
+ },
|
|
|
|
+ watch: {
|
|
|
|
+ test: {
|
|
|
|
+ deep: true,
|
|
|
|
+ immediate: true,
|
|
|
|
+ handler(val) {},
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+};
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="less" scoped></style>
|