Jelajahi Sumber

运维增加上架商品

caojunjie 3 tahun lalu
induk
melakukan
201f492ebc

+ 25 - 0
src/views/basicData/productInformation/configuration/productParameters.json

@@ -0,0 +1,25 @@
+
+{
+  "border": true,
+  "index": true,
+  "viewBtn": false,
+  "editBtn": false,
+  "delBtn": false,
+  "addBtn": false,
+  "align": "center",
+  "menuWidth": 130,
+  "column": [
+    {
+      "label": "参数名称",
+      "prop": "cname",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "参数",
+      "prop": "cname",
+      "minWidth": 100,
+      "cell": true
+    }
+  ]
+}

+ 35 - 7
src/views/basicData/productInformation/configuration/specification.json

@@ -5,7 +5,8 @@
   "viewBtn": false,
   "editBtn": false,
   "delBtn": false,
-  "addBtn": false,
+  "addBtn": true,
+  "addBtnText": "新增明细",
   "align": "center",
   "menuWidth": 130,
   "column": [
@@ -29,41 +30,68 @@
     },
     {
       "label": "描述",
-      "prop": "describe",
+      "prop": "desgasdacribe",
       "minWidth": 100,
       "cell": true
     },
     {
       "label": "选择活动",
-      "prop": "describe",
+      "prop": "desfasdacribe",
       "minWidth": 100,
       "cell": true
     },
     {
       "label": "原始价格",
-      "prop": "describe",
+      "prop": "descasdaribe",
       "minWidth": 100,
       "cell": true
     },
     {
       "label": "活动价格",
-      "prop": "describe",
+      "prop": "deadsdscribe",
       "minWidth": 100,
       "cell": true
     },
     {
       "label": "活动库存",
-      "prop": "describe",
+      "prop": "descrdasdibe",
       "minWidth": 100,
       "cell": true
     },
     {
       "label": "普通库存",
-      "prop": "describe",
+      "prop": "describdasde",
       "minWidth": 100,
       "cell": true
     },
     {
+      "label": "标签",
+      "prop": "describeads",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "主图",
+      "prop": "describe",
+      "type": "upload",
+      "listType": "picture-img",
+      "span": 24,
+      "tip": "只能上传jpg/png/jpeg文件,且不超过2M,宽高比为1:1",
+      "action": "/api/blade-resource/oss/endpoint/put-file",
+      "dataType": "string",
+      "propsHttp": {
+        "res": "data",
+        "url": "link"
+      },
+      "rules": [
+        {
+          "required": false,
+          "message": "请上传图片",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
       "label": "备注",
       "prop": "remarks",
       "minWidth": 100,

+ 0 - 155
src/views/basicData/productInformation/detailsPageEdit.vue

@@ -29,92 +29,19 @@
           </template>
         </avue-form>
       </basic-container>
-      <containerTitle title="商品规格"></containerTitle>
-      <basic-container style="margin-bottom: 10px">
-        <avue-crud
-            :data="sftData"
-            :option="sftOption"
-            @row-del="rowSftDel"
-        >
-          <template slot="menuLeft" slot-scope="{ row, index }">
-            <el-button
-                type="primary"
-                icon="el-icon-plus"
-                size="small"
-                @click.stop="addSftRow(row, index)"
-            >新增明细
-            </el-button>
-          </template>
-          <template slot="menu" slot-scope="{ row, index }">
-            <el-button
-                size="small"
-                icon="el-icon-edit"
-                type="text"
-                @click.stop="rowSftEdit(row, index)"
-            >
-              {{ row.$cellEdit ? "保存" : "编辑" }}
-            </el-button>
-            <el-button
-                size="small"
-                icon="el-icon-edit"
-                type="text"
-                @click.stop="rowSftDel(row, index)">
-              删除
-            </el-button>
-            <el-button
-                size="small"
-                icon="el-icon-close"
-                type="text">
-              下架
-            </el-button>
-          </template>
-        </avue-crud>
-      </basic-container>
-      <containerTitle title="商品图片"></containerTitle>
-      <basic-container style="margin-bottom: 10px">
-        <avue-crud
-            ref="imgUpload"
-            :option="imgUploadList"
-            :data="imgUploadData"
-            @row-save="imgUploadSave"
-            @row-update="imgUploadUpdate"
-            @row-del="imgUploadDel"
-            :upload-before="uploadBefore"
-        ></avue-crud>
-      </basic-container>
-      <containerTitle title="详情页编辑"></containerTitle>
-      <basic-container style="margin-bottom: 10px">
-        <avue-ueditor v-model="text" :options="options"></avue-ueditor>
-      </basic-container>
     </div>
   </div>
 </template>
 <script>
 import {getDetail, updateDetail, getDeptTree, priceDelete} from "@/api/basicData/commodityType";
-import sftOption from "./configuration/specification.json";
-import imgUploadList from "./configuration/imgUploadList.json";
 
 export default {
   name: "detailsPage",
   data() {
     return {
       form: {},
-      sftData: [],
-      sftOption: sftOption,
-      imgUploadList: imgUploadList,
-      text: '<h1 class="ql-align-center" style="text-align: center;"><a href="https://avuejs.com/doc/plugins/ueditor-plugins" target="_blank" style="font-weight: bold; color: rgb(194, 79, 74);">欢迎使用Avue富文本编辑器</a></h1><p class="ql-align-center" style="text-align: center;"><span style="font-weight: bold; color: rgb(194, 79, 74);"><img src="https://avuejs.com/images/logo-bg.jpg" height="200" width="200"></span></p>',
-      options: {
-        //普通图片上传
-        action: "https://avuejs.com/imgupload",
-        customConfig: {}, //wangEditor编辑的配置
-        props: {
-          res: "data",
-          url: "url"
-        }
-      },
       disabled: false,
       userDialog: false,//供应商导入窗口
-      imgUploadData: [],
       dicData: [],
       detailsSelect: {},
       option: {
@@ -285,86 +212,6 @@ export default {
     }
   },
   methods: {
-    // 商品图片上传保存
-    imgUploadSave(row, done, loading) {
-      console.log(row);
-      this.imgUploadData.push(row);
-      done();
-    },
-    imgUploadUpdate(row, index, done, loading) {
-      done();
-    },
-    imgUploadDel(row, index, donerowDel) {
-      this.$confirm("确定将选择数据删除?", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning"
-      }).then(() => {
-        //商品判断是否需要调用删除接口
-        if (row.id) {
-          // corpsattn(row.id).then(res => {
-          //   this.$message({
-          //     type: "success",
-          //     message: "操作成功!"
-          //   });
-          //   this.imgUploadData.splice(index, 1);
-          // })
-        } else {
-          this.$message({
-            type: "success",
-            message: "操作成功!"
-          });
-          this.imgUploadData.splice(index, 1);
-        }
-      });
-    },
-    // 上传前
-    uploadBefore(file, done, loading, column) {
-      const is2M = file.size / 1024 / 1024 < 2;
-      const isType =
-          file.type === "image/jpeg" ||
-          file.type === "image/png" ||
-          file.type === "image/jpg";
-      if (!isType) {
-        this.$message.error("图片只能是JPG、JPEG、PNG格式");
-        loading();
-      }
-      if (!is2M) {
-        this.$message.error("图片大小不能超过2M");
-        loading();
-      }
-      const img = new Image();
-      const _URL = window.URL || window.webkitURL;
-      let isSize = null;
-      img.onload = () => {
-        if (column.label == "图片") {
-          isSize = img.width === img.height;
-          if (!isSize) {
-            this.$message.error("图片宽高限制比例为1:1");
-          }
-        } else {
-          const width = 750;
-          const height = 1000;
-          isSize = img.width === width && img.height <= height;
-          if (!isSize) {
-            this.$message.error("商品详情轮播图宽为750,高不能超过1000");
-          }
-        }
-        if (is2M && isType && isSize) {
-          done();
-        } else {
-          loading();
-        }
-      };
-      img.src = _URL.createObjectURL(file);
-    },
-    rowSftEdit(row) {
-      if (row.$cellEdit == true) {
-        this.$set(row, "$cellEdit", false);
-      } else {
-        this.$set(row, "$cellEdit", true);
-      }
-    },
     addSftRow() {
       this.sftData.push({
         $cellEdit: true,
@@ -375,8 +222,6 @@ export default {
         remarks: null
       });
     },
-    rowSftDel(row, index) {
-    },
     rowContactCell(row, index) {
       this.$refs.crudContact.rowCell(row, index)
     },

+ 0 - 14
src/views/basicData/productInformation/index.vue

@@ -33,20 +33,6 @@
               @click="excelBox = true"
             >导入
             </el-button>
-            <el-button
-              type="warning"
-              size="small"
-              icon="el-icon-bottom"
-              @click="excelBox = true"
-            >批量上架
-            </el-button>
-            <el-button
-              type="danger"
-              size="small"
-              icon="el-icon-bottom"
-              @click="excelBox = true"
-            >批量下架
-            </el-button>
           </template>
           <template slot-scope="scope" slot="menu">
 <!--            <el-button-->

+ 87 - 0
src/views/maintenance/goodsOnTheShelves/configuration/imgUploadList.json

@@ -0,0 +1,87 @@
+{
+  "lazy": true,
+  "align": "center",
+  "menuAlign": "left",
+  "tip": false,
+  "simplePage": true,
+  "searchShow": true,
+  "searchMenuSpan": 6,
+  "dialogWidth": "60%",
+  "tree": true,
+  "refreshBtn": false,
+  "border": true,
+  "index": true,
+  "selection": true,
+  "menuWidth": 300,
+  "dialogClickModal": false,
+  "addBtnText": "上  传",
+  "column": [{
+    "label": "文件名称",
+    "prop": "fileName",
+    "index": 1,
+    "width": 100,
+    "rules": [
+      {
+        "required": true,
+        "message": "请输入文件名称",
+        "trigger": "blur"
+      }
+    ]
+  },{
+    "label": "备注",
+    "prop": "remarks",
+    "index": 2,
+    "width": 100,
+    "rules": [
+      {
+        "required": false,
+        "message": "请输入备注",
+        "trigger": "blur"
+      }
+    ]
+  }, {
+    "label": "图片",
+    "prop": "img",
+    "type": "upload",
+    "index": 3,
+    "width": 150,
+    "listType": "picture-img",
+    "span": 24,
+    "tip": "只能上传jpg/png/jpeg文件,且不超过2M,宽高比为1:1",
+    "action": "/api/blade-resource/oss/endpoint/put-file",
+    "dataType": "string",
+    "propsHttp": {
+      "res": "data",
+      "url": "link"
+    },
+    "rules": [
+      {
+        "required": true,
+        "message": "请上传图片",
+        "trigger": "blur"
+      }
+    ]
+  },
+    {
+      "label": "商品详情轮播",
+      "prop": "string",
+      "dataType": "string",
+      "type": "upload",
+      "propsHttp": {
+        "res": "data",
+        "url": "link"
+      },
+      "span": 24,
+      "listType": "picture-card",
+      "tip": "只能上传jpg/png/jpeg文件,且不超过2M,宽为750,高不大于1000",
+      "action": "/api/blade-resource/oss/endpoint/put-file",
+      "rules": [
+        {
+          "required": true,
+          "message": "请上传图片",
+          "trigger": "blur"
+        }
+      ]
+    }
+  ]
+}

+ 96 - 0
src/views/maintenance/goodsOnTheShelves/configuration/mainList.json

@@ -0,0 +1,96 @@
+
+{
+  "height": "auto",
+  "calcHeight": 80,
+  "tip": false,
+  "searchShow": true,
+  "searchMenuSpan": 12,
+  "searchMenuPosition": "right",
+  "border": true,
+  "index": true,
+  "selection": true,
+  "viewBtn": false,
+  "editBtn": false,
+  "delBtn": false,
+  "dialogClickModal": false,
+  "column": [
+    {
+      "label": "产品编码",
+      "prop": "code",
+      "search": true,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": " ",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "产品名称",
+      "prop": "cname",
+      "search": true,
+      "width": 100,
+      "rules": [
+        {
+          "required": true,
+          "message": " ",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "产品类别",
+      "prop": "goodsTypeId",
+      "dicData": [],
+      "type": "tree",
+      "hide": true,
+      "addDisabled": false,
+      "multiple": true,
+      "props": {
+        "label": "title"
+      },
+      "rules": [{
+        "required": true,
+        "message": " ",
+        "trigger": "click"
+      }]
+    },
+    {
+      "label": "品牌",
+      "prop": "brand",
+      "width": 100
+    },
+    {
+      "label": "花纹",
+      "prop": "brandItem",
+      "width": 100
+    },
+    {
+      "label": "规格尺寸",
+      "prop": "specs",
+      "width": 100
+    },
+    {
+      "label": "规格尺寸1",
+      "prop": "specsOne",
+      "width": 100
+    },
+    {
+      "label": "规格尺寸2",
+      "prop": "specsTwo",
+      "width": 100
+    },
+    {
+      "label": "级别",
+      "prop": "level",
+      "width": 100
+    },
+    {
+      "label": "备注",
+      "prop": "remarks",
+      "width": 100
+    }
+  ]
+}

+ 25 - 0
src/views/maintenance/goodsOnTheShelves/configuration/productParameters.json

@@ -0,0 +1,25 @@
+
+{
+  "border": true,
+  "index": true,
+  "viewBtn": false,
+  "editBtn": false,
+  "delBtn": false,
+  "addBtn": false,
+  "align": "center",
+  "menuWidth": 130,
+  "column": [
+    {
+      "label": "参数名称",
+      "prop": "cname",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "参数",
+      "prop": "cname",
+      "minWidth": 100,
+      "cell": true
+    }
+  ]
+}

+ 101 - 0
src/views/maintenance/goodsOnTheShelves/configuration/specification.json

@@ -0,0 +1,101 @@
+
+{
+  "border": true,
+  "index": true,
+  "viewBtn": false,
+  "editBtn": false,
+  "delBtn": false,
+  "addBtn": true,
+  "addBtnText": "新增明细",
+  "align": "center",
+  "menuWidth": 130,
+  "column": [
+    {
+      "label": "规格名称",
+      "prop": "cname",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "材质",
+      "prop": "texture",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "颜色",
+      "prop": "colour",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "描述",
+      "prop": "desgasdacribe",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "选择活动",
+      "prop": "desfasdacribe",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "原始价格",
+      "prop": "descasdaribe",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "活动价格",
+      "prop": "deadsdscribe",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "活动库存",
+      "prop": "descrdasdibe",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "普通库存",
+      "prop": "describdasde",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "标签",
+      "prop": "describeads",
+      "minWidth": 100,
+      "cell": true
+    },
+    {
+      "label": "主图",
+      "prop": "describe",
+      "type": "upload",
+      "listType": "picture-img",
+      "span": 24,
+      "tip": "只能上传jpg/png/jpeg文件,且不超过2M,宽高比为1:1",
+      "action": "/api/blade-resource/oss/endpoint/put-file",
+      "dataType": "string",
+      "propsHttp": {
+        "res": "data",
+        "url": "link"
+      },
+      "rules": [
+        {
+          "required": false,
+          "message": "请上传图片",
+          "trigger": "blur"
+        }
+      ]
+    },
+    {
+      "label": "备注",
+      "prop": "remarks",
+      "minWidth": 100,
+      "cell": true
+    }
+  ]
+}

+ 506 - 0
src/views/maintenance/goodsOnTheShelves/detailsPageEdit.vue

@@ -0,0 +1,506 @@
+<template>
+  <div class="borderless">
+    <div class="customer-head">
+      <div class="customer-back">
+        <el-button type="danger" style="border: none;background: none;color: red" icon="el-icon-arrow-left"
+                   @click="backToList">返回列表
+        </el-button>
+      </div>
+      <el-button
+          class="el-button--small-yh add-customer-btn"
+          type="primary"
+          :disabled="disabled"
+          @click="editProductInfo"
+      >{{ form.id ? '确认修改' : '确认新增' }}
+      </el-button>
+    </div>
+    <div style="margin-top: 60px">
+      <containerTitle title="基础信息"></containerTitle>
+      <basic-container style="margin-bottom: 10px">
+        <avue-form ref="form" v-model="form" :option="option">
+          <template slot="goodsTypeId" slot-scope="scope">
+            <avue-input-tree
+                v-model="form.goodsTypeId"
+                :props="{ label: 'title', value: 'id' }"
+                multiple
+                placeholder=" "
+                type="tree"
+                :dic="dicData"/>
+          </template>
+        </avue-form>
+      </basic-container>
+      <containerTitle title="商品规格"></containerTitle>
+      <basic-container style="margin-bottom: 10px">
+        <avue-crud
+            :data="sftData"
+            :option="sftOption"
+            @row-save="rowSave"
+            @row-del="rowSftDel"
+        >
+          <template slot="menu" slot-scope="{ row, index }">
+            <el-button
+                size="small"
+                icon="el-icon-edit"
+                type="text"
+                @click.stop="rowSftEdit(row, index)"
+            >
+              {{ row.$cellEdit ? "保存" : "编辑" }}
+            </el-button>
+            <el-button
+                size="small"
+                icon="el-icon-edit"
+                type="text"
+                @click.stop="rowSftDel(row, index)">
+              删除
+            </el-button>
+            <el-button
+                size="small"
+                icon="el-icon-close"
+                type="text">
+              下架
+            </el-button>
+          </template>
+        </avue-crud>
+      </basic-container>
+      <containerTitle title="产品参数"></containerTitle>
+      <basic-container style="margin-bottom: 10px">
+        <avue-crud
+            :data="sftDataParameters"
+            :option="productParameters"
+            @row-del="rowSftDel"
+        >
+          <template slot="menuLeft" slot-scope="{ row, index }">
+            <el-button
+                type="primary"
+                icon="el-icon-plus"
+                size="small"
+                @click.stop="parameterAddition(row, index)"
+            >新增明细
+            </el-button>
+          </template>
+          <template slot="menu" slot-scope="{ row, index }">
+            <el-button
+                size="small"
+                icon="el-icon-edit"
+                type="text"
+                @click.stop="rowSftEdit(row, index)"
+            >
+              {{ row.$cellEdit ? "保存" : "编辑" }}
+            </el-button>
+            <el-button
+                size="small"
+                icon="el-icon-edit"
+                type="text"
+                @click.stop="rowSftDel(row, index)">
+              删除
+            </el-button>
+          </template>
+        </avue-crud>
+      </basic-container>
+      <containerTitle title="商品图片"></containerTitle>
+      <basic-container style="margin-bottom: 10px">
+        <avue-crud
+            ref="imgUpload"
+            :option="imgUploadList"
+            :data="imgUploadData"
+            @row-save="imgUploadSave"
+            @row-update="imgUploadUpdate"
+            @row-del="imgUploadDel"
+            :upload-before="uploadBefore"
+        ></avue-crud>
+      </basic-container>
+      <containerTitle title="详情页编辑"></containerTitle>
+      <basic-container style="margin-bottom: 10px">
+        <avue-ueditor v-model="text" :options="options"></avue-ueditor>
+      </basic-container>
+    </div>
+  </div>
+</template>
+<script>
+import {getDetail, updateDetail, getDeptTree, priceDelete} from "@/api/basicData/commodityType";
+import sftOption from "./configuration/specification.json";
+import imgUploadList from "./configuration/imgUploadList.json";
+import productParameters from "./configuration/productParameters.json";
+import {add} from "@/api/system/dict";
+
+export default {
+  name: "detailsPage",
+  data() {
+    return {
+      form: {},
+      sftData: [],
+      sftOption: sftOption,
+      imgUploadList: imgUploadList,
+      productParameters: productParameters,
+      text: '<h1 class="ql-align-center" style="text-align: center;"><a href="https://avuejs.com/doc/plugins/ueditor-plugins" target="_blank" style="font-weight: bold; color: rgb(194, 79, 74);">欢迎使用Avue富文本编辑器</a></h1><p class="ql-align-center" style="text-align: center;"><span style="font-weight: bold; color: rgb(194, 79, 74);"><img src="https://avuejs.com/images/logo-bg.jpg" height="200" width="200"></span></p>',
+      options: {
+        //普通图片上传
+        action: "https://avuejs.com/imgupload",
+        customConfig: {}, //wangEditor编辑的配置
+        props: {
+          res: "data",
+          url: "url"
+        }
+      },
+      disabled: false,
+      userDialog: false,//供应商导入窗口
+      imgUploadData: [],
+      dicData: [],
+      sftDataParameters: [],
+      detailsSelect: {},
+      option: {
+        menuBtn: false,
+        labelWidth: 100,
+        column: [
+          {
+            label: "产品编码",
+            prop: "code",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+          },
+          {
+            label: "产品名称",
+            prop: "cname",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+            slot: true
+          },
+          {
+            label: "产品分类",
+            prop: "goodsTypeId",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+          },
+          {
+            label: "花纹",
+            prop: "brandItem",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+          },
+          {
+            label: "品牌",
+            prop: "brand",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+          },
+          {
+            label: "状态",
+            prop: "status",
+            span: 8,
+            type: 'select',
+            dicData: [{
+              label: '正常',
+              value: 0
+            }, {
+              label: '停用',
+              value: 1
+            }],
+          },
+          {
+            label: "规格",
+            prop: "specs",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+          },
+          {
+            label: "规格1",
+            prop: "specsOne",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+          },
+          {
+            label: "规格2",
+            prop: "specsTwo",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+          },
+          {
+            label: "级别",
+            prop: "level",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+          },
+          {
+            label: "产地",
+            prop: "placeProduction",
+            span: 8,
+            rules: [
+              {
+                required: true,
+                message: " ",
+                trigger: "blur"
+              }
+            ],
+          },
+          {
+            label: "三包",
+            prop: "threeGuarantees",
+            span: 8,
+          },
+          {
+            label: "备注",
+            prop: "remarks",
+            type: "textarea",
+            minRows: 2,
+            span: 24
+          }
+        ]
+      },
+    }
+  },
+  //初始化查询
+  created() {
+    getDeptTree().then(res => {
+      this.dicData = res.data.data;
+    });
+    if (this.$route.query.id) {
+      getDetail(JSON.parse(this.$route.query.id)).then(res => {
+        this.form = res.data.data
+      })
+    } else {
+      this.$set(this.form, "goodsTypeId", this.$route.query.treeDeptId)
+    }
+  },
+  methods: {
+    // 商品图片上传保存
+    imgUploadSave(row, done, loading) {
+      console.log(row);
+      this.imgUploadData.push(row);
+      done();
+    },
+    imgUploadUpdate(row, index, done, loading) {
+      done();
+    },
+    imgUploadDel(row, index, donerowDel) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        //商品判断是否需要调用删除接口
+        if (row.id) {
+          // corpsattn(row.id).then(res => {
+          //   this.$message({
+          //     type: "success",
+          //     message: "操作成功!"
+          //   });
+          //   this.imgUploadData.splice(index, 1);
+          // })
+        } else {
+          this.$message({
+            type: "success",
+            message: "操作成功!"
+          });
+          this.imgUploadData.splice(index, 1);
+        }
+      });
+    },
+    // 上传前
+    uploadBefore(file, done, loading, column) {
+      const is2M = file.size / 1024 / 1024 < 2;
+      const isType =
+          file.type === "image/jpeg" ||
+          file.type === "image/png" ||
+          file.type === "image/jpg";
+      if (!isType) {
+        this.$message.error("图片只能是JPG、JPEG、PNG格式");
+        loading();
+      }
+      if (!is2M) {
+        this.$message.error("图片大小不能超过2M");
+        loading();
+      }
+      const img = new Image();
+      const _URL = window.URL || window.webkitURL;
+      let isSize = null;
+      img.onload = () => {
+        if (column.label == "图片") {
+          isSize = img.width === img.height;
+          if (!isSize) {
+            this.$message.error("图片宽高限制比例为1:1");
+          }
+        } else {
+          const width = 750;
+          const height = 1000;
+          isSize = img.width === width && img.height <= height;
+          if (!isSize) {
+            this.$message.error("商品详情轮播图宽为750,高不能超过1000");
+          }
+        }
+        if (is2M && isType && isSize) {
+          done();
+        } else {
+          loading();
+        }
+      };
+      img.src = _URL.createObjectURL(file);
+    },
+    rowSftEdit(row) {
+      if (row.$cellEdit == true) {
+        this.$set(row, "$cellEdit", false);
+      } else {
+        this.$set(row, "$cellEdit", true);
+      }
+    },
+    addSftRow() {
+      this.sftData.push({
+        $cellEdit: true,
+        cname: null,
+        texture: null,
+        colour: null,
+        describe: null,
+        remarks: null
+      });
+    },
+    parameterAddition() {
+      this.sftDataParameters.push({
+        $cellEdit: true,
+        cname: null
+      });
+    },
+    rowSave(row, done, loading) {
+      done(row);
+    },
+    rowSftDel(row, index) {
+    },
+    rowContactCell(row, index) {
+      this.$refs.crudContact.rowCell(row, index)
+    },
+    rowPurchaseCell(row, index) {
+      this.$refs.crudPurchase.rowCell(row, index)
+    },
+    //修改提交触发
+    editProductInfo() {
+      this.$refs["form"].validate((valid) => {
+        //校验明细列表
+        if (valid) {
+          const params = {
+            ...this.form,
+            type: 0,
+          }
+          updateDetail(params).then(res => {
+            if (res.data.success) {
+              this.$message.success("操作成功!")
+            }
+          })
+        } else {
+          return false;
+        }
+      });
+    },
+    //返回列表
+    backToList() {
+      this.$router.$avueRouter.closeTag();
+      this.$router.push({
+        path: '../index',
+        query: {}
+      });
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.customer-head {
+  position: fixed;
+  top: 105px;
+  width: 100%;
+  margin-left: -10px;
+  height: 62px;
+  background: #ffffff;
+  box-shadow: 0 4px 12px 0px rgba(232, 232, 235, 1);
+  z-index: 999;
+  /* display: flex;
+  justify-content: left; */
+}
+
+.customer-back {
+  cursor: pointer;
+  line-height: 62px;
+  font-size: 16px;
+  color: #323233;
+  font-weight: 400;
+}
+
+.back-icon {
+  line-height: 64px;
+  font-size: 20px;
+  margin-right: 8px;
+}
+
+.add-customer-btn {
+  position: fixed;
+  right: 36px;
+  top: 115px;
+}
+
+::v-deep .el-form-item {
+  margin-bottom: 0;
+}
+
+.el-dialogDeep {
+  ::v-deep .el-dialog {
+    margin: 1vh auto 0 !important;
+    padding-bottom: 10px !important;
+
+    .el-dialog__body, .el-dialog__footer {
+      padding-bottom: 0 !important;
+      padding-top: 0 !important;
+    }
+  }
+}
+</style>

+ 450 - 0
src/views/maintenance/goodsOnTheShelves/index.vue

@@ -0,0 +1,450 @@
+<template>
+  <el-row>
+    <el-col :span="5">
+      <basic-container>
+        <avue-tree :option="treeOption" :data="treeData" @node-click="nodeClick"/>
+      </basic-container>
+    </el-col>
+    <el-col :span="19">
+      <basic-container>
+        <avue-crud :option="option"
+                   :search.sync="search"
+                   :table-loading="loading"
+                   :data="data"
+                   ref="crud"
+                   v-model="form"
+                   @row-del="rowDel"
+                   @row-update="rowUpdate"
+                   @row-save="rowSave"
+                   :before-open="beforeOpenE"
+                   :page.sync="page"
+                   @search-change="searchChange"
+                   @search-reset="searchReset"
+                   @selection-change="selectionChange"
+                   @current-change="currentChange"
+                   @size-change="sizeChange"
+                   @refresh-change="refreshChange"
+                   @on-load="onLoad">
+          <template slot="menuLeft">
+            <el-button
+              type="primary"
+              size="small"
+              icon="el-icon-bottom"
+              @click="excelBox = true"
+            >导入
+            </el-button>
+            <el-button
+              type="warning"
+              size="small"
+              icon="el-icon-bottom"
+              @click="excelBox = true"
+            >批量上架
+            </el-button>
+            <el-button
+              type="danger"
+              size="small"
+              icon="el-icon-bottom"
+              @click="excelBox = true"
+            >批量下架
+            </el-button>
+          </template>
+          <template slot-scope="scope" slot="menu">
+<!--            <el-button-->
+<!--                type="text"-->
+<!--                icon="el-icon-view"-->
+<!--                size="small"-->
+<!--                @click.stop="beforeOpenPage(scope.row, scope.index)"-->
+<!--            >查看-->
+<!--            </el-button>-->
+            <el-button
+                type="text"
+                icon="el-icon-edit"
+                size="small"
+                @click.stop="editOpen(scope.row, scope.index)"
+            >编辑
+            </el-button>
+            <el-button
+                type="text"
+                icon="el-icon-delete"
+                size="small"
+                @click.stop="rowDel(scope.row, scope.index)"
+            >删除
+            </el-button>
+            <el-button
+                type="text"
+                icon="el-icon-delete"
+                size="small"
+            >下架
+            </el-button>
+          </template>
+        </avue-crud>
+        <el-dialog title="导入产品"
+                   append-to-body
+                   :visible.sync="excelBox"
+                   width="555px">
+          <avue-form :option="excelOption" v-model="excelForm" :upload-after="uploadAfter">
+            <template slot="excelTemplate">
+              <el-button type="primary" @click="derivation">
+                点击下载<i class="el-icon-download el-icon--right"></i>
+              </el-button>
+            </template>
+          </avue-form>
+          <p style="text-align: center;color: #DC0505">温馨提示  第一次导入时请先下载模板</p>
+        </el-dialog>
+      </basic-container>
+    </el-col>
+  </el-row>
+</template>
+<script>
+import {getList, getUser, getUserPlatform, remove, updatePlatform, add, grant, getDeptLazyTree, getDeptTree} from "@/api/basicData/commodityType";
+import {getRoleTree} from "@/api/system/role";
+import {mapGetters} from "vuex";
+import website from '@/config/website';
+import {getToken} from '@/util/auth';
+import option from "./configuration/mainList.json";
+export default {
+  data() {
+    return {
+      form: {},
+      search:{},
+      roleBox: false,
+      excelBox: false,
+      platformBox: false,
+      initFlag: true,
+      selectionList: [],
+      query: {},
+      loading: true,
+      platformLoading: false,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      platformPage: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      init: {
+        roleTree: [],
+        deptTree: [],
+      },
+      props: {
+        label: "title",
+        value: "key"
+      },
+      roleGrantList: [],
+      roleTreeObj: [],
+      treeDeptId: '',
+      treeData: [],
+      treeOption: {
+        nodeKey: 'id',
+        lazy: true,
+        treeLoad: function (node, resolve) {
+          const parentId = (node.level === 0) ? 0 : node.data.id;
+          getDeptLazyTree(parentId).then(res => {
+            resolve(res.data.data.map(item => {
+              return {
+                ...item,
+                leaf: !item.hasChildren
+              }
+            }))
+          });
+        },
+        addBtn: false,
+        menu: false,
+        size: 'small',
+        props: {
+          labelText: '标题',
+          label: 'title',
+          value: 'value',
+          children: 'children'
+        }
+      },
+      option: option,
+      data: [],
+      platformQuery: {},
+      platformSelectionList: [],
+      platformData: [],
+      platformForm: {},
+      excelForm: {},
+      excelOption: {
+        submitBtn: false,
+        emptyBtn: false,
+        column: [
+          {
+            label: '模板下载',
+            prop: 'excelTemplate',
+            formslot: true,
+            span: 24,
+          },
+          {
+            label: '模板上传',
+            prop: 'excelFile',
+            type: 'upload',
+            drag: true,
+            loadText: '模板上传中,请稍等',
+            span: 24,
+            propsHttp: {
+              res: 'data',
+            },
+            tip: '请上传 .xls,.xlsx 标准格式文件',
+            action: "/api/blade-client/goodsdesc/import-desc",
+          },
+        ]
+      }
+    };
+  },
+  methods: {
+    derivation() {
+      window.open(`/api/blade-client/goodsdesc/export-template?${this.website.tokenHeader}=${getToken()}`);
+    },
+    uploadAfter(res, done, loading, column) {
+      window.console.log(column);
+      this.excelBox = false;
+      this.refreshChange();
+      done();
+    },
+    nodeClick(data) {
+      this.treeDeptId = data.id;
+      this.page.currentPage = 1;
+      this.onLoad(this.page);
+    },
+    initData(tenantId) {
+      getDeptTree().then(res => {
+        const column = this.findObject(this.option.column, "goodsTypeId");
+        column.dicData = res.data.data;
+      });
+    },
+    submitRole() {
+      const roleList = this.$refs.treeRole.getCheckedKeys().join(",");
+      grant(this.ids, roleList).then(() => {
+        this.roleBox = false;
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        this.onLoad(this.page);
+      });
+    },
+    rowSave(row, done, loading) {
+      row.goodsTypeId = row.goodsTypeId.join(",");
+      add(row).then(() => {
+        this.initFlag = false;
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        window.console.log(error);
+        loading();
+      });
+    },
+    rowUpdate(row, index, done, loading) {
+      row.goodsTypeId = row.goodsTypeId.join(",");
+      add(row).then(() => {
+        this.initFlag = false;
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        window.console.log(error);
+        loading();
+      });
+    },
+    //查看跳转页面
+    beforeOpenPage(row, index) {
+      this.$router.push({
+        path: "/productInfo_detailsPageEdit",
+        query: { id: JSON.stringify(row.id) }
+      });
+    },
+    //新增跳转页面
+    beforeOpenE(row, index) {
+      this.$router.push({
+        path: "/productInfo_detailsPageEdit",
+        query: { id: JSON.stringify(row.id),treeDeptId:this.treeDeptId }
+      });
+    },
+    //编辑跳转页面
+    editOpen(row, index) {
+      this.$router.push({
+        path: "/productInfo_detailsPageEdit",
+        query: { id: JSON.stringify(row.id) }
+      });
+    },
+    //删除触发
+    rowDel(row, index, done) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+          .then(() => {
+            return remove(row.id);
+          })
+          .then(() => {
+            this.onLoad(this.page);
+            this.$message({
+              type: "success",
+              message: "操作成功!"
+            });
+            done()
+          });
+    },
+    searchReset() {
+      this.query = {};
+      this.treeDeptId = '';
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    handleGrant() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.roleTreeObj = [];
+      if (this.selectionList.length === 1) {
+        this.roleTreeObj = this.selectionList[0].roleId.split(",");
+      }
+      getRoleTree().then(res => {
+        this.roleGrantList = res.data.data;
+        this.roleBox = true;
+      });
+    },
+    handlePlatform() {
+      this.platformBox = true;
+    },
+    handleImport() {
+      this.excelBox = true;
+    },
+    handleTemplate() {
+      window.open(`/api/blade-user/export-template?${this.website.tokenHeader}=${getToken()}`);
+    },
+    //新增编辑查看触发
+    async beforeOpen(done, type) {
+      if (["add"].includes(type)) {
+        this.option.column.forEach(e=>{
+          if(e.prop=='goodsTypeId'){
+            this.$set(this.option.column,2,{...e,value:this.treeDeptId})
+          }
+        })
+      }
+      if (["edit", "view"].includes(type)) {
+        await getUser(this.form.id).then(res => {
+          this.form = res.data.data;
+          // this.form.goodsTypeId = [this.form.goodsTypeId.replace(/\"/g,"")]
+          console.log(this.form.hasOwnProperty("goodsTypeId"))
+          if(this.form.hasOwnProperty("goodsTypeId")){
+            this.form.goodsTypeId = this.form.goodsTypeId.split(",");
+          }
+        });
+      }
+      if (["add", "edit"].includes(type)) {
+        this.initData(0);
+      }
+      this.initFlag = true;
+      done();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query), this.treeDeptId).then(res => {
+        const data = res.data.data;
+        this.data = data.records;
+        this.page.total = res.data.data.total
+        this.loading = false;
+        this.selectionClear();
+      });
+    },
+    platformRowUpdate(row, index, done, loading) {
+      updatePlatform(row.id, row.userType, row.userExt).then(() => {
+        this.platformOnLoad(this.platformPage);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        done();
+      }, error => {
+        window.console.log(error);
+        loading();
+      });
+    },
+    platformBeforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getUserPlatform(this.platformForm.id).then(res => {
+          this.platformForm = res.data.data;
+        });
+      }
+      done();
+    },
+    platformSearchReset() {
+      this.platformQuery = {};
+      this.platformOnLoad(this.platformPage);
+    },
+    platformSearchChange(params, done) {
+      this.platformQuery = params;
+      this.platformPage.currentPage = 1;
+      this.platformOnLoad(this.platformPage, params);
+      done();
+    },
+    platformSelectionChange(list) {
+      this.platformSelectionList = list;
+    },
+    platformSelectionClear() {
+      this.platformSelectionList = [];
+      this.$refs.platformCrud.toggleSelection();
+    },
+    platformCurrentChange(currentPage) {
+      this.platformPage.currentPage = currentPage;
+    },
+    platformSizeChange(pageSize) {
+      this.platformPage.pageSize = pageSize;
+    },
+    platformRefreshChange() {
+      this.platformOnLoad(this.platformPage, this.platformQuery);
+    },
+    platformOnLoad(page, params = {}) {
+      this.platformLoading = true;
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query), this.treeDeptId).then(res => {
+        const data = res.data.data;
+        this.platformPage.total = data.total;
+        this.platformData = data.records;
+        this.platformLoading = false;
+        this.selectionClear();
+      });
+    }
+  }
+};
+</script>
+
+<style>
+.el-scrollbar {
+  height: 100%;
+}
+</style>