| 1 |
- {"remainingRequest":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\front\\item\\zyAdmin\\src\\pages\\marketing\\storeCombination\\create.vue?vue&type=style&index=0&id=4ed01a40&lang=scss&scoped=true","dependencies":[{"path":"D:\\front\\item\\zyAdmin\\src\\pages\\marketing\\storeCombination\\create.vue","mtime":1761614939036},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\css-loader\\index.js","mtime":1761614929364},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":1761614937403},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\postcss-loader\\src\\index.js","mtime":1761614935133},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\sass-loader\\dist\\cjs.js","mtime":1761614936391},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1761614927801},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js","mtime":1761614937402}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQouY29udGVudF93aWR0aCB7DQogIHdpZHRoOiA0NjBweDsNCn0NCi5ncmV5IHsNCiAgZm9udC1zaXplOiAxMnB4Ow0KICBjb2xvcjogIzk5OTsNCn0NCi5tYXhXIDo6di1kZWVwIC5pdnUtc2VsZWN0LWRyb3Bkb3duIHsNCiAgbWF4LXdpZHRoOiA2MDBweDsNCn0NCi5pdnUtdGFibGUtd3JhcHBlciB7DQogIGJvcmRlci1sZWZ0OiAxcHggc29saWQgI2RjZGVlMjsNCiAgYm9yZGVyLXRvcDogMXB4IHNvbGlkICNkY2RlZTI7DQp9DQoudGFiQm94X2ltZyB7DQogIHdpZHRoOiA1MHB4Ow0KICBoZWlnaHQ6IDUwcHg7DQp9DQoudGFiQm94X2ltZyBpbWcgew0KICB3aWR0aDogMTAwJTsNCiAgaGVpZ2h0OiAxMDAlOw0KfQ0KLnByaWNlQm94IHsNCiAgd2lkdGg6IDEwMCU7DQp9DQouZm9ybSB7DQogIC5waWNCb3ggew0KICAgIGRpc3BsYXk6IGlubGluZS1ibG9jazsNCiAgICBjdXJzb3I6IHBvaW50ZXI7DQogIH0NCiAgLnBpY3RydWUgew0KICAgIHdpZHRoOiA2MHB4Ow0KICAgIGhlaWdodDogNjBweDsNCiAgICBib3JkZXI6IDFweCBkb3R0ZWQgcmdiYSgwLCAwLCAwLCAwLjEpOw0KICAgIG1hcmdpbi1yaWdodDogMTVweDsNCiAgICBkaXNwbGF5OiBpbmxpbmUtYmxvY2s7DQogICAgcG9zaXRpb246IHJlbGF0aXZlOw0KICAgIGN1cnNvcjogcG9pbnRlcjsNCg0KICAgIGltZyB7DQogICAgICB3aWR0aDogMTAwJTsNCiAgICAgIGhlaWdodDogMTAwJTsNCiAgICB9DQogICAgLmJ0bmRlbCB7DQogICAgICBwb3NpdGlvbjogYWJzb2x1dGU7DQogICAgICB6LWluZGV4OiA5Ow0KICAgICAgd2lkdGg6IDIwcHggIWltcG9ydGFudDsNCiAgICAgIGhlaWdodDogMjBweCAhaW1wb3J0YW50Ow0KICAgICAgbGVmdDogNDZweDsNCiAgICAgIHRvcDogLTRweDsNCiAgICB9DQogIH0NCiAgLnVwTG9hZCB7DQogICAgd2lkdGg6IDU4cHg7DQogICAgaGVpZ2h0OiA1OHB4Ow0KICAgIGxpbmUtaGVpZ2h0OiA1OHB4Ow0KICAgIGJvcmRlcjogMXB4IGRvdHRlZCByZ2JhKDAsIDAsIDAsIDAuMSk7DQogICAgYm9yZGVyLXJhZGl1czogNHB4Ow0KICAgIGJhY2tncm91bmQ6IHJnYmEoMCwgMCwgMCwgMC4wMik7DQogICAgY3Vyc29yOiBwb2ludGVyOw0KICB9DQogIC5jb2wgew0KICAgIGNvbG9yOiAjMmQ4Y2YwOw0KICAgIGN1cnNvcjogcG9pbnRlcjsNCiAgfQ0KfQ0KLmFkZGZvbnQgew0KICBmb250LXNpemU6IDEycHg7DQogIGNvbG9yOiB2YXIoLS1wcmV2LWNvbG9yLXByaW1hcnkpOw0KICBtYXJnaW4tbGVmdDogMTRweDsNCiAgY3Vyc29yOiBwb2ludGVyOw0KICBtYXJnaW4tbGVmdDogMTBweDsNCiAgY3Vyc29yOiBwb2ludGVyOw0KfQ0K"},{"version":3,"sources":["create.vue"],"names":[],"mappings":";AAs9BA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"create.vue","sourceRoot":"src/pages/marketing/storeCombination","sourcesContent":["<template>\r\n <div>\r\n <pages-header\r\n ref=\"pageHeader\"\r\n :title=\"$route.params.id ? '编辑拼团商品' : '添加拼团商品'\"\r\n :backUrl=\"$routeProStr + '/marketing/store_combination/index'\"\r\n ></pages-header>\r\n <el-card :bordered=\"false\" shadow=\"never\" class=\"mt16\">\r\n <el-row class=\"mt30 acea-row row-middle row-center\">\r\n <el-col :span=\"20\">\r\n <steps :stepList=\"stepList\" :isActive=\"current\"></steps>\r\n </el-col>\r\n <el-col :span=\"23\" v-loading=\"spinShow\">\r\n <el-form\r\n class=\"form mt30\"\r\n ref=\"formValidate\"\r\n :model=\"formValidate\"\r\n :rules=\"ruleValidate\"\r\n @on-validate=\"validate\"\r\n :label-width=\"labelWidth\"\r\n :label-position=\"labelPosition\"\r\n @submit.native.prevent\r\n >\r\n <el-form-item label=\"选择商品：\" prop=\"image_input\" v-if=\"current === 0\">\r\n <div class=\"picBox\" v-db-click @click=\"changeGoods\">\r\n <div class=\"pictrue\" v-if=\"formValidate.image\">\r\n <img v-lazy=\"formValidate.image\" />\r\n </div>\r\n <div class=\"upLoad acea-row row-center-wrapper\" v-else>\r\n <i class=\"el-icon-goods\" style=\"font-size: 24px\"></i>\r\n </div>\r\n </div>\r\n </el-form-item>\r\n <el-row v-show=\"current === 1\">\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"商品主图：\" prop=\"image\">\r\n <div class=\"picBox\" v-db-click @click=\"modalPicTap('dan', 'danFrom')\">\r\n <div class=\"pictrue\" v-if=\"formValidate.image\">\r\n <img v-lazy=\"formValidate.image\" />\r\n </div>\r\n <div class=\"upLoad acea-row row-center-wrapper\" v-else>\r\n <i class=\"el-icon-picture-outline\" style=\"font-size: 24px\"></i>\r\n </div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"商品轮播图：\" prop=\"images\">\r\n <div class=\"acea-row\">\r\n <div\r\n class=\"pictrue\"\r\n v-for=\"(item, index) in formValidate.images\"\r\n :key=\"index\"\r\n draggable=\"true\"\r\n @dragstart=\"handleDragStart($event, item)\"\r\n @dragover.prevent=\"handleDragOver($event, item)\"\r\n @dragenter=\"handleDragEnter($event, item)\"\r\n @dragend=\"handleDragEnd($event, item)\"\r\n >\r\n <img v-lazy=\"item\" />\r\n <i class=\"el-icon-circle-close btndel\" v-db-click @click=\"handleRemove(index)\"></i>\r\n </div>\r\n <div\r\n v-if=\"formValidate.images.length < 10\"\r\n class=\"upLoad acea-row row-center-wrapper\"\r\n v-db-click\r\n @click=\"modalPicTap('duo')\"\r\n >\r\n <i class=\"el-icon-picture-outline\" style=\"font-size: 24px\"></i>\r\n </div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-col v-bind=\"grid\">\r\n <el-form-item label=\"拼团名称：\" prop=\"title\" label-for=\"title\">\r\n <el-input\r\n elearable\r\n placeholder=\"请输入拼团名称\"\r\n v-model=\"formValidate.title\"\r\n class=\"content_width\"\r\n maxlength=\"80\"\r\n show-word-limit\r\n />\r\n </el-form-item>\r\n </el-col>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-col v-bind=\"grid\">\r\n <el-form-item label=\"拼团简介：\" prop=\"info\" label-for=\"info\">\r\n <el-input\r\n placeholder=\"请输入拼团简介\"\r\n type=\"textarea\"\r\n :rows=\"4\"\r\n v-model=\"formValidate.info\"\r\n class=\"content_width\"\r\n maxlength=\"100\"\r\n show-word-limit\r\n />\r\n </el-form-item>\r\n </el-col>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"拼团时间：\" prop=\"section_time\">\r\n <div>\r\n <el-date-picker\r\n clearable\r\n :editable=\"false\"\r\n type=\"datetimerange\"\r\n format=\"yyyy-MM-dd HH:mm\"\r\n value-format=\"yyyy-MM-dd HH:mm\"\r\n range-separator=\"-\"\r\n start-placeholder=\"开始日期\"\r\n end-placeholder=\"结束日期\"\r\n @change=\"onchangeTime\"\r\n class=\"content_width\"\r\n v-model=\"formValidate.section_time\"\r\n ></el-date-picker>\r\n <div class=\"grey\">设置活动开启结束时间，用户可以在设置时间内发起参与拼团</div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\" v-if=\"formValidate.virtual_type == 0\">\r\n <el-form-item label=\"物流方式：\" prop=\"logistics\">\r\n <el-checkbox-group v-model=\"formValidate.logistics\">\r\n <el-checkbox label=\"1\">快递</el-checkbox>\r\n <el-checkbox label=\"2\">到店</el-checkbox>\r\n </el-checkbox-group>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\" v-if=\"formValidate.virtual_type == 0\">\r\n <el-form-item label=\"运费设置：\" :prop=\"formValidate.freight != 1 ? 'freight' : ''\">\r\n <el-radio-group v-model=\"formValidate.freight\">\r\n <el-radio :label=\"2\">固定邮费</el-radio>\r\n <el-radio :label=\"3\">运费模板</el-radio>\r\n </el-radio-group>\r\n </el-form-item>\r\n </el-col>\r\n <el-col\r\n :span=\"24\"\r\n v-if=\"formValidate.freight != 3 && formValidate.freight != 1 && formValidate.virtual_type == 0\"\r\n >\r\n <el-form-item label=\"\">\r\n <div class=\"acea-row\">\r\n <el-input-number\r\n :controls=\"false\"\r\n :min=\"0\"\r\n :max=\"9999999999\"\r\n v-model=\"formValidate.postage\"\r\n placeholder=\"请输入金额\"\r\n class=\"content_width input-number-unit-class\"\r\n class-unit=\"元\"\r\n />\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\" v-if=\"formValidate.freight == 3 && formValidate.virtual_type == 0\">\r\n <el-form-item label=\"\" prop=\"temp_id\">\r\n <div class=\"acea-row\">\r\n <el-select\r\n v-model=\"formValidate.temp_id\"\r\n clearable\r\n placeholder=\"请选择运费模板\"\r\n class=\"content_width\"\r\n >\r\n <el-option\r\n v-for=\"(item, index) in templateList\"\r\n :value=\"item.id\"\r\n :key=\"index\"\r\n :label=\"item.name\"\r\n ></el-option>\r\n </el-select>\r\n <span class=\"addfont\" v-db-click @click=\"freight\">新增运费模板</span>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"拼团时效：\" prop=\"effective_time\">\r\n <div>\r\n <el-input-number\r\n :controls=\"false\"\r\n placeholder=\"请输入拼团时效\"\r\n class=\"content_width input-number-unit-class\"\r\n class-unit=\"小时\"\r\n v-model=\"formValidate.effective_time\"\r\n />\r\n <div class=\"grey\">\r\n 用户发起拼团后开始计时，需在设置时间内邀请到规定好友人数参团，超过时效时间，则系统判定拼团失败，自动发起退款\r\n </div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"拼团人数：\" prop=\"people\">\r\n <div>\r\n <el-input-number\r\n :controls=\"false\"\r\n :min=\"2\"\r\n :max=\"10000\"\r\n placeholder=\"请输入拼团人数\"\r\n :precision=\"0\"\r\n v-model=\"formValidate.people\"\r\n class=\"content_width input-number-unit-class\"\r\n class-unit=\"人\"\r\n />\r\n <div class=\"grey\">单次拼团需要参与的用户数</div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"虚拟成团补齐人数：\" prop=\"virtualPeople\">\r\n <div>\r\n <el-input-number\r\n :controls=\"false\"\r\n placeholder=\"设置虚拟成团的补齐人数\"\r\n :precision=\"0\"\r\n :max=\"10000\"\r\n :min=\"0\"\r\n v-model=\"formValidate.virtualPeople\"\r\n class=\"content_width input-number-unit-class\"\r\n class-unit=\"人\"\r\n />\r\n <div class=\"grey\">\r\n 设置虚拟成团的补齐人数，如：5人团设置补齐2人，当团队成员大于等于3人时，拼团结束时自动补齐剩余最多2个位置，不开启虚拟成团请设置为0\r\n </div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"单位：\" prop=\"unit_name\" label-for=\"unit_name\">\r\n <el-input clearable placeholder=\"请输入单位\" v-model=\"formValidate.unit_name\" class=\"content_width\" />\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"总购买数量限制：\" prop=\"num\">\r\n <div>\r\n <el-input-number\r\n :controls=\"false\"\r\n :min=\"1\"\r\n placeholder=\"请输入总数量限制\"\r\n :precision=\"0\"\r\n :max=\"10000\"\r\n v-model=\"formValidate.num\"\r\n class=\"content_width input-number-unit-class\"\r\n :class-unit=\"formValidate.unit_name || '件'\"\r\n />\r\n <div class=\"grey\">\r\n 该商品活动期间内，用户可购买的最大数量。例如设置为4，表示本次活动有效期内，每个用户最多可购买4件\r\n </div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"单次购买数量限制：\" prop=\"once_num\">\r\n <div>\r\n <el-input-number\r\n :controls=\"false\"\r\n :min=\"1\"\r\n placeholder=\"请输入单次购买数量限制\"\r\n :precision=\"0\"\r\n :max=\"10000\"\r\n v-model=\"formValidate.once_num\"\r\n class=\"content_width input-number-unit-class\"\r\n :class-unit=\"formValidate.unit_name || '件'\"\r\n />\r\n <div class=\"grey\">\r\n 用户参与拼团时，一次购买最大数量限制。例如设置为2，表示每次参与拼团时，用户一次购买数量最大可选择2个\r\n </div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"团长返佣比例：\" prop=\"head_commission\">\r\n <div>\r\n <el-input-number\r\n :controls=\"false\"\r\n :min=\"0\"\r\n :max=\"100\"\r\n placeholder=\"团长返佣比例\"\r\n :precision=\"0\"\r\n v-model=\"formValidate.head_commission\"\r\n class=\"content_width input-number-unit-class\"\r\n class-unit=\"%\"\r\n />\r\n <div class=\"grey\">\r\n 拼团成功后，如果团长是分销员，则在订单确认收货时会给团长返一定的佣金，佣金比例是实际支付金额的0-100%\r\n </div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"拼团是否参与分销：\" props=\"is_commission\" label-for=\"is_commission\">\r\n <div>\r\n <el-switch\r\n class=\"defineSwitch\"\r\n :active-value=\"1\"\r\n :inactive-value=\"0\"\r\n v-model=\"formValidate.is_commission\"\r\n size=\"large\"\r\n active-text=\"开启\"\r\n inactive-text=\"关闭\"\r\n >\r\n </el-switch>\r\n <div class=\"grey\">拼团商品是否参与商城分销返佣</div>\r\n </div>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"排序：\">\r\n <el-input-number\r\n :controls=\"false\"\r\n placeholder=\"请输入排序\"\r\n :precision=\"0\"\r\n :max=\"10000\"\r\n :min=\"0\"\r\n v-model=\"formValidate.sort\"\r\n class=\"content_width\"\r\n />\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"热门推荐：\" props=\"is_hot\" label-for=\"is_hot\">\r\n <el-switch\r\n class=\"defineSwitch\"\r\n :active-value=\"1\"\r\n :inactive-value=\"0\"\r\n v-model=\"formValidate.is_host\"\r\n size=\"large\"\r\n active-text=\"开启\"\r\n inactive-text=\"关闭\"\r\n >\r\n </el-switch>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"活动状态：\" props=\"is_show\" label-for=\"is_show\">\r\n <el-switch\r\n class=\"defineSwitch\"\r\n :active-value=\"1\"\r\n :inactive-value=\"0\"\r\n v-model=\"formValidate.is_show\"\r\n size=\"large\"\r\n active-text=\"开启\"\r\n inactive-text=\"关闭\"\r\n >\r\n </el-switch>\r\n </el-form-item>\r\n </el-col>\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"规格选择：\">\r\n <el-table\r\n ref=\"multipleTable\"\r\n :data=\"specsData\"\r\n :row-key=\"getRowKeys\"\r\n border\r\n @selection-change=\"changeCheckbox\"\r\n >\r\n <el-table-column type=\"selection\" :reserve-selection=\"true\" width=\"55\"> </el-table-column>\r\n <el-table-column\r\n :label=\"item.title\"\r\n :min-width=\"item.minWidth\"\r\n v-for=\"(item, index) in columns\"\r\n :key=\"index\"\r\n >\r\n <template slot-scope=\"scope\">\r\n <template v-if=\"item.key\">\r\n <div>\r\n <span>{{ scope.row[item.key] }}</span>\r\n </div>\r\n </template>\r\n <template v-else-if=\"item.slot === 'pic'\">\r\n <div\r\n class=\"acea-row row-middle row-center-wrapper\"\r\n v-db-click\r\n @click=\"modalPicTap('dan', 'danTable', scope.$index)\"\r\n >\r\n <div class=\"pictrue pictrueTab\" v-if=\"scope.row.pic\">\r\n <img v-lazy=\"scope.row.pic\" />\r\n </div>\r\n <div class=\"upLoad pictrueTab acea-row row-center-wrapper\" v-else>\r\n <i class=\"el-icon-picture-outline\" style=\"font-size: 24px\"></i>\r\n </div>\r\n </div>\r\n </template>\r\n <template v-else-if=\"item.slot === 'price'\">\r\n <el-input-number\r\n :controls=\"false\"\r\n v-model=\"scope.row.price\"\r\n :min=\"0\"\r\n :precision=\"2\"\r\n class=\"priceBox\"\r\n :active-change=\"false\"\r\n ></el-input-number>\r\n </template>\r\n <template v-if=\"item.slot === 'quota'\">\r\n <el-input-number\r\n :controls=\"false\"\r\n v-model=\"scope.row.quota\"\r\n :min=\"1\"\r\n active-change\r\n class=\"priceBox\"\r\n ></el-input-number>\r\n </template>\r\n </template>\r\n </el-table-column>\r\n </el-table>\r\n </el-form-item>\r\n </el-col>\r\n </el-row>\r\n <el-row v-show=\"current === 2\">\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"内容：\">\r\n <WangEditor\r\n style=\"width: 90%\"\r\n :content=\"formValidate.description\"\r\n @editorContent=\"getEditorContent\"\r\n ></WangEditor>\r\n </el-form-item>\r\n </el-col>\r\n </el-row>\r\n <el-form-item>\r\n <el-button\r\n class=\"submission\"\r\n v-db-click\r\n @click=\"step\"\r\n :disabled=\"($route.params.id && current === 1) || current === 0\"\r\n >上一步</el-button\r\n >\r\n <el-button\r\n type=\"primary\"\r\n :disabled=\"submitOpen && current === 2\"\r\n class=\"submission\"\r\n v-db-click\r\n @click=\"next('formValidate')\"\r\n >{{ current === 2 ? '提交' : '下一步' }}</el-button\r\n >\r\n </el-form-item>\r\n </el-form>\r\n </el-col>\r\n </el-row>\r\n </el-card>\r\n <!-- 选择商品-->\r\n <el-dialog :visible.sync=\"modals\" title=\"商品列表\" class=\"paymentFooter\" width=\"1000px\">\r\n <goods-list ref=\"goodslist\" @getProductId=\"getProductId\"></goods-list>\r\n </el-dialog>\r\n <!-- 上传图片-->\r\n <el-dialog :visible.sync=\"modalPic\" width=\"950px\" title=\"上传商品图\" :close-on-click-modal=\"false\">\r\n <uploadPictures\r\n :isChoice=\"isChoice\"\r\n @getPic=\"getPic\"\r\n @getPicD=\"getPicD\"\r\n :gridBtn=\"gridBtn\"\r\n :gridPic=\"gridPic\"\r\n v-if=\"modalPic\"\r\n ></uploadPictures>\r\n </el-dialog>\r\n <!-- 运费模板-->\r\n <freight-template ref=\"template\" @addSuccess=\"productGetTemplate\"></freight-template>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport { mapState } from 'vuex';\r\nimport goodsList from '@/components/goodsList/index';\r\nimport WangEditor from '@/components/wangEditor/index.vue';\r\nimport uploadPictures from '@/components/uploadPictures';\r\nimport { combinationInfoApi, combinationCreatApi, productAttrsApi } from '@/api/marketing';\r\nimport { productGetTemplateApi } from '@/api/product';\r\nimport freightTemplate from '@/components/freightTemplate/index';\r\nimport steps from '@/components/steps/index';\r\n\r\nexport default {\r\n name: 'storeCombinationCreate',\r\n components: {\r\n goodsList,\r\n uploadPictures,\r\n WangEditor,\r\n freightTemplate,\r\n steps,\r\n },\r\n data() {\r\n return {\r\n submitOpen: false,\r\n spinShow: false,\r\n isChoice: '',\r\n current: 0,\r\n modalPic: false,\r\n grid: {\r\n xl: 12,\r\n lg: 20,\r\n md: 24,\r\n sm: 24,\r\n xs: 24,\r\n },\r\n grid2: {\r\n xl: 8,\r\n lg: 8,\r\n md: 12,\r\n sm: 24,\r\n xs: 24,\r\n },\r\n gridPic: {\r\n xl: 6,\r\n lg: 8,\r\n md: 12,\r\n sm: 12,\r\n xs: 12,\r\n },\r\n gridBtn: {\r\n xl: 4,\r\n lg: 8,\r\n md: 8,\r\n sm: 8,\r\n xs: 8,\r\n },\r\n stepList: ['选择拼团商品', '填写基础信息', '修改商品详情'],\r\n myConfig: {\r\n autoHeightEnabled: false, // 编辑器不自动被内容撑高\r\n initialFrameHeight: 500, // 初始容器高度\r\n initialFrameWidth: '100%', // 初始容器宽度\r\n UEDITOR_HOME_URL: '/UEditor/',\r\n serverUrl: '',\r\n },\r\n modals: false,\r\n modal_loading: false,\r\n images: [],\r\n templateList: [],\r\n columns: [],\r\n specsData: [],\r\n picTit: '',\r\n tableIndex: 0,\r\n formValidate: {\r\n images: [],\r\n info: '',\r\n title: '',\r\n image: '',\r\n unit_name: '',\r\n price: 0,\r\n effective_time: 24,\r\n stock: 1,\r\n sales: 0,\r\n sort: 0,\r\n is_postage: 0,\r\n is_commission: 0,\r\n is_host: 0,\r\n is_show: 0,\r\n section_time: [],\r\n description: '',\r\n id: 0,\r\n product_id: 0,\r\n people: 2,\r\n once_num: 1,\r\n num: 1,\r\n temp_id: '',\r\n attrs: [],\r\n items: [],\r\n virtual: 100,\r\n virtualPeople: 0,\r\n head_commission: 0,\r\n logistics: ['1'], //选择物流方式\r\n freight: 2, //运费设置\r\n postage: 1, //设置运费金额\r\n },\r\n ruleValidate: {\r\n image: [{ required: true, message: '请选择主图', trigger: 'change' }],\r\n images: [\r\n {\r\n required: true,\r\n type: 'array',\r\n message: '请选择主图',\r\n trigger: 'change',\r\n },\r\n {\r\n type: 'array',\r\n min: 1,\r\n message: 'Choose two hobbies at best',\r\n trigger: 'change',\r\n },\r\n ],\r\n title: [{ required: true, message: '请输入拼团名称', trigger: 'blur' }],\r\n info: [{ required: true, message: '请输入拼团简介', trigger: 'blur' }],\r\n section_time: [\r\n {\r\n required: true,\r\n type: 'array',\r\n message: '请选择活动时间',\r\n trigger: 'change',\r\n },\r\n ],\r\n unit_name: [{ required: true, message: '请输入单位', trigger: 'blur' }],\r\n price: [\r\n {\r\n required: true,\r\n type: 'number',\r\n message: '请输入拼团价',\r\n trigger: 'blur',\r\n },\r\n ],\r\n cost: [\r\n {\r\n required: true,\r\n type: 'number',\r\n message: '请输入成本价',\r\n trigger: 'blur',\r\n },\r\n ],\r\n stock: [\r\n {\r\n required: true,\r\n type: 'number',\r\n message: '请输入库存',\r\n trigger: 'blur',\r\n },\r\n ],\r\n give_integral: [\r\n {\r\n required: true,\r\n type: 'number',\r\n message: '请输入赠送积分',\r\n trigger: 'blur',\r\n },\r\n ],\r\n effective_time: [\r\n {\r\n required: true,\r\n type: 'number',\r\n message: '请输入拼团时效(单位 小时)',\r\n trigger: 'blur',\r\n },\r\n ],\r\n people: [\r\n {\r\n required: true,\r\n type: 'number',\r\n message: '请输入拼团人数',\r\n trigger: 'blur',\r\n },\r\n ],\r\n num: [\r\n {\r\n required: true,\r\n type: 'number',\r\n message: '请输入购买数量限制',\r\n trigger: 'blur',\r\n },\r\n ],\r\n once_num: [\r\n {\r\n required: true,\r\n type: 'number',\r\n message: '请输入单次购买数量限制',\r\n trigger: 'blur',\r\n },\r\n ],\r\n virtualPeople: [\r\n {\r\n required: true,\r\n type: 'number',\r\n message: '请输入虚拟成团补齐人数',\r\n trigger: 'blur',\r\n },\r\n ],\r\n temp_id: [\r\n {\r\n required: true,\r\n message: '请选择运费模板',\r\n trigger: 'change',\r\n type: 'number',\r\n },\r\n ],\r\n },\r\n copy: 0,\r\n description: '',\r\n };\r\n },\r\n computed: {\r\n ...mapState('media', ['isMobile']),\r\n labelWidth() {\r\n return this.isMobile ? undefined : '155px';\r\n },\r\n labelPosition() {\r\n return this.isMobile ? 'top' : 'right';\r\n },\r\n },\r\n mounted() {\r\n if (this.$route.params.id) {\r\n this.copy = this.$route.params.copy;\r\n this.current = 1;\r\n this.getInfo();\r\n }\r\n this.productGetTemplate();\r\n },\r\n methods: {\r\n changePrice(e, index) {\r\n this.$set(this.specsData[index], 'price', e);\r\n },\r\n getEditorContent(data) {\r\n this.description = data;\r\n },\r\n // 添加运费模板\r\n freight() {\r\n this.$refs.template.id = 0;\r\n this.$refs.template.isTemplate = true;\r\n },\r\n // 拼团规格；\r\n productAttrs(row) {\r\n let that = this;\r\n productAttrsApi(row.id, 3)\r\n .then((res) => {\r\n let data = res.data.info;\r\n let selection = {\r\n type: 'selection',\r\n width: 60,\r\n align: 'center',\r\n };\r\n that.specsData = data.attrs;\r\n that.specsData.forEach(function (item, index) {\r\n that.$set(that.specsData[index], 'id', index);\r\n });\r\n that.formValidate.items = data.items;\r\n that.columns = data.header;\r\n // that.columns.unshift(selection);\r\n })\r\n .catch((res) => {\r\n that.$message.error(res.msg);\r\n });\r\n },\r\n // 多选\r\n changeCheckbox(selection) {\r\n this.formValidate.attrs = selection;\r\n },\r\n // 获取运费模板；\r\n productGetTemplate() {\r\n productGetTemplateApi().then((res) => {\r\n this.templateList = res.data;\r\n });\r\n },\r\n // 表单验证\r\n validate(prop, status, error) {\r\n if (status === false) {\r\n this.$message.error(error);\r\n }\r\n },\r\n // 商品id\r\n getProductId(row) {\r\n this.modal_loading = false;\r\n this.modals = false;\r\n setTimeout(() => {\r\n this.formValidate = {\r\n images: row.slider_image,\r\n info: row.store_info,\r\n title: row.store_name,\r\n image: row.image,\r\n unit_name: row.unit_name,\r\n price: 0, // 不取商品中的原价\r\n effective_time: 24,\r\n stock: row.stock,\r\n sales: row.sales,\r\n sort: row.sort,\r\n is_postage: row.is_postage,\r\n is_commission: 0,\r\n is_host: row.is_hot,\r\n is_show: 0,\r\n section_time: [],\r\n description: '', // 不取商品中的\r\n id: 0,\r\n people: 2,\r\n num: 1,\r\n once_num: 1,\r\n product_id: row.id,\r\n temp_id: row.temp_id,\r\n virtual: 100,\r\n virtualPeople: 0,\r\n logistics: row.logistics, //选择物流方式\r\n freight: row.freight, //运费设置\r\n postage: row.postage, //设置运费金额\r\n custom_form: row.custom_form, //自定义表单数据\r\n virtual_type: row.virtual_type, //虚拟商品类型\r\n head_commission: 0,\r\n };\r\n this.productAttrs(row);\r\n }, 500);\r\n },\r\n cancel() {\r\n this.modals = false;\r\n },\r\n // 具体日期\r\n onchangeTime(e) {\r\n this.formValidate.section_time = e;\r\n },\r\n // 详情\r\n getInfo() {\r\n this.spinShow = true;\r\n combinationInfoApi(this.$route.params.id)\r\n .then(async (res) => {\r\n let that = this;\r\n let info = res.data.info;\r\n let selection = {\r\n type: 'selection',\r\n width: 60,\r\n align: 'center',\r\n };\r\n this.formValidate = info;\r\n this.formValidate.virtualPeople = parseInt(\r\n this.formValidate.people - this.formValidate.people * (this.formValidate.virtual / 100),\r\n );\r\n this.$set(this.formValidate, 'items', info.attrs.items);\r\n this.columns = info.attrs.header;\r\n // this.columns.unshift(selection);\r\n this.specsData = info.attrs.value;\r\n that.specsData.forEach(function (item, index) {\r\n that.$set(that.specsData[index], 'id', index);\r\n });\r\n let data = info.attrs;\r\n let attr = [];\r\n for (let index in info.attrs.value) {\r\n if (info.attrs.value[index]._checked) {\r\n attr.push(info.attrs.value[index]);\r\n }\r\n }\r\n that.formValidate.attrs = attr;\r\n attr.forEach((row) => {\r\n that.$refs.multipleTable.toggleRowSelection(row, true);\r\n });\r\n this.spinShow = false;\r\n })\r\n .catch((res) => {\r\n this.spinShow = false;\r\n this.$message.error(res.msg);\r\n });\r\n },\r\n getRowKeys(row) {\r\n return row.id;\r\n },\r\n // 下一步\r\n next(name) {\r\n let that = this;\r\n if (this.current === 2) {\r\n this.formValidate.description = this.description;\r\n this.$refs[name].validate((valid) => {\r\n if (valid) {\r\n if (this.copy == 1) this.formValidate.copy = 1;\r\n this.formValidate.id = Number(this.$route.params.id) || 0;\r\n this.submitOpen = true;\r\n this.formValidate.virtual = parseInt(\r\n ((this.formValidate.people - this.formValidate.virtualPeople) / this.formValidate.people) * 100,\r\n );\r\n combinationCreatApi(this.formValidate)\r\n .then(async (res) => {\r\n this.submitOpen = false;\r\n this.$message.success(res.msg);\r\n setTimeout(() => {\r\n this.$router.push({\r\n path: this.$routeProStr + '/marketing/store_combination/index',\r\n });\r\n }, 500);\r\n })\r\n .catch((res) => {\r\n this.submitOpen = false;\r\n this.$message.error(res.msg);\r\n });\r\n } else {\r\n return false;\r\n }\r\n });\r\n } else if (this.current === 1) {\r\n this.$refs[name].validate((valid) => {\r\n if (valid) {\r\n if (that.formValidate.people < 2) {\r\n return that.$message.error('拼团人数必须大于2');\r\n }\r\n if (that.formValidate.num < 0) {\r\n return that.$message.error('购买数量限制必须大于0');\r\n }\r\n if (that.formValidate.once_num < 0) {\r\n return that.$message.error('单次购买数量限制必须大于0');\r\n }\r\n if (!that.formValidate.attrs) {\r\n return that.$message.error('请选择属性规格');\r\n } else {\r\n for (let index in that.formValidate.attrs) {\r\n if (that.formValidate.attrs[index].quota <= 0) {\r\n return that.$message.error('拼团限量必须大于0');\r\n }\r\n if (this.formValidate.attrs[index].quota > this.formValidate.attrs[index]['stock']) {\r\n return this.$message.error('拼团限量不能超过规格库存');\r\n }\r\n }\r\n }\r\n this.current += 1;\r\n } else {\r\n return this.$message.warning('请完善您的信息');\r\n }\r\n });\r\n } else {\r\n if (this.formValidate.image) {\r\n this.current += 1;\r\n } else {\r\n this.$message.warning('请选择商品');\r\n }\r\n }\r\n },\r\n // 上一步\r\n step() {\r\n this.current--;\r\n },\r\n // 内容\r\n getContent(val) {\r\n this.formValidate.description = val;\r\n },\r\n // 点击商品图\r\n modalPicTap(tit, picTit, index) {\r\n this.modalPic = true;\r\n this.isChoice = tit === 'dan' ? '单选' : '多选';\r\n this.picTit = picTit;\r\n this.tableIndex = index;\r\n },\r\n // 获取单张图片信息\r\n getPic(pc) {\r\n switch (this.picTit) {\r\n case 'danFrom':\r\n this.formValidate.image = pc.att_dir;\r\n break;\r\n default:\r\n if (!!this.formValidate.attrs && this.formValidate.attrs.length) {\r\n this.$set(this.specsData[this.tableIndex], '_checked', true);\r\n }\r\n this.specsData[this.tableIndex].pic = pc.att_dir;\r\n }\r\n this.modalPic = false;\r\n },\r\n // 获取多张图信息\r\n getPicD(pc) {\r\n this.images = pc;\r\n this.images.map((item) => {\r\n this.formValidate.images.push(item.att_dir);\r\n this.formValidate.images = this.formValidate.images.splice(0, 10);\r\n });\r\n this.modalPic = false;\r\n },\r\n handleRemove(i) {\r\n this.images.splice(i, 1);\r\n this.formValidate.images.splice(i, 1);\r\n },\r\n // 选择商品\r\n changeGoods() {\r\n this.modals = true;\r\n this.$nextTick((e) => {\r\n this.$refs.goodslist.formValidate.is_show = -1;\r\n this.$refs.goodslist.formValidate.type = 3;\r\n this.$refs.goodslist.getList();\r\n this.$refs.goodslist.goodsCategory();\r\n });\r\n },\r\n // 移动\r\n handleDragStart(e, item) {\r\n this.dragging = item;\r\n },\r\n handleDragEnd(e, item) {\r\n this.dragging = null;\r\n },\r\n // 首先把div变成可以放置的元素，即重写dragenter/dragover\r\n handleDragOver(e) {\r\n e.dataTransfer.dropEffect = 'move';\r\n },\r\n handleDragEnter(e, item) {\r\n e.dataTransfer.effectAllowed = 'move';\r\n if (item === this.dragging) {\r\n return;\r\n }\r\n const newItems = [...this.formValidate.images];\r\n const src = newItems.indexOf(this.dragging);\r\n const dst = newItems.indexOf(item);\r\n newItems.splice(dst, 0, ...newItems.splice(src, 1));\r\n this.formValidate.images = newItems;\r\n },\r\n },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.content_width {\r\n width: 460px;\r\n}\r\n.grey {\r\n font-size: 12px;\r\n color: #999;\r\n}\r\n.maxW ::v-deep .ivu-select-dropdown {\r\n max-width: 600px;\r\n}\r\n.ivu-table-wrapper {\r\n border-left: 1px solid #dcdee2;\r\n border-top: 1px solid #dcdee2;\r\n}\r\n.tabBox_img {\r\n width: 50px;\r\n height: 50px;\r\n}\r\n.tabBox_img img {\r\n width: 100%;\r\n height: 100%;\r\n}\r\n.priceBox {\r\n width: 100%;\r\n}\r\n.form {\r\n .picBox {\r\n display: inline-block;\r\n cursor: pointer;\r\n }\r\n .pictrue {\r\n width: 60px;\r\n height: 60px;\r\n border: 1px dotted rgba(0, 0, 0, 0.1);\r\n margin-right: 15px;\r\n display: inline-block;\r\n position: relative;\r\n cursor: pointer;\r\n\r\n img {\r\n width: 100%;\r\n height: 100%;\r\n }\r\n .btndel {\r\n position: absolute;\r\n z-index: 9;\r\n width: 20px !important;\r\n height: 20px !important;\r\n left: 46px;\r\n top: -4px;\r\n }\r\n }\r\n .upLoad {\r\n width: 58px;\r\n height: 58px;\r\n line-height: 58px;\r\n border: 1px dotted rgba(0, 0, 0, 0.1);\r\n border-radius: 4px;\r\n background: rgba(0, 0, 0, 0.02);\r\n cursor: pointer;\r\n }\r\n .col {\r\n color: #2d8cf0;\r\n cursor: pointer;\r\n }\r\n}\r\n.addfont {\r\n font-size: 12px;\r\n color: var(--prev-color-primary);\r\n margin-left: 14px;\r\n cursor: pointer;\r\n margin-left: 10px;\r\n cursor: pointer;\r\n}\r\n</style>\r\n"]}]}
|
