分类参数必填校验

seller/src/views/goods/goods-seller/goodsOperationSec.vue

@@ -16,15 +16,14 @@
               <span> &gt; {{ this.baseInfoForm.categoryName[2] }}</span>
             </FormItem>
             <FormItem label="商品名称" prop="goodsName">
-              <Input v-model="baseInfoForm.goodsName" clearable placeholder="商品名称" style="width: 260px"
-                     type="text"/>
+              <Input v-model="baseInfoForm.goodsName" clearable placeholder="商品名称" style="width: 260px" type="text" />
             </FormItem>
 
             <FormItem label="商品价格" prop="price">
-              <Input v-model="baseInfoForm.price" clearable placeholder="商品价格" style="width: 260px" type="text"/>
+              <Input v-model="baseInfoForm.price" clearable placeholder="商品价格" style="width: 260px" type="text" />
             </FormItem>
             <FormItem label="商品卖点" prop="sellingPoint">
-              <Input v-model="baseInfoForm.sellingPoint" :rows="4" style="width: 260px" type="textarea"/>
+              <Input v-model="baseInfoForm.sellingPoint" :rows="4" style="width: 260px" type="textarea" />
             </FormItem>
             <FormItem label="商品品牌" prop="brandId">
               <Select v-model="baseInfoForm.brandId" filterable style="width: 200px">
@@ -107,7 +106,7 @@
                   <div v-for="(item, __index) in baseInfoForm.goodsGalleryFiles" :key="__index"
                     class="demo-upload-list">
                     <template>
-                      <img :src="item"/>
+                      <img :src="item" />
                       <div class="demo-upload-list-cover">
                         <div>
                           <Icon size="30" type="md-search" @click.native="handleViewGoodsPicture(item)"></Icon>
@@ -135,7 +134,7 @@
                 <Button @click="handleCLickImg('goodsGalleryFiles')" type="primary">上传图片</Button>
               </div>
               <Modal v-model="goodsPictureVisible" title="View Image">
-                <img v-if="goodsPictureVisible" :src="previewGoodsPicture" style="width: 100%"/>
+                <img v-if="goodsPictureVisible" :src="previewGoodsPicture" style="width: 100%" />
               </Modal>
             </FormItem>
             <FormItem>
@@ -145,17 +144,14 @@
               <div class="goods-video">
                 <div v-if="baseInfoForm.goodsVideo">
                   <div>
-                    <video :src="baseInfoForm.goodsVideo" class="video" controls style="max-width: 300px;"/>
+                    <video :src="baseInfoForm.goodsVideo" class="video" controls style="max-width: 300px;" />
                   </div>
                 </div>
                 <Upload ref="upload" :action="uploadFileUrl" :format="['avi', 'wmv', 'mpeg', 'mp4', 'mov']"
-                        :headers="{ ...accessToken }"
-                        :max-size="10240" :on-error="() => { loadingVideo = false }"
-                        :on-exceeded-size="handleVideoMaxSize"
-                        :on-format-error="handleFormatError" :on-progress="() => { loadingVideo = true }"
-                        :on-success="handleSuccessGoodsVideo" :show-upload-list="false"
-                        multiple
-                        style="margin-left: 10px" type="drag">
+                  :headers="{ ...accessToken }" :max-size="10240" :on-error="() => { loadingVideo = false }"
+                  :on-exceeded-size="handleVideoMaxSize" :on-format-error="handleFormatError"
+                  :on-progress="() => { loadingVideo = true }" :on-success="handleSuccessGoodsVideo"
+                  :show-upload-list="false" multiple style="margin-left: 10px" type="drag">
                   <Button :loading="loadingVideo" icon="ios-cloud-upload-outline" type="text">
                     <span v-if="!loadingVideo">
                       {{ baseInfoForm.goodsVideo ? "已" : "" }}上传视频
@@ -183,12 +179,14 @@
                             <FormItem class="sku-item-content-val flex" label="">
 
                               <div>
-                                <AutoComplete v-model="item.name" :filter-method="filterMethod"
-                                              :maxlength="30" placeholder="请输入规格项名称" style="width: 150px"
-                                              @on-focus="changeSkuItem(item.name)" @on-change="editSkuItem(item.name, $index, item)">
+                                <AutoComplete v-model="item.name" :filter-method="filterMethod" :maxlength="30"
+                                  placeholder="请输入规格项名称" style="width: 150px" @on-focus="changeSkuItem(item.name)"
+                                  @on-change="editSkuItem(item.name, $index, item)">
                                 </AutoComplete>
 
-                                <iSwitch v-if="$index === 0" style="margin-left: 10px" size="small" @on-change="changeSkuOpenImage" v-model="openImage" /><span v-if="$index === 0" style="margin-left: 5px">添加规格图片</span>
+                                <iSwitch v-if="$index === 0" style="margin-left: 10px" size="small"
+                                  @on-change="changeSkuOpenImage" v-model="openImage" /><span v-if="$index === 0"
+                                  style="margin-left: 5px">添加规格图片</span>
                               </div>
                             </FormItem>
 
@@ -202,52 +200,40 @@
                                 <div style="display: flex; justify-content: center; align-items: center;">
 
 
-                                  <AutoComplete ref="input" v-model="val.value"
-                                                :disabled="containsSameSkuItem"
-                                                :filter-method="filterMethod"
-                                                :maxlength="30" placeholder="请输入规格值" style="width: 180px"
-                                                @on-focus="changeSkuVals(val, item.name)"
+                                  <AutoComplete ref="input" v-model="val.value" :disabled="containsSameSkuItem"
+                                    :filter-method="filterMethod" :maxlength="30" placeholder="请输入规格值"
+                                    style="width: 180px" @on-focus="changeSkuVals(val, item.name)"
                                     @on-blur="checkSkuVal(val, $index, item)"
                                     @on-change="skuValueChange(val, index, item)">
                                   </AutoComplete>
                                   <a style="margin-left: 6px" v-if="val.value && val.value !== ''">
-                                    <Icon size="15" type="md-trash" @click="handleCloseSkuValue(val, index, item)"></Icon>
+                                    <Icon size="15" type="md-trash" @click="handleCloseSkuValue(val, index, item)">
+                                    </Icon>
                                   </a>
                                 </div>
                                 <div v-if="$index === 0 && openImage" style="margin-top: 10px">
-                                  <vuedraggable :animation="200" :list="val.images"
-                                  >
-                                    <div v-for="(img, __index) in val.images" :key="__index"
-                                         class="sku-upload-list"
+                                  <vuedraggable :animation="200" :list="val.images">
+                                    <div v-for="(img, __index) in val.images" :key="__index" class="sku-upload-list"
                                       style="width: 180px;height: 140px">
                                       <template>
-                                        <img
-                                          :src="img"
-                                          style="width: 180px;height: 140px"
-                                        />
+                                        <img :src="img" style="width: 180px;height: 140px" />
                                         <div class="sku-upload-list-cover">
-                                          <div style="margin-top: 50px" >
+                                          <div style="margin-top: 50px">
                                             <Icon size="25" type="md-search" @click="handleView(img)"></Icon>
-                                            <Icon size="25" type="md-trash" @click="handleRemove(val.images, __index)"></Icon>
+                                            <Icon size="25" type="md-trash" @click="handleRemove(val.images, __index)">
+                                            </Icon>
                                           </div>
                                         </div>
                                       </template>
                                     </div>
                                   </vuedraggable>
-                                  <Upload ref="uploadSku" :action="uploadFileUrl"
-                                          v-if="val.images < 1"
-                                          :before-upload="handleBeforeUpload"
-                                          :format="['jpg', 'jpeg', 'png', 'webp']"
-                                          :headers="{ ...accessToken }"
-                                          :max-size="2048"
-                                          :on-error="() => { $Spin.hide(); }"
-                                          :on-exceeded-size="handleMaxSize"
-                                          :on-format-error="handleFormatError"
-                                          :on-progress="() => { $Spin.show(); }"
-                                          :on-success="(res, file) => {
+                                  <Upload ref="uploadSku" :action="uploadFileUrl" v-if="val.images < 1"
+                                    :before-upload="handleBeforeUpload" :format="['jpg', 'jpeg', 'png', 'webp']"
+                                    :headers="{ ...accessToken }" :max-size="2048" :on-error="() => { $Spin.hide(); }"
+                                    :on-exceeded-size="handleMaxSize" :on-format-error="handleFormatError"
+                                    :on-progress="() => { $Spin.show(); }" :on-success="(res, file) => {
                                       handleSuccess(res, file, val.images)
-                                            }"
-                                          :show-upload-list="false"
+                                    }" :show-upload-list="false"
                                     style="width: 180px;height: 140px;margin-right: 10px" type="drag">
                                     <div>
                                       <Icon size="136" type="ios-camera"></Icon>
@@ -256,12 +242,12 @@
                                 </div>
                               </FormItem>
 
-                              <FormItem v-if="item.spec_values.length < 10 && item.spec_values.length >= 1 && item.spec_values[0].value !== ''" class="sku-item-content-val flex" label="" style="line-height: 32px;">
-                                <AutoComplete ref="input" v-model="newSkuValues[$index]"
-                                              :disabled="containsSameSkuItem"
-                                              :filter-method="filterMethod"
-                                              :maxlength="30" placeholder="自定义规格值" style="width: 180px"
-                                              @on-blur="addSpec($index, item)"
+                              <FormItem
+                                v-if="item.spec_values.length < 10 && item.spec_values.length >= 1 && item.spec_values[0].value !== ''"
+                                class="sku-item-content-val flex" label="" style="line-height: 32px;">
+                                <AutoComplete ref="input" v-model="newSkuValues[$index]" :disabled="containsSameSkuItem"
+                                  :filter-method="filterMethod" :maxlength="30" placeholder="自定义规格值"
+                                  style="width: 180px" @on-blur="addSpec($index, item)"
                                   v-on:keyup.native.enter="addSpec($index, item)">
                                 </AutoComplete>
                               </FormItem>
@@ -283,7 +269,7 @@
                   规格详细
                   <div slot="content">
                     <div v-if="needToloadSku" class="topinfo" @click="handleLoadingSkuData">点击加载sku数据</div>
-                    <div slot="content" :class="needToloadSku ? 'mask': ''">
+                    <div slot="content" :class="needToloadSku ? 'mask' : ''">
                       <Table :columns="skuTableColumn" :data="skuTableData" class="mt_10" style="
                           width: 100%;
                           .ivu-table-overflowX {
@@ -292,7 +278,7 @@
                         ">
                         <template slot="sn" slot-scope="{ row }">
                           <Input v-model="row.sn" clearable placeholder="请输入货号"
-                                 @on-change="updateSkuTable(row, 'sn')"/>
+                            @on-change="updateSkuTable(row, 'sn')" />
                         </template>
                         <div v-if="baseInfoForm.goodsType !== 'VIRTUAL_GOODS'" slot="weight" slot-scope="{ row }">
                           <Input v-model="row.weight" clearable placeholder="请输入重量"
@@ -349,7 +335,7 @@
                 <!-- {{item.url}} -->
                 <div v-for="(item, index) in listImages.images" :key="index" style="width:100%;display:flex;">
                   <img :src="item.url" style="width:100px;flex:1;margin-top:10px;cursor:pointer;"
-                       @click="handleView(item.url)"/>
+                    @click="handleView(item.url)" />
                 </div>
               </FormItem>
             </div>
@@ -363,12 +349,7 @@
               </FormItem>
             </div>
             <FormItem class="form-item-view-el" label="PC商品描述" prop="intro" style="width: 100%">
-              <editor
-                ref="editor"
-                v-model="baseInfoForm.intro"
-                height="800px"
-                openXss
-              ></editor>
+              <editor ref="editor" v-model="baseInfoForm.intro" height="800px" openXss></editor>
               <div class="promise-intro-btn">
                 <Button type="primary" @click="promiseIntroEditor">将PC商品描述同步到移动端描述
                 </Button>
@@ -376,12 +357,7 @@
             </FormItem>
 
             <FormItem class="form-item-view-el" label="移动端描述" prop="skuList" style="width: 100%">
-              <editor
-                ref="introEditor"
-                v-model="baseInfoForm.mobileIntro"
-                height="800px"
-                openXss
-              ></editor>
+              <editor ref="introEditor" v-model="baseInfoForm.mobileIntro" height="800px" openXss></editor>
             </FormItem>
           </div>
           <div v-if="baseInfoForm.goodsType != 'VIRTUAL_GOODS'">
@@ -430,19 +406,19 @@
                 <Panel :name="paramsGroup.groupName">
                   {{ paramsGroup.groupName }}
                   <p slot="content">
-                    <FormItem v-for="(params, paramsIndex) in paramsGroup.params" :key="paramsIndex"
-                              :label="`${params.paramName}：`">
-                      <Select v-model="params.paramValue" clearable placeholder="请选择" style="width: 200px"
-                              @on-change="
+                    <FormItem v-for="(paramsItem, paramsIndex) in paramsGroup.params" :key="paramsIndex"
+                      :label="`${paramsItem.paramName}：`"
+                      :rules="{ required: paramsItem.required, message: '参数不能为空' }">
+                      <Select v-model="paramsItem.paramValue" clearable placeholder="请选择" style="width: 200px" @on-change="
                         selectParams(
                           paramsGroup,
                           groupIndex,
-                          params,
+                          paramsItem,
                           paramsIndex,
-                          params.paramValue
+                          paramsItem.paramValue
                         )
                         ">
-                        <Option v-for="option in params.options.split(',')" :key="option" :label="option"
+                        <Option v-for="option in paramsItem.options.split(',')" :key="option" :label="option"
                           :value="option">
                         </Option>
                       </Select>
@@ -476,7 +452,8 @@
     <!--<ossManage @callback="callbackSelected" ref="ossManage" />-->
     <!--</Modal>-->
     <Modal v-model="picModelFlag" width="1200px" @on-ok="confirmUrls">
-      <ossManage ref="ossManage" :isComponent="true" :initialize="picModelFlag" @callback="callbackSelected" @selected="(list)=>{ selectedImage = list}"/>
+      <ossManage ref="ossManage" :isComponent="true" :initialize="picModelFlag" @callback="callbackSelected"
+        @selected="(list) => { selectedImage = list }" />
     </Modal>
 
   </div>
@@ -488,8 +465,8 @@ import cloneObj from "@/utils/index";
 import vuedraggable from "vuedraggable";
 import tinymec from "@/views/lili-components/editor/index.vue";
 
-import {uploadFile} from "@/libs/axios";
-import {regular} from "@/utils";
+import { uploadFile } from "@/libs/axios";
+import { regular } from "@/utils";
 import DPlayer from 'dplayer';
 // import ossManage from "@/views/sys/oss-manage/ossManage";
 import ossManage from "@/views/shop/ossManages";
@@ -657,9 +634,9 @@ export default {
       validateError: [],
       baseInfoFormRule: {
         goodsName: [regular.REQUIRED, regular.WHITE_SPACE, regular.VARCHAR60],
-        price: [regular.REQUIRED, {validator: checkPrice}],
+        price: [regular.REQUIRED, { validator: checkPrice }],
         sellingPoint: [regular.REQUIRED, regular.VARCHAR60],
-        goodsUnit: [{required: true, message: "请选择计量单位"}],
+        goodsUnit: [{ required: true, message: "请选择计量单位" }],
         name: [regular.REQUIRED, regular.VARCHAR5],
         value: [regular.REQUIRED, regular.VARCHAR60],
         templateId: [regular.REQUIRED],
@@ -1002,7 +979,7 @@ export default {
         this.selectedSku.images !== undefined &&
         this.selectedSku.images.length > 5;
       if (check) {
-        this.$Notice.warning({title: "图片数量不能大于五张"});
+        this.$Notice.warning({ title: "图片数量不能大于五张" });
         return false;
       }
     },
@@ -1073,7 +1050,7 @@ export default {
       response.result.recommend
         ? (response.result.recommend = 1)
         : (response.result.recommend = 0);
-      this.baseInfoForm = {...this.baseInfoForm, ...response.result};
+      this.baseInfoForm = { ...this.baseInfoForm, ...response.result };
       this.baseInfoForm.release = 1; //即使是被放入仓库，修改的时候也会显示会立即发布
       this.categoryId = response.result.categoryPath.split(",")[2];
 
@@ -1262,7 +1239,7 @@ export default {
       }
       // 写入对象，下标，具体对象
       this.$set(this.skuInfo, this.skuInfo.length, {
-        spec_values: [{name: "", value: "", images: []}],
+        spec_values: [{ name: "", value: "", images: [] }],
         name: "",
       });
 
@@ -1832,6 +1809,25 @@ export default {
         this.$Message.error("存在重复规格值！");
         return;
       }
+      console.log(this.baseInfoForm.goodsParamsDTOList)
+      let checkFlag = false;
+      this.goodsParams.forEach(group => {
+        group.params.forEach(param => {
+          if(param.required){
+            const check = this.baseInfoForm.goodsParamsDTOList.some(paramsGroup =>
+              paramsGroup.some(paramsItem => paramsItem.paramId === param.id)
+            );
+            if(!check){
+              checkFlag = !check;
+
+            }
+          }
+        })
+      })
+      if(checkFlag){
+        this.$Message.error("存在未填写的参数项");
+        return;
+      }
       this.submitLoading = true;
       this.$refs["baseInfoForm"].validate((valid) => {
         if (valid) {
@@ -1998,7 +1994,7 @@ export default {
       API_GOODS.saveDraftGoods(this.baseInfoForm).then((res) => {
         if (res.success) {
           this.$Message.info("保存成功！");
-          this.$router.push({name: "template-goods"});
+          this.$router.push({ name: "template-goods" });
         }
       });
     },
@@ -2068,9 +2064,7 @@ export default {
   text-align: left;
 }
 
-#dplayer {
-
-}
+#dplayer {}
 
 /* .tox-notifications-container{
   display: none !important;