修改价格

src/api/modules/mer_admin.js

@@ -1,67 +1,86 @@
-import $http from '@/utils/httpRequest.js'
+import $http from "@/utils/httpRequest.js";
-import city_data from '@/utils/country-level2-data.js'
+import city_data from "@/utils/country-level2-data.js";
 
 export const mer_admin = {
-    /** 
+  /**
- * 登录
+   * 登录
- * @param {object} params LoginParam
+   * @param {object} params LoginParam
- * @param {number} params.type 
+   * @param {number} params.type
- * @param {string} params.role 
+   * @param {string} params.role
- * @param {string} params.username 
+   * @param {string} params.username
- * @param {string} params.password 
+   * @param {string} params.password
- * @param {string} params.mobile 
+   * @param {string} params.mobile
- * @param {string} params.code 
+   * @param {string} params.code
- * @returns
+   * @returns
- */
+   */
-    loginByAccount: (params) => {
+  loginByAccount: (params) => {
-        return $http.post(`/auth/login`, {
+    return $http.post(`/auth/login`, {
-            ...params,
+      ...params,
-            type: 1
+      type: 1,
-        })
+    });
-    },
+  },
-    loginByMobile: (params) => {
+  loginByMobile: (params) => {
-        return $http.post(`/merchant-api/auth/sms/login`, {
+    return $http.post(`/merchant-api/auth/sms/login`, {
-            ...params,
+      ...params,
-            type: 2
+      type: 2,
-        })
+    });
-    },
+  },
-    getYZM(mobile) {
+  getYZM(mobile) {
-        return $http.get(`/merchant-api/auth/login/code?mobile=${mobile}`);
+    return $http.get(`/merchant-api/auth/login/code?mobile=${mobile}`);
-    },
+  },
-    getInfo() {
+  getInfo() {
-        return $http.get(`/merchant-api/auth/info`);
+    return $http.get(`/merchant-api/auth/info`);
-    },
+  },
-    //商品管理
+  //商品管理
-    //保存商品信息
+  //保存商品信息
-    saveProduct: (data) => {
+  saveProduct: (data) => {
-        return $http.post(`/merchant-api/product/save`, data);
+    return $http.post(`/merchant-api/product/save`, data);
-    },
+  },
-    //保存商品基本信息
+  //保存商品基本信息
-    saveProductBase: (data) => {
+  saveProductBase: (data) => {
-        return $http.post(`/merchant-api/product/save/basic`, data);
+    return $http.post(`/merchant-api/product/save/basic`, data);
-    },
+  },
-    //返回商品分类以及列表(聚合)
+  //返回商品分类以及列表(聚合)
-    getPolyProduct: (data) => {
+  getPolyProduct: (data) => {
-        return $http.post(`/merchant-api/product/polymerization/list`, data);
+    return $http.post(`/merchant-api/product/polymerization/list`, data);
-    },
+  },
-    //商品分页
+  //商品分页
-    getProductPage: (data) => {
+  getProductPage: (data) => {
-        return $http.post(`/merchant-api/product/page`, data);
+    return $http.post(
-    },
+      `/merchant-api/product/page?pageNumber=${data.p.pageNumber}&pageSize=${data.p.pageSize}`,
-    //商户商品分类
+      data
-    getProductCategory: () => {
+    );
-        return $http.get(`/merchant-api/product/category/list?shopId=${JSON.parse(sessionStorage.getItem('userInfo')).shopId}`);
+  },
-    },
+  //商户商品分类
-    //获取销售单位
+  getProductCategory: () => {
-    getSaleUnit: (data) => {
+    return $http.get(
-        return $http.request({ url: `/merchant-api/product/unit/list`, method: 'get', params: data });
+      `/merchant-api/product/category/list?shopId=${
-    },
+        JSON.parse(sessionStorage.getItem("userInfo")).shopId
-    //文件上传
+      }`
-    uploadFile:()=>{
+    );
-        return `${window.SITE_CONFIG['baseUrl']}/merchant-api/file/upload`
+  },
-    },
+  //批量删除商品
-    //直接获取城市数据
+  BatchDeleteProducts: (data) => {
-    getCityOptions:()=>{
+    return $http.post(`/merchant-api/product/batch/delete`, data);
-        return city_data;
+  },
-    }
+  //上架或下架商品
-}
+  putOnShelvesProducts: (data) => {
+    return $http.post(`/merchant-api/product/batch/update/status`, data);
+  },
+  //获取销售单位
+  getSaleUnit: (data) => {
+    return $http.request({
+      url: `/merchant-api/product/unit/list`,
+      method: "get",
+      params: data,
+    });
+  },
+  //文件上传
+  uploadFile: () => {
+    return `${window.SITE_CONFIG["baseUrl"]}/merchant-api/file/upload`;
+  },
+  //直接获取城市数据
+  getCityOptions: () => {
+    return city_data;
+  },
+};

src/views/modules/product/index.vue

@@ -1,10 +1,13 @@
 <template>
-  <div>
+  <div style="height: calc(100vh - 200px)">
     <obj-table-plus
       ref="oTable"
+      style="height: 100%"
       :tableCols="tableCols"
+      :tableProp="tableProp"
       @query="queryList"
       v-model="dataList"
+      :tableEvent="tableEvent"
     >
       <template slot="tableTop">
         <el-form :inline="true" :model="formInline" class="demo-form-inline">
@@ -42,17 +45,28 @@
           <el-button type="primary" size="small" @click="addProduct"
             >添加商品</el-button
           >
+          <el-button
+            :disabled="selectList.length <= 0"
+            type="danger"
+            size="small"
+            @click="deleteProduct"
+            >批量删除</el-button
+          >
         </div>
       </template>
     </obj-table-plus>
+    <!-- 添加或编辑 -->
     <add-or-update ref="addOrUpdate"></add-or-update>
+    <!-- 改价格 -->
+    <AddPrice ref="AddPrice" @queryList="$refs.oTable.reload()"></AddPrice>
   </div>
 </template>
 
 <script>
+import AddPrice from "./popup/add-price.vue";
 import AddOrUpdate from "./popup/add-or-update.vue";
 export default {
-  components: { AddOrUpdate },
+  components: { AddOrUpdate, AddPrice },
   data() {
     return {
       activeName: "出售中",
@@ -61,13 +75,42 @@ export default {
         user: "",
         region: "",
       },
+      tableProp: {
+        "auto-resize": true,
+        border: true,
+        height: "auto",
+        "row-id": "id",
+      },
       productFilterType: "SALE",
+      selectList: [],
     };
   },
   methods: {
     addProduct() {
       this.$refs.addOrUpdate.toggle().add();
     },
+    deleteProduct() {
+      console.log(this.selectList);
+      let integers = this.selectList.map((item) => {
+        return item.id;
+      });
+      this.$confirm("此操作将删除该商品, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.$api.mer_admin.BatchDeleteProducts(integers).then((res) => {
+            this.$refs.oTable.reload();
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
     queryList(pageNo, pageSize) {
       this.$api.mer_admin
         .getProductPage({
@@ -109,32 +152,166 @@ export default {
   computed: {
     tableCols() {
       return [
-        {
+        { type: "checkbox", width: "60px", fixed: "left" },
-          title: "ID",
+        // { type: "seq", width: "60px", align: "center", title: "序号" },
-        },
         {
           title: "商品图",
+          field: "productPhotoList",
+          align: "center",
+          width: "160px",
+          type: "jsx",
+          render: ({ row }) => {
+            if (row.productPhotoList.length > 0) {
+              return <el-image src={row.productPhotoList[0].url}></el-image>;
+            } else {
+              return <span>暂无商品图</span>;
+            }
+          },
         },
         {
           title: "商品名称",
+          align: "center",
+          field: "name",
         },
         {
           title: "商品售价",
+          align: "center",
+          field: "minSalePrice",
+          type: "jsx",
+          render: ({ row }) => {
+            if (row.minSalePrice == row.maxSalePrice) {
+              return <span>￥{row.minSalePrice}</span>;
+            } else {
+              return (
+                <span>
+                  ￥{row.minSalePrice}~￥{row.maxSalePrice}
+                </span>
+              );
+            }
+          },
         },
         {
           title: "销量",
+          align: "center",
+          field: "saleNum",
         },
         {
           title: "库存",
+          align: "center",
+          field: "stockNum",
         },
         {
           title: "状态",
+          // fixed: "right",
+          type: "jsx",
+          align: "center",
+          "title-suffix": {
+            message: "点击上架/下架切换责任书状态",
+            icon: "vxe-icon-question-circle-fill",
+          },
+          render: ({ row }) => {
+            let Enable = () => {
+              let data = {
+                ids: [row.id],
+                status: "UP",
+              };
+              if (row.status == "UP") {
+                data.status = "DOWN";
+              } else {
+                data.status = "UP";
+              }
+              this.$api.mer_admin.putOnShelvesProducts(data).then((res) => {
+                console.log(res);
+                this.$refs.oTable.reload();
+              });
+            };
+            return (
+              <el-popconfirm
+                title={
+                  row.status == "DOWN"
+                    ? "当前为下架状态，是否更改为上架状态？"
+                    : "当前为上架状态，是否更改为下架状态？"
+                }
+                confirmButtonText={
+                  row.status == "DOWN" ? "确认上架" : "确认下架"
+                }
+                onConfirm={Enable}
+              >
+                <el-button
+                  slot="reference"
+                  size="mini"
+                  plain
+                  type={row.status == "DOWN" ? "info" : "success"}
+                >
+                  {row.status == "DOWN" ? "已下架" : "上架中"}
+                </el-button>
+              </el-popconfirm>
+            );
+          },
         },
         {
           title: "操作",
+          fixed: "right",
+          type: "jsx",
+          align: "center",
+          width: "340px",
+          render: ({ row }) => {
+            const grant = () => {};
+            let edit = () => {};
+            let priceAdjustment = () => {
+              console.log(row);
+              this.$refs.AddPrice.toggle(row).update();
+            };
+            return (
+              <div>
+                <el-button
+                  size="mini"
+                  disabled={row.status != "DOWN"}
+                  type="primary"
+                  onClick={edit}
+                >
+                  编辑
+                </el-button>
+                <el-button
+                  size="mini"
+                  disabled={row.status != "DOWN"}
+                  type="primary"
+                  onClick={priceAdjustment}
+                >
+                  改价
+                </el-button>
+                <el-button
+                  size="mini"
+                  disabled={row.status != "DOWN"}
+                  type="primary"
+                  onClick={grant}
+                >
+                  改库存
+                </el-button>
+                <el-button
+                  size="mini"
+                  disabled={row.status != "DOWN"}
+                  type="primary"
+                  onClick={grant}
+                >
+                  设置折扣
+                </el-button>
+              </div>
+            );
+          },
         },
       ];
     },
+    tableEvent() {
+      return {
+        "checkbox-all": ({ records, reserves }) => {
+          this.selectList = [...records, ...reserves];
+        },
+        "checkbox-change": ({ records, reserves }) => {
+          this.selectList = [...records, ...reserves];
+        },
+      };
+    },
   },
 };
 </script>

src/views/modules/product/popup/add-or-update.vue

@@ -10,7 +10,7 @@
       :modalHandles="modalHandles"
     >
       <template slot="dialog__before">
-        <el-tabs v-model="currentPanel">
+        <el-tabs :before-leave="beforeTabLeave" v-model="currentPanel">
           <el-tab-pane label="基础信息" name="基础信息"></el-tab-pane>
           <el-tab-pane label="销售信息" name="销售信息"></el-tab-pane>
           <el-tab-pane label="其他信息" name="其他信息"></el-tab-pane>
@@ -147,6 +147,7 @@ export default {
       },
       fileList: [], //回显图片
       place: "", //场地
+      passCheck: [], //通行证
     };
   },
   mounted() {},
@@ -235,6 +236,13 @@ export default {
       ];
       console.log(this.modalData);
     },
+    beforeTabLeave(activeName) {
+      let state = "";
+      this.$refs.modal.validate((valid) => {
+        state = valid;
+      });
+      return state;
+    },
   },
   computed: {
     modalCols() {

src/views/modules/product/popup/add-price.vue

@@ -0,0 +1,185 @@
+<template>
+  <div>
+    <obj-modal
+      ref="modal"
+      labelWidth="100px"
+      :modalConfig="modalConfig"
+      :modalCols="modalCols"
+      :modalData="modalData"
+      :modalHandles="modalHandles"
+    >
+      <obj-table-plus
+        v-show="tableData.length > 1"
+        style="height: calc(100vh - 120px - 240px)"
+        slot="dialog__after"
+        ref="oTable"
+        :toolbarProp="{}"
+        @query="queryTableData"
+        v-model="tableData"
+        :tableCols="tableCols"
+        :tableProp="tableProp"
+        :tableEvent="tableEvent"
+        :isPagination="false"
+        :enableAutoQuery="false"
+      >
+      </obj-table-plus>
+    </obj-modal>
+  </div>
+</template>
+<script>
+import { debounce, cloneDeep } from "lodash";
+export default {
+  components: {},
+  data() {
+    return {
+      isAdd: true,
+      //监控对象数据
+      tableData: [],
+      //表格属性
+      tableProp: {
+        height: "auto",
+        border: true,
+        "auto-resize": false,
+        "print-config": {},
+      },
+      toolbarProp: {},
+      tableEvent: {},
+      modalConfig: {
+        title: "修改价格",
+        show: false,
+        width: "60%",
+      },
+      modalData: {},
+    };
+  },
+  methods: {
+    queryTableData(pageNo, pageSize) {},
+    toggle(e) {
+      if (this.modalConfig.show == false) {
+        this.modalConfig.show = true;
+        this.$nextTick(() => {
+          this.$refs.oTable.doLayout();
+        });
+      } else {
+        this.modalConfig.show = false;
+      }
+      if (e) {
+        this.init(cloneDeep(e));
+      }
+      return {
+        add: () => {
+          this.modalData = {};
+          this.$nextTick(() => {
+            this.$refs.oTable.complete(false);
+          });
+        },
+        update: () => {
+          this.isAdd = false;
+        },
+      };
+    },
+    init(row) {
+      this.modalData = row;
+      this.tableData = row.productSpecificationList;
+      console.log(this.modalData);
+    },
+  },
+  computed: {
+    modalCols() {
+      if (this.tableData.length == 1) {
+        return [
+          {
+            label: "价格",
+            prop: "",
+            type: "Input",
+            width: "300px",
+            rules: { required: true, message: "请输入价格" },
+            type: "jsx",
+            render: () => {
+              return (
+                <el-input-number
+                  v-model={this.modalData.productSpecificationList[0].salePrice}
+                  min={0}
+                  label="描述文字"
+                ></el-input-number>
+              );
+            },
+          },
+        ];
+      }
+    },
+    tableCols() {
+      return [
+        {
+          title: "序号",
+          type: "seq",
+          width: "60px",
+          align: "center",
+        },
+        {
+          title: "规格",
+          field: "attributeValue",
+          align: "center",
+        },
+        {
+          title: "价格",
+          field: "salePrice",
+          align: "center",
+          type: "jsx",
+          render: ({ row }) => {
+            return (
+              <div>
+                <el-input-number
+                  min={0}
+                  size="small"
+                  v-model={row.salePrice}
+                  placeholder="请输入数量"
+                ></el-input-number>
+              </div>
+            );
+          },
+        },
+      ];
+    },
+    modalHandles() {
+      return [
+        {
+          label: "取消",
+          handle: debounce(() => {
+            this.toggle();
+          }, 300),
+        },
+        {
+          label: this.isAdd ? "确认添加" : "确认编辑",
+          type: "primary",
+          submit: true,
+          handle: debounce(() => {
+            if (this.tableData.length == 1) {
+              this.$api.mer_admin
+                .saveProductBase(this.modalData)
+                .then((res) => {
+                  console.log(res);
+                  this.toggle();
+                  this.$emit("queryList");
+                });
+            } else {
+              this.modalData.productSpecificationList = this.tableData;
+              this.$api.mer_admin
+                .saveProductBase(this.modalData)
+                .then((res) => {
+                  console.log(res);
+                  this.toggle();
+                  this.$emit("queryList");
+                });
+            }
+            console.log(this.modalData);
+          }, 300),
+        },
+      ];
+    },
+  },
+  asyncComputed: {},
+};
+</script>
+<style lang="scss" scoped>
+</style>