|
|
@@ -0,0 +1,821 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-form :model="form" :rules="rules" ref="ruleForm" :inline="true">
|
|
|
+ <el-alert title="基础信息" :closable="false" class="alert" type="info" />
|
|
|
+ <el-form-item label="商品名称" prop="name" :label-width="formLabelWidth">
|
|
|
+ <el-input
|
|
|
+ style="width: 220px !important"
|
|
|
+ placeholder="请输入商品名称"
|
|
|
+ type="text"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ v-model.trim="form.name"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="货号" prop="sn" :label-width="formLabelWidth">
|
|
|
+ <el-input
|
|
|
+ style="width: 220px !important"
|
|
|
+ placeholder="请输入货号"
|
|
|
+ type="text"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ v-model.trim="form.sn"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="品牌" prop="brand" :label-width="formLabelWidth">
|
|
|
+ <el-input
|
|
|
+ style="width: 220px !important"
|
|
|
+ v-model.trim="form.brand"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ placeholder="请输入品牌"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <el-form-item label="所属分部" :label-width="formLabelWidth" prop="organIdList">
|
|
|
+ <select-all v-model.trim="form.organIdList"
|
|
|
+ filterable
|
|
|
+ placeholder="请选择所属分部"
|
|
|
+ style="width: 100% !important"
|
|
|
+ multiple
|
|
|
+ :disabled="addDisabled || addType == 'update'"
|
|
|
+ @change="onOrganChange"
|
|
|
+ clearable>
|
|
|
+ <el-option v-for="item in selects.branchs"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id.toString()"></el-option>
|
|
|
+ </select-all>
|
|
|
+ </el-form-item> -->
|
|
|
+ <el-form-item label="商品类型" prop="type" :label-width="formLabelWidth">
|
|
|
+ <el-select
|
|
|
+ v-model.trim="form.type"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ style="width: 220px !important"
|
|
|
+ placeholder="请选择商品类型"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in goodsType"
|
|
|
+ :key="index"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ label="商品分类"
|
|
|
+ prop="goodsCategoryId"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <el-select
|
|
|
+ v-model.trim="form.goodsCategoryId"
|
|
|
+ style="width: 220px !important"
|
|
|
+ placeholder="请选择商品分类"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ filterable
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in categoryList"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ label="商品型号"
|
|
|
+ prop="specification"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model.trim="form.specification"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ style="width: 220px !important"
|
|
|
+ placeholder="请输入商品型号"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <div v-for="(goodsList, index) in form.goodsList" :key="index">
|
|
|
+ <el-form-item
|
|
|
+ :label="'商品' + (index + 1)"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ style="display: inline-block; width: 80% !important"
|
|
|
+ :prop="'goodsList.' + index + '.id'"
|
|
|
+ :rules="[
|
|
|
+ { required: true, message: '请选择商品', trigger: 'change' }
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ <el-select
|
|
|
+ v-model.trim="goodsList.id"
|
|
|
+ @change="onGoodsChange"
|
|
|
+ filterable
|
|
|
+ style="width: 220px !important"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ placeholder="请选择商品"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="(item, index) in selectGoodsList"
|
|
|
+ :key="index"
|
|
|
+ :disabled="item.disabled"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <div v-if="!addDisabled" style="display: inline-block">
|
|
|
+ <el-button
|
|
|
+ icon="el-icon-minus"
|
|
|
+ v-if="form.goodsList.length > 1"
|
|
|
+ @click.prevent="removeGoodsList(goodsList)"
|
|
|
+ circle
|
|
|
+ ></el-button>
|
|
|
+ <el-button
|
|
|
+ icon="el-icon-plus"
|
|
|
+ @click.prevent="addGoodsList"
|
|
|
+ circle
|
|
|
+ style="margin-left: 5px"
|
|
|
+ ></el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-alert title="价格信息" :closable="false" class="alert" type="info" />
|
|
|
+ <el-form-item
|
|
|
+ label="市场价"
|
|
|
+ class="hiddenStart"
|
|
|
+ prop="marketPrice"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <template slot="label">
|
|
|
+ <p style="position: relative">
|
|
|
+ <span style="color: #f56c6c; margin-right: 4px">*</span>
|
|
|
+ 市场价
|
|
|
+ <el-tooltip placement="top" popper-class="mTooltip">
|
|
|
+ <div slot="content">
|
|
|
+ 商品标价，仅在商品购买时做展示，不以该价格向学员销售商品
|
|
|
+ </div>
|
|
|
+ <i
|
|
|
+ class="el-icon-question"
|
|
|
+ style="
|
|
|
+ font-size: 18px;
|
|
|
+ color: #f56c6c;
|
|
|
+ position: relative;
|
|
|
+ top: 2px;
|
|
|
+ "
|
|
|
+ ></i>
|
|
|
+ </el-tooltip>
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ <el-input
|
|
|
+ type="number"
|
|
|
+ placeholder="请输入市场价"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ @mousewheel.native.prevent
|
|
|
+ v-model.trim="form.marketPrice"
|
|
|
+ style="width: 220px !important"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ label="零售价"
|
|
|
+ class="hiddenStart"
|
|
|
+ prop="discountPrice"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <template slot="label">
|
|
|
+ <p style="position: relative">
|
|
|
+ <span style="color: #f56c6c; margin-right: 4px">*</span>
|
|
|
+ 零售价
|
|
|
+ <el-tooltip placement="top" popper-class="mTooltip">
|
|
|
+ <div slot="content">
|
|
|
+ 管理端APP、乐器维修时学员购买该商品的价格
|
|
|
+ </div>
|
|
|
+ <i
|
|
|
+ class="el-icon-question"
|
|
|
+ style="
|
|
|
+ font-size: 18px;
|
|
|
+ color: #f56c6c;
|
|
|
+ position: relative;
|
|
|
+ top: 2px;
|
|
|
+ "
|
|
|
+ ></i>
|
|
|
+ </el-tooltip>
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ <el-input
|
|
|
+ type="number"
|
|
|
+ placeholder="请输入零售价"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ @mousewheel.native.prevent
|
|
|
+ v-model.trim="form.discountPrice"
|
|
|
+ style="width: 220px !important"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ label="商品团购价"
|
|
|
+ prop="groupPurchasePrice"
|
|
|
+ class="hiddenStart"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <template slot="label">
|
|
|
+ <p style="position: relative">
|
|
|
+ <span style="color: #f56c6c; margin-right: 4px">*</span>
|
|
|
+ 团购价
|
|
|
+ <el-tooltip placement="top" popper-class="mTooltip">
|
|
|
+ <div slot="content">乐团报名缴费时学员购买该商品的价格</div>
|
|
|
+ <i
|
|
|
+ class="el-icon-question"
|
|
|
+ style="
|
|
|
+ font-size: 18px;
|
|
|
+ color: #f56c6c;
|
|
|
+ position: relative;
|
|
|
+ top: 2px;
|
|
|
+ "
|
|
|
+ ></i>
|
|
|
+ </el-tooltip>
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ <el-input
|
|
|
+ type="number"
|
|
|
+ placeholder="请输入商品团购价"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ @mousewheel.native.prevent
|
|
|
+ v-model.trim="form.groupPurchasePrice"
|
|
|
+ style="width: 220px !important"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-alert title="销售渠道" :closable="false" class="alert" type="info" />
|
|
|
+ <el-form-item
|
|
|
+ label="移动端可售分部"
|
|
|
+ prop="educationShowOrganId"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <select-all
|
|
|
+ v-model.trim="form.educationShowOrganId"
|
|
|
+ filterable
|
|
|
+ placeholder="移动端可售分部"
|
|
|
+ style="width: 400px !important"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ :disabled="addDisabled"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in selects.branchs"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id.toString()"
|
|
|
+ ></el-option>
|
|
|
+ </select-all>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- :disabled="pageDisabled || pageType == 'update'" -->
|
|
|
+ <el-form-item
|
|
|
+ label="课程收费乐团可售分部"
|
|
|
+ prop="courseFeeShowOrganId"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <select-all
|
|
|
+ v-model.trim="form.courseFeeShowOrganId"
|
|
|
+ filterable
|
|
|
+ placeholder="课程收费乐团可售分部"
|
|
|
+ style="width: 400px !important"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ :disabled="addDisabled"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in selects.branchs"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id.toString()"
|
|
|
+ ></el-option>
|
|
|
+ </select-all>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- :disabled="pageDisabled || pageType == 'update'" -->
|
|
|
+ <el-form-item
|
|
|
+ label="会员收费乐团可售分部"
|
|
|
+ prop="memberFeeShowOrganId"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <select-all
|
|
|
+ v-model.trim="form.memberFeeShowOrganId"
|
|
|
+ filterable
|
|
|
+ placeholder="请选择会员收费团可见分部"
|
|
|
+ style="width: 400px !important"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ :disabled="addDisabled"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in selects.branchs"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id.toString()"
|
|
|
+ ></el-option>
|
|
|
+ </select-all>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ label="免费乐团可售分部"
|
|
|
+ prop="freeFeeShowOrganId"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <select-all
|
|
|
+ v-model.trim="form.freeFeeShowOrganId"
|
|
|
+ filterable
|
|
|
+ placeholder="请选择会员收费团可见分部"
|
|
|
+ style="width: 400px !important"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ :disabled="addDisabled"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in selects.branchs"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id.toString()"
|
|
|
+ ></el-option>
|
|
|
+ </select-all>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- :disabled="pageDisabled || pageType == 'update'" -->
|
|
|
+ <el-form-item
|
|
|
+ v-if="tenantId == 1"
|
|
|
+ label="乐器置换可售分部"
|
|
|
+ prop="replacementShowOrganId"
|
|
|
+ :label-width="formLabelWidth"
|
|
|
+ >
|
|
|
+ <select-all
|
|
|
+ v-model.trim="form.replacementShowOrganId"
|
|
|
+ filterable
|
|
|
+ placeholder="请选择乐器置换可售分部"
|
|
|
+ style="width: 400px !important"
|
|
|
+ multiple
|
|
|
+ clearable
|
|
|
+ :disabled="addDisabled"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in selects.branchs"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id.toString()"
|
|
|
+ ></el-option>
|
|
|
+ </select-all>
|
|
|
+ </el-form-item>
|
|
|
+ <el-alert title="商品信息" :closable="false" class="alert" type="info" />
|
|
|
+ <el-form-item label="商品图片" prop="image" :label-width="formLabelWidth">
|
|
|
+ <image-cropper
|
|
|
+ :options="cropperOptions"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ :imgSize="2"
|
|
|
+ :imageUrl="form.image"
|
|
|
+ @crop-upload-success="cropSuccess"
|
|
|
+ bucket_name="mall"
|
|
|
+ />
|
|
|
+ <p style="color: red">请上传大小2M以内，格式为jpg、png、gif图片</p>
|
|
|
+ </el-form-item>
|
|
|
+ <br />
|
|
|
+ <el-form-item label="商品描述" prop="brief" :label-width="formLabelWidth">
|
|
|
+ <el-input
|
|
|
+ type="textarea"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ v-model.trim="form.brief"
|
|
|
+ style="width: 400px"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="商品详情" prop="desc" :label-width="formLabelWidth">
|
|
|
+ <el-input
|
|
|
+ type="textarea"
|
|
|
+ :disabled="addDisabled"
|
|
|
+ v-model.trim="form.desc"
|
|
|
+ style="width: 400px"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <span slot="footer" v-if="!addDisabled" class="dialog-footer">
|
|
|
+ <el-button @click="routeShopStatus = false">取 消</el-button>
|
|
|
+ <el-button @click="onShopSubmit('ruleForm')" type="primary"
|
|
|
+ >确 定</el-button
|
|
|
+ >
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import {
|
|
|
+ categoryListTree,
|
|
|
+ goodsQuery,
|
|
|
+ goodsAdd,
|
|
|
+ goodsUpdate,
|
|
|
+ goodsDelete,
|
|
|
+ updateGoodsStatus
|
|
|
+} from "@/api/businessManager";
|
|
|
+import cleanDeep from "clean-deep";
|
|
|
+import ImageCropper from "@/components/ImageCropper";
|
|
|
+import { goodsType } from "@/utils/searchArray";
|
|
|
+let validPrice = (rule, value, callback) => {
|
|
|
+ if ((value == "" && typeof value == "string") || value == null) {
|
|
|
+ callback(new Error("请输入金额"));
|
|
|
+ } else if (value < 0) {
|
|
|
+ callback(new Error("输入金额必须大于或等于0"));
|
|
|
+ } else if (value >= 100000) {
|
|
|
+ callback(new Error("输入金额必须小于100000"));
|
|
|
+ } else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+};
|
|
|
+let validStock = (rule, value, callback) => {
|
|
|
+ if ((value == "" && typeof value == "string") || value == null) {
|
|
|
+ callback(new Error("请输入库存"));
|
|
|
+ } else if (value < 0) {
|
|
|
+ callback(new Error("库存数量必须大于或等于0"));
|
|
|
+ } else {
|
|
|
+ callback();
|
|
|
+ }
|
|
|
+};
|
|
|
+export default {
|
|
|
+ props: ["addDisabled", "categoryList", "selectGoodsList", "tenantId"],
|
|
|
+ components: {
|
|
|
+ ImageCropper
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ goodsType: goodsType,
|
|
|
+ formLabelWidth: "160px",
|
|
|
+ form: {
|
|
|
+ sn: null,
|
|
|
+ brand: null,
|
|
|
+ supplyChannel: null,
|
|
|
+ name: null,
|
|
|
+ type: null,
|
|
|
+ organIdList: [],
|
|
|
+ goodsCategoryId: null,
|
|
|
+ specification: null,
|
|
|
+ marketPrice: null,
|
|
|
+ discountPrice: null,
|
|
|
+ groupPurchasePrice: null,
|
|
|
+ clientShow: null,
|
|
|
+ educationalShow: null,
|
|
|
+ musicGroupShow: null,
|
|
|
+ courseViewType: [],
|
|
|
+ stockWarning: null,
|
|
|
+ image: null,
|
|
|
+ complementGoodsIdList: null,
|
|
|
+ goodsList: [
|
|
|
+ {
|
|
|
+ id: null
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ brief: null,
|
|
|
+ desc: null,
|
|
|
+ replacementShow: null,
|
|
|
+ studentShowOrganId: null,
|
|
|
+ educationShowOrganId: null,
|
|
|
+ courseFeeShowOrganId: null,
|
|
|
+ memberFeeShowOrganId: null,
|
|
|
+ freeFeeShowOrganId: null,
|
|
|
+ replacementShowOrganId: null
|
|
|
+ },
|
|
|
+ goodsTree: [], // 选择商品列表
|
|
|
+ rules: {
|
|
|
+ sn: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入商品货号",
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ brand: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入品牌",
|
|
|
+ trigger: "blur"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ min: 2,
|
|
|
+ max: 30,
|
|
|
+ message: "长度在 2 到 30 个字符",
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ supplyChannel: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入备查货号",
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ name: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入商品名称",
|
|
|
+ trigger: "blur"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ min: 2,
|
|
|
+ max: 30,
|
|
|
+ message: "长度在 2 到 30 个字符",
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ type: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择商品分类",
|
|
|
+ trigger: "change"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ organIdList: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择所属分部",
|
|
|
+ trigger: "change"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ goodsCategoryId: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择商品类型",
|
|
|
+ trigger: "change"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ specification: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入商品型号",
|
|
|
+ trigger: "blur"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ min: 2,
|
|
|
+ max: 30,
|
|
|
+ message: "长度在 2 到 30 个字符",
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ marketPrice: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ validator: validPrice,
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ discountPrice: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ validator: validPrice,
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ groupPurchasePrice: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ validator: validPrice,
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ clientShow: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择学员是否展示",
|
|
|
+ trigger: "change"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ educationalShow: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择教务端是否展示",
|
|
|
+ trigger: "change"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ musicGroupShow: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择乐团是否展示",
|
|
|
+ trigger: "change"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ courseViewType: [
|
|
|
+ { required: true, message: "请选乐团收费模式", trigger: "change" }
|
|
|
+ ],
|
|
|
+ replacementShow: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择是否参与置换",
|
|
|
+ trigger: "change"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ stockWarning: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择是否库存预警",
|
|
|
+ trigger: "change"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ image: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择图片",
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ brief: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入商品描述",
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ desc: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入商品详情",
|
|
|
+ trigger: "blur"
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ cropperOptions: {
|
|
|
+ autoCrop: true, //是否默认生成截图框
|
|
|
+ autoCropWidth: 300, //默认生成截图框宽度
|
|
|
+ autoCropHeight: 300, //默认生成截图框高度
|
|
|
+ fixedBox: true, //是否固定截图框大小 不允许改变
|
|
|
+ previewsCircle: false, //预览图是否是圆形
|
|
|
+ title: "商品图片" //模态框上显示的标题
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {},
|
|
|
+ methods: {
|
|
|
+ onShopSubmit(formName) {
|
|
|
+ this.$refs[formName].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ let form = Object.assign({}, this.form);
|
|
|
+ let tempIds = [];
|
|
|
+ form.goodsList.forEach(item => {
|
|
|
+ if (item.id) {
|
|
|
+ tempIds.push(item.id);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ form.complementGoodsIdList = tempIds.join(",");
|
|
|
+ // form.courseViewType = form.courseViewType.join(",");
|
|
|
+ // form.organIdList = form.courseViewType.join(",");
|
|
|
+ if (form.studentShowOrganId) {
|
|
|
+ form.studentShowOrganId = form.studentShowOrganId.join(",");
|
|
|
+ }
|
|
|
+ if (form.educationShowOrganId) {
|
|
|
+ form.educationShowOrganId = form.educationShowOrganId.join(",");
|
|
|
+ }
|
|
|
+
|
|
|
+ if (form.courseFeeShowOrganId) {
|
|
|
+ form.courseFeeShowOrganId = form.courseFeeShowOrganId.join(",");
|
|
|
+ }
|
|
|
+ if (form.memberFeeShowOrganId) {
|
|
|
+ form.memberFeeShowOrganId = form.memberFeeShowOrganId.join(",");
|
|
|
+ }
|
|
|
+ if (form.freeFeeShowOrganId) {
|
|
|
+ form.freeFeeShowOrganId = form.freeFeeShowOrganId.join(",");
|
|
|
+ }
|
|
|
+ if (form.replacementShowOrganId) {
|
|
|
+ form.replacementShowOrganId = form.replacementShowOrganId.join(",");
|
|
|
+ }
|
|
|
+ if (
|
|
|
+ !form.studentShowOrganId &&
|
|
|
+ !form.educationShowOrganId &&
|
|
|
+ !form.courseFeeShowOrganId &&
|
|
|
+ !form.freeFeeShowOrganId &&
|
|
|
+ !form.replacementShowOrganId
|
|
|
+ ) {
|
|
|
+ this.$message.error("请至少选择一个可见分部");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ form.goodsList = null;
|
|
|
+ if (this.addType == "create" || this.addType == "copy") {
|
|
|
+ if (this.form.id) {
|
|
|
+ // 判断有没有Id，如果有则删除
|
|
|
+ delete this.form.id;
|
|
|
+ }
|
|
|
+ form.status = "NO"; // 默认上架
|
|
|
+ goodsAdd(cleanDeep(form)).then(res => {
|
|
|
+ this.messageTips("保存", res);
|
|
|
+ });
|
|
|
+ } else if (this.addType == "update") {
|
|
|
+ goodsUpdate(cleanDeep(form)).then(res => {
|
|
|
+ this.messageTips("保存", res);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ let isError = document.getElementsByClassName("is-error");
|
|
|
+ isError[0].scrollIntoView({
|
|
|
+ block: "center",
|
|
|
+ behavior: "smooth"
|
|
|
+ });
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ messageTips(title, res) {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.$message.success(title + "成功");
|
|
|
+ this.getList();
|
|
|
+ this.routeShopStatus = false;
|
|
|
+ } else {
|
|
|
+ this.$message.error(res.msg);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onGoodsChange() {
|
|
|
+ let selectGoodsList = this.selectGoodsList;
|
|
|
+ let goodsList = this.form.goodsList;
|
|
|
+ let tempIds = [];
|
|
|
+ goodsList.forEach(item => {
|
|
|
+ if (item.id) {
|
|
|
+ tempIds.push(item.id);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ selectGoodsList.forEach(item => {
|
|
|
+ if (tempIds.includes(item.id)) {
|
|
|
+ item.disabled = true;
|
|
|
+ } else {
|
|
|
+ item.disabled = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ this.calcPrice();
|
|
|
+ },
|
|
|
+ removeGoodsList(item) {
|
|
|
+ let tempId = item.id;
|
|
|
+ let selectGoodsList = this.selectGoodsList;
|
|
|
+ selectGoodsList.forEach(item => {
|
|
|
+ if (item.id == tempId) {
|
|
|
+ item.disabled = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ const index = this.form.goodsList.indexOf(item);
|
|
|
+ if (index !== -1) {
|
|
|
+ this.form.goodsList.splice(index, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ this.calcPrice();
|
|
|
+ },
|
|
|
+ addGoodsList() {
|
|
|
+ this.form.goodsList.push({
|
|
|
+ id: null
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ calcPrice() {
|
|
|
+ let selectGoodsList = this.selectGoodsList;
|
|
|
+ let form = this.form;
|
|
|
+ let goodsList = form.goodsList;
|
|
|
+ let tempIds = [];
|
|
|
+ goodsList.forEach(item => {
|
|
|
+ if (item.id) {
|
|
|
+ tempIds.push(item.id);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ let groupPurchasePrice = 0,
|
|
|
+ marketPrice = 0,
|
|
|
+ discountPrice = 0;
|
|
|
+ selectGoodsList.forEach(item => {
|
|
|
+ if (tempIds.includes(item.id)) {
|
|
|
+ groupPurchasePrice += item.groupPurchasePrice;
|
|
|
+ marketPrice += item.marketPrice;
|
|
|
+ discountPrice += item.discountPrice;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ form.groupPurchasePrice = Number(groupPurchasePrice.toFixed(2));
|
|
|
+ form.discountPrice = Number(discountPrice.toFixed(2));
|
|
|
+ form.marketPrice = Number(marketPrice.toFixed(2));
|
|
|
+ },
|
|
|
+ onFormClose(formName) {
|
|
|
+ // 关闭弹窗重置验证
|
|
|
+ this.$refs[formName].resetFields();
|
|
|
+ },
|
|
|
+ cropSuccess(data) {
|
|
|
+ this.form.image = data.data.url;
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.alert {
|
|
|
+ margin-bottom: 22px;
|
|
|
+}
|
|
|
+.shopImage {
|
|
|
+ width: 60px;
|
|
|
+ height: 60px;
|
|
|
+}
|
|
|
+.shopDesc {
|
|
|
+ max-height: 70px;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+
|
|
|
+.el-select__tags .el-tag.el-tag--info.el-tag--small.el-tag--light {
|
|
|
+ max-width: 95px;
|
|
|
+}
|
|
|
+.hiddenStart {
|
|
|
+ ::v-deep .el-form-item__label:before {
|
|
|
+ content: "" !important;
|
|
|
+ position: absolute;
|
|
|
+ color: transparent;
|
|
|
+ margin-right: 4px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.dialog-footer {
|
|
|
+ display: block;
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+</style>
|
