index.vue 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766
  1. <template>
  2. <view class="container">
  3. <view class="step_one" v-if="step == 1">
  4. <view class="input_content">
  5. <view class="input_content_textarea">
  6. <textarea v-model="setFormData.store_name" placeholder="请输入商品名称" placeholder-class="placeholderStyle" maxlength="60" />
  7. <view>
  8. <text v-if="setFormData.store_name">{{ setFormData.store_name.length }}</text>
  9. <text v-else>0</text>
  10. /60
  11. </view>
  12. </view>
  13. <view class="photo_count">
  14. <text class="photo_size">建议:图片尺寸为750*750px</text>
  15. <view class="input_content_photo">
  16. <view class="input_content_photo_adPh" v-for="(item, index) in setFormData.imageList" :key="index">
  17. <image :src="item" class="myimg2 photos"></image>
  18. <view class="input_content_photo_adPh_jiao" @click="deleteImage(index)"><image src="../static/images/close.png" mode=""></image></view>
  19. </view>
  20. <view v-if="setFormData.imageList.length < 9" class="input_content_photo_adPh addBtn" @click="clk">
  21. <view><image src="../static/images/creamer.png" mode="widthFix"></image></view>
  22. <view>添加图片</view>
  23. </view>
  24. </view>
  25. </view>
  26. <view class="input_content_describe">
  27. <view class="input_content_describe_title">
  28. <view class="input_content_describe_title_msg">商品简介</view>
  29. <view class="input_content_describe_title_num">
  30. <text v-if="setFormData.store_info">{{ setFormData.store_info.length }}</text>
  31. <text v-else>0</text>
  32. /200
  33. </view>
  34. </view>
  35. <view class="input_content_describe_textarea">
  36. <textarea v-model="setFormData.store_info" value="" placeholder="请填写商品简介" placeholderClass="placeholderClass" maxlength="200" />
  37. </view>
  38. </view>
  39. <view class="input_content_keyword">
  40. <view class="input_content_keyword_label">关键字</view>
  41. <view class="input_content_keyword_value"><input v-model="setFormData.keyword" type="text" value="" placeholder="填写关键字" /></view>
  42. </view>
  43. </view>
  44. <view class="popup_group">
  45. <view class="popup_group_item" @click="selectPlatform">
  46. <view class="popup_group_item_label">平台分类</view>
  47. <view class="popup_group_item_value">
  48. <view class="popup_group_item_message">
  49. <span v-if="setFormData.cate_name" class="popup_group_item_message_value">{{ setFormData.cate_name }}</span>
  50. <span v-else>请选择平台分类</span>
  51. </view>
  52. <view><span class="iconfont">&#xe6bd;</span></view>
  53. </view>
  54. </view>
  55. <view class="popup_group_item" @click="selectStoreClass">
  56. <view class="popup_group_item_label">店铺分类</view>
  57. <view class="popup_group_item_value">
  58. <view class="popup_group_item_message">
  59. <span v-if="setFormData.mer_cate_name" class="popup_group_item_message_value">{{ setFormData.mer_cate_name }}</span>
  60. <span v-else>请选择店铺分类</span>
  61. </view>
  62. <view><span class="iconfont">&#xe6bd;</span></view>
  63. </view>
  64. </view>
  65. <view class="popup_group_item" @click="selectBrand">
  66. <view class="popup_group_item_label">商品品牌</view>
  67. <view class="popup_group_item_value">
  68. <view class="popup_group_item_message">
  69. <text v-if="setFormData.brand_name" class="popup_group_item_message_value line1">{{ setFormData.brand_name }}</text>
  70. <text v-else>请选择商品品牌</text>
  71. </view>
  72. <view><text class="iconfont">&#xe6bd;</text></view>
  73. </view>
  74. </view>
  75. <view class="popup_group_item">
  76. <view class="popup_group_item_label">商品单位</view>
  77. <view class="popup_group_item_value"><input v-model="setFormData.unit_name" type="text" placeholder="请填写商品单位" /></view>
  78. </view>
  79. </view>
  80. <view class="popup_group">
  81. <view class="radio">
  82. <view class="radio_label ">规格选择</view>
  83. <radio-group class="select_group flex_start" @change="specificationsRadioChange($event)">
  84. <label class="radio_select" v-for="(val, i) in specificationsRadioList" :key="val.value">
  85. <view><radio :value="val.value" :checked="val.value == setFormData.spec_type" /></view>
  86. <view>{{ val.name }}</view>
  87. </label>
  88. </radio-group>
  89. </view>
  90. <view class="popup_group_item" @click="selectSpecification" v-if="setFormData.spec_type == 1">
  91. <view class="popup_group_item_label">选择规格</view>
  92. <view class="popup_group_item_value">
  93. <view class="popup_group_item_message">
  94. <span v-if="setFormData.specifica" class="popup_group_item_message_value">{{ setFormData.specifica }}</span>
  95. <span v-else>去选择</span>
  96. </view>
  97. <view><span class="iconfont">&#xe6bd;</span></view>
  98. </view>
  99. </view>
  100. <view class="popup_group_item" @click="setSpecifica" v-if="setFormData.spec_type == 0">
  101. <view class="popup_group_item_label">价格设置</view>
  102. <view class="popup_group_item_value">
  103. <view class="popup_group_item_message">
  104. <span v-if="setFormData.setSpecificaValue" class="popup_group_item_message_value">{{setFormData.setSpecificaValue}}</span>
  105. <span v-else>去设置</span>
  106. </view>
  107. <view><span class="iconfont">&#xe6bd;</span></view>
  108. </view>
  109. </view>
  110. <view class="popup_group_item" @click="setSpecifica" v-if="setFormData.spec_type == 1 && setFormData.specifica">
  111. <view class="popup_group_item_label">价格设置</view>
  112. <view class="popup_group_item_value">
  113. <view class="popup_group_item_message">
  114. <span v-if="setFormData.setSpecificaValue2" class="popup_group_item_message_value">{{setFormData.setSpecificaValue2}}</span>
  115. <span v-else>去设置</span>
  116. </view>
  117. <view><span class="iconfont">&#xe6bd;</span></view>
  118. </view>
  119. </view>
  120. </view>
  121. <view class="popup_group">
  122. <view v-if="deliveryType.length == 2" class="radio">
  123. <view class="radio_label ">送货方式</view>
  124. <checkbox-group class="select_group flex_start" @change="deliveryWayChange">
  125. <label class="radio_select" v-for="(val, i) in deliveryFreeList" :key="val.value">
  126. <view><checkbox :value="val.value" :checked="setFormData.delivery_way.includes(val.value)" /></view>
  127. <view>{{ val.name }}</view>
  128. </label>
  129. </checkbox-group>
  130. </view>
  131. <view class="popup_group_item" v-if="setFormData.delivery_way.includes('2')">
  132. <view class="popup_group_item_label">是否包邮</view>
  133. <view class="popup_group_item_value">
  134. <view class="popup_group_item_message">
  135. <switch :checked="setFormData.delivery_free == '1'" color="#E93323" style="transform:scale(0.8)" @change="deliveryFreeChange" />
  136. </view>
  137. </view>
  138. </view>
  139. <view class="popup_group_item" v-if="setFormData.delivery_way.includes('2') && setFormData.delivery_free == 0" @click="tempIdSelect">
  140. <view class="popup_group_item_label">运费模板</view>
  141. <view class="popup_group_item_value">
  142. <view class="popup_group_item_message">
  143. <span v-if="setFormData.tempName" class="popup_group_item_message_value">{{ setFormData.tempName }}</span>
  144. <span v-else>请选择运费模板</span>
  145. </view>
  146. <view><span class="iconfont">&#xe6bd;</span></view>
  147. </view>
  148. </view>
  149. </view>
  150. <view class="handle"><view class="handle_button" @click="handleNextStep">下一步</view></view>
  151. </view>
  152. <view class="step_two" v-if="step == 2"><secound :resetKey="secoundModel" :product_id="product_id" :merId="merId" @lastStep="lastStep"></secound></view>
  153. <!-- 选择平台分类弹框 -->
  154. <uni-popup ref="select_platform" type="bottom">
  155. <platfrom @close="closePlatfrom" :classifiedData="platformClassificationData" @getPlatData="getPlatData"></platfrom>
  156. </uni-popup>
  157. <!-- 选择店铺分类弹框 -->
  158. <uni-popup ref="select_store" type="bottom">
  159. <store-classification :classifiedData="merchantClassification" :mer_id="merId" @handleGetSelectArea="handleGetSelectStore" @close="merchantClose"></store-classification>
  160. </uni-popup>
  161. <uni-popup ref="select_popup" type="bottom">
  162. <linkage-assembly
  163. selectProductTitle="选择品牌"
  164. :form="setFormData"
  165. :classifiedData="brand"
  166. :selectProductItem="productItem"
  167. @getLinkageData="getLinkageData"
  168. @multipleList="multipleList"
  169. @close="handleClose"
  170. ></linkage-assembly>
  171. </uni-popup>
  172. <uni-popup ref="tempId" type="bottom">
  173. <linkage-assembly
  174. selectProductTitle="选择运费模板"
  175. :form="setFormData"
  176. :classifiedData="classified['temp_id']"
  177. :selectProductItem="productItem"
  178. :mer_id="merId"
  179. @getLinkageData="getTempIdData"
  180. @multipleList="multipleList"
  181. @close="$refs.tempId.close()"
  182. @scrolltolower="scrolltolower"
  183. ></linkage-assembly>
  184. </uni-popup>
  185. <uni-popup ref="attr" type="bottom"><attr @close="$refs.attr.close()" :mer_id="merId" :attrList="classified['attr']" @selectAttr="selectAttr"></attr></uni-popup>
  186. <avatar @upload="doUpload" @getName="getImgName" quality="1" ref="avatar" selWidth="250upx" selHeight="250upx"></avatar>
  187. </view>
  188. </template>
  189. <script>
  190. // +----------------------------------------------------------------------
  191. // | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
  192. // +----------------------------------------------------------------------
  193. // | Copyright (c) 2016~2024 https://www.crmeb.com All rights reserved.
  194. // +----------------------------------------------------------------------
  195. // | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
  196. // +----------------------------------------------------------------------
  197. // | Author: CRMEB Team <admin@crmeb.com>
  198. // +----------------------------------------------------------------------
  199. import inputGoodsDetils from '../components/inputGoodsDetils.vue';
  200. import linkageAssembly from '../components/linkageAssembly.vue';
  201. import { navigateTo, serialize, setStorage, getStorage, Toast, removeStorage, Loading, hideLoading } from '../../../libs/uniApi.js';
  202. import { categoryBrandlist, categorySelect, categoryList, attrList, templateList, productDetail, getDeliveryType } from '@/api/product.js';
  203. import attr from '../components/attr.vue';
  204. import platfrom from '../components/platform.vue';
  205. import storeClassification from '../components/store_classification.vue';
  206. import secound from './secound.vue';
  207. import avatar from "@/components/yq-avatar/yq-avatar.vue";
  208. import {TOKENNAME, HTTP_REQUEST_URL} from '@/config/app.js';
  209. import store from '@/store';
  210. export default {
  211. components: {
  212. inputGoodsDetils,
  213. linkageAssembly,
  214. attr,
  215. platfrom, // 选择平台分类组件
  216. storeClassification,
  217. secound,
  218. avatar
  219. },
  220. data() {
  221. return {
  222. step: 1,
  223. setFormData: {
  224. imageList: [],
  225. specification: '',
  226. image: '', //主图
  227. slider_image: '', // 轮播图
  228. store_name: '', // 商品名
  229. store_info: '', // 简介
  230. keyword: '', // 关键字
  231. brand_id: '', // 品牌id
  232. brand_name: '', // 品牌名称
  233. cate_id: '', // 平台分类
  234. cate_name: '', // 平台名称
  235. mer_cate_id: '', // 店铺分类
  236. mer_cate_name: '', // 店铺分类名称
  237. unit_name: '', // 商品单位
  238. spec_type: '0', // 0.单规格 1:多规格
  239. attr: [], // 商品规格
  240. specifica: '', // 商品规格名称
  241. setSpecificaValue: '', // 价格设置提示
  242. setSpecificaValue2: '',
  243. delivery_way: [], // 配送方式 1 到店核销 2 快递配送
  244. delivery_free: '1', // 是否包邮 0不包邮 1包邮
  245. temp_id: '', // 运费模板ID
  246. tempName: '' // 运费模板名称
  247. },
  248. popupContainerKey: false,
  249. productItem: {} || [],
  250. selectProductTitle: '选择平台分类',
  251. specificationsRadioList: [
  252. {
  253. value: '0',
  254. name: '单规格'
  255. },
  256. {
  257. value: '1',
  258. name: '多规格'
  259. }
  260. ],
  261. specifications: [
  262. {
  263. id: 5,
  264. label: '规格选择',
  265. type: 'radio',
  266. model: 'spec_type',
  267. inforValue: '0',
  268. radioList: [
  269. {
  270. value: '0',
  271. name: '单规格'
  272. },
  273. {
  274. value: '1',
  275. name: '多规格'
  276. }
  277. ]
  278. },
  279. {
  280. id: 7,
  281. label: '选择规格',
  282. type: 'select',
  283. model: 'attr',
  284. singleColumn: true,
  285. value: '',
  286. DoNotShow: true,
  287. holder: '去选择',
  288. jumpLogic: true // 是否为需要特数处理,执行跳转逻辑
  289. },
  290. {
  291. id: 6,
  292. label: '商品规格',
  293. type: 'select',
  294. value: '',
  295. holder: '去设置',
  296. jumpLogic: true, // 是否为需要特数处理,执行跳转逻辑
  297. DoNotShow: true
  298. }
  299. ],
  300. deliveryType: [],
  301. deliveryFreeList: [
  302. {
  303. value: '1',
  304. name: '到店核销'
  305. },
  306. {
  307. value: '2',
  308. name: '快递配送'
  309. }
  310. ],
  311. merId: '',
  312. product_id: '', // 商品Id
  313. isUpload: true,
  314. templateListPage: {
  315. page: 1,
  316. limit: 10000
  317. },
  318. // 分类数据容器
  319. classified: {
  320. cate_id: [],
  321. mer_cate_id: [],
  322. brand_id: [],
  323. attr: [],
  324. temp_id: []
  325. },
  326. platformClassificationData: [], // 平台分类数据
  327. merchantClassification: [], // 店铺分类
  328. brand: [], // 品牌分类
  329. specificationClassification: [], // 规格分类
  330. selectEdAttr: [], // 当前选择的多规格选项规格
  331. canChange: true,
  332. secoundModel: false,
  333. resetKey: false,
  334. imgName: ""
  335. };
  336. },
  337. onLoad(opt) {
  338. this.merId = opt.mer_id;
  339. this.product_id = opt.product_id;
  340. this.getDeliveryType();
  341. this.initData();
  342. if (this.product_id) {
  343. this.initDataEditData();
  344. }
  345. },
  346. onShow() {
  347. this.setFormData.setSpecificaValue = '';
  348. this.setFormData.setSpecificaValue2 = '';
  349. if(getStorage('singleSpecification')) {
  350. this.setFormData.setSpecificaValue = '点击修改价格';
  351. } else {
  352. this.setFormData.setSpecificaValue = '';
  353. }
  354. if(getStorage('attrValue')) {
  355. this.setFormData.setSpecificaValue2 = '点击修改价格';
  356. } else {
  357. this.setFormData.setSpecificaValue2 = '';
  358. }
  359. if(this.step == 2) {
  360. this.secoundModel = !this.secoundModel;
  361. }
  362. },
  363. watch: {
  364. setFormData: {
  365. handler(val) {
  366. console.log(val);
  367. setTimeout(()=>{
  368. setStorage('addGoodsFormData', this.setFormData);
  369. });
  370. },
  371. deep: true
  372. },
  373. 'setFormData.imageList'(val) {
  374. this.setFormData.image = val.length ? val[0] : '';
  375. this.setFormData.slider_image = val.length ? serialize(val).splice(1) : [];
  376. }
  377. },
  378. methods: {
  379. // 获取数据
  380. async initData() {
  381. if (getStorage('addGoodsFormData')) {
  382. this.setFormData = getStorage('addGoodsFormData');
  383. this.selectEdAttr = getStorage('modifyPriceData');
  384. }
  385. // 获取品牌
  386. this.brand = (await categoryBrandlist(this.merId)).data;
  387. // 获取商户分类
  388. this.merchantClassification = (await categorySelect(this.merId)).data;
  389. // 获取平台分类
  390. this.platformClassificationData = (await categoryList(this.merId)).data;
  391. // 数据回显
  392. },
  393. //获取送货方式信息
  394. getDeliveryType(){
  395. let that = this
  396. getDeliveryType(that.merId).then(
  397. res => {
  398. that.deliveryType = res.data.delivery_way.map(String);
  399. if (!that.product_id) that.setFormData.delivery_way = that.deliveryType;
  400. if (that.deliveryType.length == 2) {
  401. that.deliveryFreeList = [
  402. { value: '1', name: '到店核销' },
  403. { value: '2', name: '快递配送' }
  404. ]
  405. } else {
  406. if (that.deliveryType.length == 1 && that.deliveryType[0] == '1') {
  407. that.deliveryFreeList = [{ value: '1', name: '到店核销' }]
  408. } else {
  409. that.deliveryFreeList = [{ value: '2', name: '快递配送' }]
  410. }
  411. }
  412. },
  413. error => {
  414. that.$util.Tips({
  415. title: error.msg
  416. })
  417. }
  418. );
  419. },
  420. // 查询详情数据
  421. initDataEditData() {
  422. Loading();
  423. this.setFormData = {
  424. imageList: [],
  425. specification: '',
  426. image: '', //主图
  427. slider_image: '', // 轮播图
  428. store_name: '', // 商品名
  429. store_info: '', // 简介
  430. keyword: '', // 关键字
  431. brand_id: '', // 品牌id
  432. brand_name: '', // 品牌名称
  433. cate_id: '', // 平台分类
  434. cate_name: '', // 平台名称
  435. mer_cate_id: '', // 店铺分类
  436. mer_cate_name: '', // 店铺分类名称
  437. unit_name: '', // 商品单位
  438. spec_type: '0', // 0.单规格 1:多规格
  439. attr: [], // 商品规格
  440. specifica: '', // 商品规格名称
  441. setSpecificaValue: '', // 价格设置提示
  442. setSpecificaValue2: '', // 价格设置提示
  443. delivery_way: [], // 配送方式 1 到店核销 2 快递配送
  444. delivery_free: '0', // 是否包邮 0不包邮 1包邮
  445. temp_id: '', // 运费模板ID
  446. tempName: '' // 运费模板名称
  447. };
  448. if(getStorage('editGoodsDetils')) {
  449. removeStorage('editGoodsDetils');
  450. }
  451. productDetail(this.merId, this.product_id).then(res => {
  452. setStorage('editGoodsDetils', res.data);
  453. let editGoodsDetils = res.data;
  454. Object.keys(this.setFormData).forEach(item => {
  455. this.setFormData[item] = editGoodsDetils[item];
  456. });
  457. this.setFormData.product_id = this.product_id;
  458. this.setFormData.imageList = [...(this.setFormData.image ? [this.setFormData.image] : []), ...this.setFormData.slider_image];
  459. this.setFormData.cate_name = editGoodsDetils.storeCategory.cate_name; // 平台分类回显
  460. this.setFormData.mer_cate_name = editGoodsDetils.merCateId ? editGoodsDetils.merCateId.map(item => item.category && item.category.cate_name).join(',') : '';
  461. this.setFormData.brand_name = editGoodsDetils.brand ? editGoodsDetils.brand.brand_name : '';
  462. // 多规格
  463. if(this.setFormData.spec_type == 1) {
  464. if(editGoodsDetils.attr.length) {
  465. this.setFormData.specifica = '点击修改规格'
  466. }
  467. if(editGoodsDetils.attrValue.length) {
  468. this.setFormData.setSpecificaValue2 = '点击修改价格'
  469. }
  470. }
  471. if (editGoodsDetils.spec_type == 0) {
  472. setStorage('singleSpecification', editGoodsDetils.attrValue[0]);
  473. if(editGoodsDetils.attrValue.length) {
  474. this.setFormData.setSpecificaValue = '点击修改价格'
  475. }
  476. }
  477. setStorage('attrValue', editGoodsDetils.attrValue);
  478. editGoodsDetils.temp && (this.setFormData.tempName = editGoodsDetils.temp.name);
  479. setStorage('canChange', true);
  480. hideLoading();
  481. });
  482. },
  483. // 选择图片
  484. handleChooseImage() {
  485. let that = this;
  486. that.$util.uploadImageOne('upload/image', function(res) {
  487. that.setFormData.imageList.push(res.data.path);
  488. });
  489. },
  490. clk() {
  491. let avatar = this.$refs.avatar;
  492. avatar.fChooseImg(1,{selWidth: '350upx', selHeight: '350upx', inner: true});
  493. },
  494. doUpload(rsp) {
  495. let that = this
  496. console.log(rsp);
  497. uni.uploadFile({
  498. url: HTTP_REQUEST_URL + '/api/upload/image/field',
  499. filePath: rsp.path,
  500. name: 'field',
  501. formData: {
  502. 'filename': rsp.path,
  503. 'name': that.imgName
  504. },
  505. header: {
  506. // #ifdef MP
  507. "Content-Type": "multipart/form-data",
  508. // #endif
  509. [TOKENNAME]: 'Bearer ' + store.state.app.token
  510. },
  511. success: (uploadFileRes) => {
  512. console.log(uploadFileRes.data);
  513. let imgData = JSON.parse(uploadFileRes.data)
  514. that.setFormData.imageList.push(imgData.data.path)
  515. },
  516. complete(res) {
  517. console.log(res)
  518. }
  519. });
  520. },
  521. getImgName(name){
  522. this.imgName = name
  523. },
  524. // 删除图片
  525. deleteImage(index) {
  526. this.setFormData.imageList.splice(index, 1);
  527. },
  528. // 选择平台分类
  529. selectPlatform() {
  530. this.$refs.select_platform.open();
  531. },
  532. // 关闭频台分类
  533. closePlatfrom() {
  534. this.$refs.select_platform.close();
  535. },
  536. // 获取平台类数据
  537. getPlatData(item, taplist) {
  538. this.setFormData.cate_id = item.value;
  539. this.setFormData.cate_name = item.label;
  540. this.$refs.select_platform.close();
  541. },
  542. // 选择店铺分类
  543. selectStoreClass() {
  544. this.$refs.select_store.open();
  545. },
  546. // 关闭店铺分类
  547. merchantClose() {
  548. this.$refs.select_store.close();
  549. },
  550. // 获取已选择得店铺数据
  551. handleGetSelectStore(item) {
  552. this.setFormData.mer_cate_id = item.map(val => val.value);
  553. console.log(item);
  554. this.setFormData.mer_cate_name = item.map(val => val.label).join(',');
  555. this.$refs.select_store.close();
  556. },
  557. // 获取品牌分类弹框
  558. selectBrand() {
  559. this.$refs.select_popup.open();
  560. },
  561. // 获取品牌分类数据
  562. getLinkageData(item) {
  563. this.setFormData.brand_id = item[0].value;
  564. this.setFormData.brand_name = item[0].label;
  565. this.$refs.select_popup.close();
  566. },
  567. // 获取多选数据
  568. multipleList(data, model) {
  569. if (model == 'mer_cate_id') {
  570. this.platformClassification[1].value = data.map(item => item.label).join(',');
  571. this.platformClassification[1].allreadySelect = data;
  572. this.setFormData.mer_cate_id = data.map(item => item.value);
  573. }
  574. },
  575. // popup弹框中返回数据结束
  576. // 关闭弹框
  577. close() {
  578. this.$refs.select_popup.close();
  579. },
  580. // 拼接字符串
  581. getLinkDataOfRecursion(arr, child = 'children', key = 'value') {
  582. let str = '';
  583. let id = '';
  584. arr.forEach(item => {
  585. str = item.label;
  586. id = item.value;
  587. });
  588. // str = str.slice(0, str.length - 1);
  589. return { str, id };
  590. },
  591. // 获取默认值,给表单对象赋值
  592. formInitData(value, model) {
  593. this.setFormData[model] = value;
  594. },
  595. // 选项的单选框change事件触发
  596. // model 为表单数据
  597. handleRadioChange(value, item) {
  598. this.setFormData[item.model] = value;
  599. },
  600. // 选择规格部分(新)
  601. // 选择规格radio
  602. specificationsRadioChange(e) {
  603. this.setFormData.spec_type = e.detail.value;
  604. },
  605. // 选择规格弹窗
  606. selectSpecification() {
  607. attrList(this.merId, { page: 1, limit: 10000 }).then(res => {
  608. this.specificationClassification = res.data.list;
  609. this.classified['attr'] = this.specificationClassification;
  610. this.specificationClassification.forEach(item => {
  611. this.$set(item, 'value', item.attr_template_id);
  612. this.$set(item, 'label', item.template_name);
  613. this.$refs.attr.open();
  614. });
  615. });
  616. },
  617. // 多规格时,选择属性
  618. selectAttr(item) {
  619. if (getStorage('attrValue')) {
  620. removeStorage('attrValue');
  621. }
  622. this.setFormData.specifica = item.template_name;
  623. this.setFormData.attr = [];
  624. this.setFormData.attr = this.setFormData.attr.concat(item.template_value);
  625. this.selectEdAttr = item; // 存储选择的数据,跳转时使用
  626. this.$refs.attr.close();
  627. },
  628. // 前往设置多规格界面
  629. setSpecifica() {
  630. // specification 为规格 0为单规格 1为多规格
  631. if (this.setFormData.spec_type == 0) {
  632. navigateTo(1, '/pages/product/addGoods/singleSpecification');
  633. return;
  634. }
  635. if (this.setFormData.spec_type == 1) {
  636. let queryData = serialize(this.selectEdAttr);
  637. setStorage('modifyPriceData', queryData);
  638. navigateTo(1, '/pages/product/addGoods/modifyPrice');
  639. return;
  640. }
  641. },
  642. // 选择规格部分(新)结束
  643. // switch切换
  644. switchChange(value, item) {
  645. if (item.model == 'delivery_free') {
  646. if (value) {
  647. this.setFormData[item.model] = '1';
  648. } else {
  649. this.setFormData[item.model] = '0';
  650. }
  651. }
  652. },
  653. // 多选切换
  654. checkChange(value, item) {
  655. this.setFormData[item.model] = value;
  656. if (item.model == 'delivery_way') {
  657. if (value.includes('2')) {
  658. this.transport[1].DoNotShow = false;
  659. } else {
  660. this.transport[1].DoNotShow = true;
  661. }
  662. console.log(this.transport[1]);
  663. }
  664. },
  665. handleClose() {
  666. this.$refs.select_popup.close();
  667. },
  668. // 送货方式选择
  669. deliveryWayChange(obj) {
  670. this.setFormData.delivery_way = obj.detail.value;
  671. },
  672. // 是否包邮选择
  673. deliveryFreeChange(val) {
  674. if (val.detail.value) {
  675. this.setFormData.delivery_free = '1';
  676. } else {
  677. this.setFormData.delivery_free = '0';
  678. }
  679. },
  680. // 选择运费模板
  681. tempIdSelect() {
  682. this.getTemplateList();
  683. },
  684. // 请求运费模板列表
  685. getTemplateList() {
  686. templateList(this.merId, this.templateListPage).then(res => {
  687. res.data.list.forEach(item => {
  688. this.$set(item, 'value', item.shipping_template_id);
  689. this.$set(item, 'label', item.name);
  690. });
  691. this.classified['temp_id'] = res.data.list;
  692. this.$refs.tempId.open();
  693. });
  694. },
  695. // 内部scroll-view滑动到最底部
  696. scrolltolower() {
  697. },
  698. // 获取运费模板数据
  699. getTempIdData(obj) {
  700. console.log(obj);
  701. this.setFormData.temp_id = obj[0].value;
  702. this.setFormData.tempName = obj[0].label;
  703. this.$refs.tempId.close();
  704. },
  705. // 设置运费模板
  706. setGoodsTemp() {
  707. navigateTo(1, '/pages/product/addGoods/freightTemplate', { mer_id: this.merId });
  708. },
  709. // 开始下一步
  710. handleNextStep() {
  711. let canJumpFlag = true;
  712. let requireData = {
  713. image: '请选择主图',
  714. store_name: '请输入商品名', // 商品名
  715. cate_id: '请选择平台分类', // 平台分类
  716. mer_cate_id: '请选择店铺分类', // 店铺分类
  717. unit_name: '请输入商品单位', // 商品单位
  718. };
  719. console.log({...this.setFormData})
  720. Object.keys(requireData).some(item => {
  721. if (!this.setFormData[item]) {
  722. Toast(requireData[item]);
  723. canJumpFlag = false;
  724. return;
  725. }
  726. });
  727. if(this.setFormData.spec_type == '0' && !this.setFormData.setSpecificaValue){
  728. Toast('商品价格不能为空');
  729. return;
  730. } else if(this.setFormData.spec_type == '1' && !this.setFormData.setSpecificaValue2){
  731. Toast('商品价格不能为空');
  732. return;
  733. }
  734. if(!this.setFormData.delivery_way.length){
  735. Toast('请选择送货方式');
  736. return;
  737. }
  738. if (canJumpFlag) {
  739. // navigateTo(1, '/pages/product/addGoods/secound', { mer_id: this.merId, type: this.type });
  740. // this.$refs.secound.open();
  741. this.step = 2;
  742. }
  743. },
  744. lastStep() {
  745. this.step = 1;
  746. }
  747. }
  748. };
  749. </script>
  750. <style lang="scss" scoped>
  751. @import './scss/index.scss';
  752. </style>