feat 商品管理增加头图标记

src/views/goods/create-good-new.scss

@@ -14,6 +14,7 @@
     }
     .word-tip {
       color: #e6af7a;
+      line-height: 32px;
     }
     .word-show {
       color: #449284;
@@ -49,8 +50,9 @@
     color: #f56c6c;
     margin-right: 4px;
   }
-  .required-label .el-form-item__content .bg-uploader .el-upload{
+  .required-label .el-form-item__content .bg-uploader .el-upload {
     width: 100%;
+    line-height: 32px;
   }
   .goods-category,
   .project-req {
@@ -101,11 +103,9 @@
       color: #f56c6c;
     }
     .upload-message {
-      position: absolute;
-      left: 0;
-      top: 105px;
       font-size: 12px;
       color: #f56c6c;
+      line-height: 24px;
     }
     .backTip {
       font-size: 12px;
@@ -123,7 +123,7 @@
       height: 100%;
       background: #000;
       opacity: 0.7;
-      transform: translate(-50%,-50%);
+      transform: translate(-50%, -50%);
       z-index: 999;
 
       i {
@@ -146,6 +146,7 @@
   }
 
   .bg-uploader {
+    line-height: 1;
     .bg-img {
       float: left;
       width: 84px;
@@ -155,12 +156,12 @@
     .limit-text {
       float: left;
       margin-left: 10px;
-      margin-top: -10px;
 
       p {
         font-size: 12px;
         color: #999;
         text-align: left;
+        line-height: 32px;
       }
     }
   }
@@ -245,13 +246,20 @@
     cursor: pointer;
     color: #449284;
   }
-  .file-pics {
-    display: inline-block;
+  .img-box {
     width: 84px;
-    height: 100px;
+    height: 130px;
     float: left;
     margin-right: 15px;
     position: relative;
+    .checkbox {
+      line-height: 32px;
+    }
+  }
+  .file-pics {
+    width: 84px;
+    height: 100px;
+    position: relative;
   }
   .el-input-number__decrease,
   .el-input-number__increase {

src/views/goods/create-good-new.vue

@@ -131,6 +131,7 @@
                 :limit="6"
             >
               <div :key="index" v-for="(item,index) in fileGoodsList">
+                <div class="img-box">
                   <div class="file-pics" v-if="fileGoodsList.length > 0" >
                   <img :src="item.url" @mouseover.stop="headIndex=index" class="bg-img"/>
                   <div
@@ -142,6 +143,10 @@
                     <i class="el-icon-delete"></i>
                   </div>
                 </div>
+                <div class="checkbox" @click.stop>
+                  <el-checkbox v-model="fileGoodsList[index].isChecked"></el-checkbox>
+                </div>
+                </div>
               </div>
               <img  class="bg-img" src="../../assets/image/small.png" v-if="fileGoodsList.length < 6"/>
               <div class="limit-text" v-if="fileGoodsList.length < 6">
@@ -151,6 +156,7 @@
               </div>
             </el-upload>
             <p class="upload-message" v-if="!isgoodsImages">请上传商品头图</p>
+            <p class="word-tip">勾选的头图在云鹊健康小程序不可见</p>
             <!-- <p class="upload-message" v-if="uploadImgMessage1">请上传商品头图</p> -->
           </el-form-item>
 
@@ -566,15 +572,15 @@
 </template>
 <script>
   import BreadCrumb from "@/components/breadcrumb.vue";
+import Cropper from '@/components/common/cropper.vue';
+import { getBarcodeData, getCategorysList, getContractList, getCooperationProjectList, getGoodsList, getGoodsListAll, getMedList, saveMedList, updateGoods, updateStock } from '@/utils/goods';
+import { isEmptyUtils } from "@/utils/index";
+import { createFilePath, doUpload, getFilePath } from "@/utils/qiniu-util";
+import { getStoreAdressRepot } from "@/utils/shop";
+import { closeLoading, openLoading, signFigures } from "@/utils/utils";
+import { originForm, originForm1, originForm3 } from './common/forms';
+import { originRules, originRules1, originRules3 } from './common/rules';
   let vm = null;
- import { openLoading, closeLoading, signFigures } from "@/utils/utils";
-  import { isEmptyUtils } from "@/utils/index";
-  import { doUpload, getFilePath, createFilePath } from "@/utils/qiniu-util";
-  import { updateGoods ,updateStock,getGoodsList, getGoodDetails, updateGoodsV2,getContractList, getCooperationProjectList,getMedList,getCategorysList,saveMedList,getGoodsListAll,getBarcodeData} from '@/utils/goods';
-  import { getStoreAdressRepot } from "@/utils/shop";
-  import Cropper from '@/components/common/cropper.vue'
-  import { originRules1, originRules, originRules3 } from './common/rules';
-  import { originForm1, originForm, originForm3 } from './common/forms';
 
   export default {
     components: {
@@ -1108,6 +1114,7 @@
               imageSort: d[i].imageSort,
               imgSort: d[i].imgSort,
               imageType: type == 1 ? d[i].imgType : d[i].imageType,
+              isChecked: d[i].isChecked||false,
             })
           }
         }
@@ -1336,7 +1343,7 @@
                 closeLoading(vm);
                 console.log('上传成功后路径', path);
                 let len = vm.fileGoodsList.length;
-                vm.fileGoodsList.push({ url: path.fullPath, goodsImgUrl: path.fullPath,imageUrl:path.fullPath, imgSort: len+1,imageSort: len+1, goodsId: vm.formData.goodsId });
+                vm.fileGoodsList.push({isChecked:false, url: path.fullPath, goodsImgUrl: path.fullPath,imageUrl:path.fullPath, imgSort: len+1,imageSort: len+1, goodsId: vm.formData.goodsId });
                 vm.isgoodsImages = true;
 
                 // vm.fileGoodsList.push({url:path.fullPath,goodsImgUrl: path.fullPath,imageUrl:path.fullPath,imageName:'',imageSort: len+1,imageType: 2,id: null,})