暂存

src/SDrpManagement/shopCart/modules/listCopy.vue

@@ -0,0 +1,250 @@
+<template>
+<div class="container normal-panel">
+  <div class="normal-margin">
+    <!-- <slot name="operation"></slot> -->
+    <div class="flex-align-center">
+      <el-radio-group class="inline-16" size="small" v-model="params.content.istool" @change="onRadioChange">
+        <el-radio-button :label="0">产品</el-radio-button>
+        <el-radio-button :label="1">工具</el-radio-button>
+      </el-radio-group>
+      <el-input style="width:300px" size="small" v-model="params.content.where.condition" placeholder="产品名称,编号" @keyup.enter.native="listData(params.content.pageNumber = 1)" @clear="listData(params.content.pageNumber = 1)" clearable></el-input>&nbsp;
+      <ExportBtn v-if="tool.checkAuth($route.name,'export')" :tablecols="layout" :param="params" :total="total" excelTitle="购物车"></ExportBtn>
+    </div>
+  </div>
+  <div class="produtMag-panel">
+    <el-table
+      ref="multipleTable"
+      :data="tableData"
+      style="width: 100%;"
+      height="calc(100vh - 325px)"
+      :header-cell-style="{height:'50px',color:'#768093',fontWeight:'400'}"
+      :cell-style="{height:'50px',color:'#768093',fontWeight:'400'}"
+      @selection-change="selectionChange">
+      <el-table-column
+        type="selection"
+        width="55"
+        align="center">
+      </el-table-column>
+      <el-table-column
+        v-if="params.content.istool == 0"
+        prop="tradefield_shoppingcart"
+        label="品牌/领域"
+        width="250">
+        <template slot-scope="scope">
+          <el-tag size="mini" type="primary" effect="dark">{{scope.row.brandname}}</el-tag>&nbsp;
+          <el-tag size="mini" type="primary" effect="dark">{{scope.row.tradefield_shoppingcart}}</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="itemname"
+        label="产品名称"
+        width="150">
+      </el-table-column>
+      <el-table-column
+        prop="itemno"
+        label="产品编号"
+        width="150">
+      </el-table-column>
+      <el-table-column
+          label="型号">
+        <template slot-scope="scope">
+          <p><span>{{scope.row.model.length >10?scope.row.model.substring(0,9) + '...':scope.row.model}}</span></p>
+        </template>
+      </el-table-column>
+      <el-table-column
+          label="规格">
+        <template slot-scope="scope">
+          <p><span>{{scope.row.spec.length >10?scope.row.spec.substring(0,9) + '...':scope.row.spec}}</span></p>
+        </template>
+      </el-table-column>
+<!--      <el-table-column
+        label="型号/规格">
+        <template slot-scope="scope">
+          <p><span>{{scope.row.model}}</span>&nbsp;/&nbsp;<span>{{scope.row.spec}}</span></p>
+        </template>
+      </el-table-column>-->
+      <el-table-column
+        prop="oldprice"
+        label="单价"
+        width="90">
+        <template slot-scope="scope">
+          <p style="color:red;font-weight:500">¥&nbsp;{{tool.formatAmount(scope.row.oldprice,2)}}</p>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="数量"
+        width="150">
+        <template slot-scope="scope">
+        <el-input-number size="mini" v-model="scope.row.qty" :min="scope.row.orderminqty" @change="changeQty(scope.$index,scope.row)" :step="scope.row.orderaddqty" label="输入数量"></el-input-number>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="计量单位"
+        width="80">
+        <template slot-scope="scope">
+          <el-tag>{{ scope.row.unitname }}</el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="金额"
+        width="80">
+        <template slot-scope="scope">
+          <p style="color:red;font-weight:500">¥&nbsp;{{tool.formatAmount(scope.row.oldprice * scope.row.qty,2)}}</p>
+        </template>
+      </el-table-column>
+      <el-table-column width="90" label="操作">
+        <template slot-scope="scope">
+          <slot name="del" :data="scope.row"></slot>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div style="margin-top:16px;text-align:right">
+      <el-pagination
+        background
+        small
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+        :current-page="currentPage"
+        :page-size="params.content.pageSize"
+        layout="total, prev, pager, next, jumper"
+        :total="total">
+      </el-pagination>
+    </div>
+  </div>
+</div>
+</template>
+
+<script>
+import previewImage from '@/components/previewImage/index'
+import ExportBtn from './exportBtn'
+
+export default {
+  data () {
+    return {
+      params:{
+        "id": 20220924095302,
+        "content": {
+          "pageNumber": 1,
+          "pageSize": 9999,
+          "istool":0,
+          "where": {
+            "condition": ''
+          }
+        }
+      },
+      tableSelectData:[],
+      tableData: [],
+      total:0,
+      currentPage:0,
+      layout:[]
+    }
+  },
+  components:{
+    previewImage,
+    ExportBtn
+  },
+  methods:{
+    async listData () {
+      const res = await this.$api.requested(this.params)
+      this.tableData = res.data
+      this.total = res.total
+      this.currentPage = res.pageNumber
+      console.log(res.data);
+
+    },
+    handleSizeChange(val) {
+      // console.log(`每页 ${val} 条`);
+      this.params.content.pageSize = val
+      this.listData()
+    },
+    handleCurrentChange(val) {
+      // console.log(`当前页: ${val}`);
+      this.params.content.pageNumber = val
+      this.listData()
+    },
+    selectionChange (val) {
+      this.tableSelectData = val
+      if (this.params.content.istool == 0) {
+         let _isbrandSame = this.tableSelectData.some(item=>item.sa_brandid !== this.tableSelectData[0].sa_brandid)
+
+        if (_isbrandSame) return this.$message({message:"当前存在不同品牌产品请检查",type:'error'})
+
+        let _isFieldSame = this.tableSelectData.some(item=>item.tradefield_shoppingcart !== this.tableSelectData[0].tradefield_shoppingcart)
+
+        if (_isFieldSame) return this.$message({message:"当前存在不同领域产品请检查",type:'error'})
+
+        this.$emit('selection',val)
+      } else {
+        this.$emit('selection',val)
+      }
+    },
+    clearSelection () {
+      this.$refs.multipleTable.clearSelection();
+    },
+    onRadioChange () {
+      this.params.content.pageNumber = 1
+      this.listData()
+      this.$emit('onRadioChange',this.params.content.istool)
+    },
+    async changeQty (index,row) {
+      if (row.qty < row.orderminqty){
+        row.qty = row.orderminqty
+        const res = await this.$api.requested({
+          "id": 20220924104302,
+          "content": {
+            "sa_shoppingcartid": row.sa_shoppingcartid,
+            "qty": row.qty //数量
+          },
+        })
+        this.$emit('qtyChange')
+      }else {
+        if ((row.qty - row.orderminqty)/row.orderaddqty > 0){
+          let k = Math.ceil((row.qty - row.orderminqty)/row.orderaddqty)
+          row.qty = k * row.orderaddqty + row.orderminqty
+          const res = await this.$api.requested({
+            "id": 20220924104302,
+            "content": {
+              "sa_shoppingcartid": row.sa_shoppingcartid,
+              "qty": row.qty //数量
+            },
+          })
+          this.$set(this.tableData,index,row)
+          this.$emit('qtyChange')
+        }else {
+          const res = await this.$api.requested({
+            "id": 20220924104302,
+            "content": {
+              "sa_shoppingcartid": row.sa_shoppingcartid,
+              "qty": row.qty //数量
+            },
+          })
+          this.$emit('qtyChange')
+        }
+      }
+
+    }
+  },
+  mounted () {
+    this.listData()
+    this.layout = this.tool.tabelCol(this.$route.name).exportTable.tablecols
+  }
+}
+
+</script>
+<style>
+</style>
+<style scoped>
+.produtMag-panel{
+  /* margin: 30px; */
+  padding:0 10px 10px 10px;
+  background: #fff;
+  border-radius:5px;
+  overflow: hidden;
+  border:1px solid rgb(0 0 0 / 5%)
+  /* box-shadow: 0 5px 5px rgb(0 0 0 / 10%);
+  transform: translate3d(0,-2px,0); */
+}
+.image {
+  width:40px;height:40px;margin:0px auto;
+}
+</style>