Browse Source

产品定价

chenrui 4 năm trước cách đây
mục cha
commit
3c6d52eb93

+ 109 - 0
src/views/productManagement/productPricing/auditModal.vue

@@ -0,0 +1,109 @@
+<template>
+  <a-modal
+    centered
+    class="productPricingAudit-modal"
+    :footer="null"
+    :maskClosable="false"
+    title="编辑价格"
+    v-model="isShow"
+    @cancle="isShow=false"
+    :width="800">
+    <!-- 编辑价格 -->
+    <div>
+
+      <div class="btn-cont">
+        <a-button type="primary" id="productPricingAudit-save" @click="handleAudit">审核通过</a-button>
+        <a-button id="productPricingAudit-cancel" @click="isShow = false" style="margin-left: 100px;">取消</a-button>
+      </div>
+    </div>
+  </a-modal>
+</template>
+
+<script>
+// import { dealerProductDetail } from '@/api/dealerProduct'
+export default {
+  name: 'ProductPricingAuditModal',
+  props: {
+    openModal: { //  弹框显示状态
+      type: Boolean,
+      default: false
+    },
+    itemId: {
+      type: [Number, String],
+      default: ''
+    }
+  },
+  computed: {
+    productTypeName () {
+      const productTypeName1 = this.detailsData.productTypeName1 ? this.detailsData.productTypeName1 : ''
+      const productTypeName2 = this.detailsData.productTypeName2 ? ' > ' + this.detailsData.productTypeName2 : ''
+      const productTypeName3 = this.detailsData.productTypeName3 ? ' > ' + this.detailsData.productTypeName3 : ''
+      return productTypeName1 + productTypeName2 + productTypeName3
+    }
+  },
+  data () {
+    return {
+      isShow: this.openModal, //  是否打开弹框
+      formItemLayout: {
+        labelCol: { span: 4 },
+        wrapperCol: { span: 16 }
+      },
+      detailsData: null, //  详情数据
+      form: {
+        storageQuantity: ''
+      },
+      rules: {
+        supplierName: [
+          { required: true, message: '请输入供应商名称', trigger: 'blur' }
+        ]
+      },
+      brandData: []
+    }
+  },
+  methods: {
+    //  获取详情
+    getDetail () {
+      // dealerProductDetail({ id: this.itemId }).then(res => {
+      //   if (res.status == 200) {
+      //     this.detailsData = res.data
+      //   } else {
+      //     this.detailsData = null
+      //   }
+      // })
+    },
+    // 审核
+    handleAudit () {
+
+    }
+  },
+  watch: {
+    //  父页面传过来的弹框状态
+    openModal (newValue, oldValue) {
+      this.isShow = newValue
+    },
+    //  重定义的弹框状态
+    isShow (newValue, oldValue) {
+      if (!newValue) {
+        this.$emit('close')
+      }
+    },
+    itemId (newValue, oldValue) {
+      if (this.isShow && newValue) {
+        this.getDetail()
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .productPricingAudit-modal{
+    .ant-modal-body {
+      padding: 40px 40px 24px;
+    }
+    .btn-cont {
+      text-align: center;
+      margin: 35px 0 30px;
+    }
+  }
+</style>

+ 175 - 0
src/views/productManagement/productPricing/editModal.vue

@@ -0,0 +1,175 @@
+<template>
+  <a-modal
+    centered
+    class="productPricingEdit-modal"
+    :footer="null"
+    :maskClosable="false"
+    title="编辑价格"
+    v-model="isShow"
+    @cancle="isShow=false"
+    :width="800">
+    <!-- 编辑价格 -->
+    <div>
+      <a-form-model
+        id="productPricingEdit-form"
+        ref="ruleForm"
+        :model="form"
+        :rules="rules"
+        :label-col="formItemLayout.labelCol"
+        :wrapper-col="formItemLayout.wrapperCol"
+      >
+        <a-form-model-item label="成本价" prop="supplierName">
+          50.00
+        </a-form-model-item>
+        <a-form-model-item label="省级价" prop="supplierName">
+          <a-input-number
+            id="productPricingEdit-storageQuantity"
+            v-model="form.storageQuantity"
+            :precision="2"
+            :min="1"
+            :max="999999"
+            placeholder="请输入"
+            style="width: 100%;" />
+        </a-form-model-item>
+        <a-form-model-item label="市级价" prop="supplierName">
+          <a-input-number
+            id="productPricingEdit-storageQuantity"
+            v-model="form.storageQuantity"
+            :precision="2"
+            :min="1"
+            :max="999999"
+            placeholder="请输入"
+            style="width: 100%;" />
+        </a-form-model-item>
+        <a-form-model-item label="特约价" prop="supplierName">
+          <a-input-number
+            id="productPricingEdit-storageQuantity"
+            v-model="form.storageQuantity"
+            :precision="2"
+            :min="1"
+            :max="999999"
+            placeholder="请输入"
+            style="width: 100%;" />
+        </a-form-model-item>
+        <a-form-model-item label="终端价" prop="supplierName">
+          <a-input-number
+            id="productPricingEdit-storageQuantity"
+            v-model="form.storageQuantity"
+            :precision="2"
+            :min="1"
+            :max="999999"
+            placeholder="请输入"
+            style="width: 100%;" />
+        </a-form-model-item>
+        <a-form-model-item label="车主价" prop="supplierName">
+          <a-input-number
+            id="productPricingEdit-storageQuantity"
+            v-model="form.storageQuantity"
+            :precision="2"
+            :min="1"
+            :max="999999"
+            placeholder="请输入"
+            style="width: 100%;" />
+        </a-form-model-item>
+        <a-form-model-item label="变更原因">
+          <a-select placeholder="请选择" id="productPricingEdit-storageQuantity" allowClear v-model="form.storageQuantity">
+            <a-select-option v-for="item in brandData" :key="item.salesChannelNo" :value="item.salesChannelNo">{{ item.salesChannelName }}</a-select-option>
+          </a-select>
+        </a-form-model-item>
+      </a-form-model>
+      <div class="btn-cont">
+        <a-button type="primary" id="product-pricing-modal-save" @click="handleSave">保存</a-button>
+        <a-button id="product-pricing-modal-cancel" @click="isShow = false" style="margin-left: 100px;">取消</a-button>
+      </div>
+    </div>
+  </a-modal>
+</template>
+
+<script>
+// import { dealerProductDetail } from '@/api/dealerProduct'
+export default {
+  name: 'ProductPricingEditModal',
+  props: {
+    openModal: { //  弹框显示状态
+      type: Boolean,
+      default: false
+    },
+    itemId: {
+      type: [Number, String],
+      default: ''
+    }
+  },
+  computed: {
+    productTypeName () {
+      const productTypeName1 = this.detailsData.productTypeName1 ? this.detailsData.productTypeName1 : ''
+      const productTypeName2 = this.detailsData.productTypeName2 ? ' > ' + this.detailsData.productTypeName2 : ''
+      const productTypeName3 = this.detailsData.productTypeName3 ? ' > ' + this.detailsData.productTypeName3 : ''
+      return productTypeName1 + productTypeName2 + productTypeName3
+    }
+  },
+  data () {
+    return {
+      isShow: this.openModal, //  是否打开弹框
+      formItemLayout: {
+        labelCol: { span: 4 },
+        wrapperCol: { span: 16 }
+      },
+      detailsData: null, //  详情数据
+      form: {
+        storageQuantity: ''
+      },
+      rules: {
+        supplierName: [
+          { required: true, message: '请输入供应商名称', trigger: 'blur' }
+        ]
+      },
+      brandData: []
+    }
+  },
+  methods: {
+    //  获取详情
+    getDetail () {
+      // dealerProductDetail({ id: this.itemId }).then(res => {
+      //   if (res.status == 200) {
+      //     this.detailsData = res.data
+      //   } else {
+      //     this.detailsData = null
+      //   }
+      // })
+    },
+    // 保存
+    handleSave () {
+
+    }
+  },
+  watch: {
+    //  父页面传过来的弹框状态
+    openModal (newValue, oldValue) {
+      this.isShow = newValue
+    },
+    //  重定义的弹框状态
+    isShow (newValue, oldValue) {
+      if (!newValue) {
+        this.$emit('close')
+      }
+    },
+    itemId (newValue, oldValue) {
+      if (this.isShow && newValue) {
+        this.getDetail()
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .productPricingEdit-modal{
+    .ant-modal-body {
+      padding: 40px 40px 24px;
+    }
+    .btn-cont {
+      text-align: center;
+      margin: 35px 0 30px;
+    }
+  }
+</style>

+ 250 - 3
src/views/productManagement/productPricing/list.vue

@@ -1,8 +1,255 @@
 <template>
+  <a-card size="small" :bordered="false" class="productPricingList-wrap">
+    <!-- 搜索条件 -->
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="$refs.table.refresh(true)">
+        <a-row :gutter="15">
+          <a-col :md="6" :sm="24">
+            <a-form-item label="产品名称">
+              <a-input id="productPricingList-productName" v-model.trim="queryParam.productName" allowClear placeholder="请输入产品名称"/>
+            </a-form-item>
+          </a-col>
+          <a-col :md="6" :sm="24">
+            <a-form-item label="产品编码/原厂编码">
+              <a-input id="productPricingList-productCode" v-model.trim="queryParam.productCode" allowClear placeholder="请输入产品编码"/>
+            </a-form-item>
+          </a-col>
+          <a-col :md="6" :sm="24">
+            <a-form-item label="品牌">
+              <a-select
+                placeholder="请选择"
+                id="productPricingList-productBrandSn"
+                allowClear
+                v-model="queryParam.productBrandSn"
+                :showSearch="true"
+                option-filter-prop="children"
+                :filter-option="filterOption">
+                <a-select-option v-for="item in productBrandList" :key="item.productBrandSn" :value="item.productBrandSn">{{ item.productBrandName }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <template v-if="advanced">
+            <a-col :md="6" :sm="24">
+              <a-form-item label="产品类别">
+                <a-cascader
+                  @change="changeProductType"
+                  change-on-select
+                  :options="productTypeList"
+                  :fieldNames="{ label: 'productTypeName', value: 'id', children: 'children' }"
+                  id="productPricingList-productType"
+                  placeholder="请选择产品类别"
+                  allowClear />
+              </a-form-item>
+            </a-col>
+            <a-col :md="6" :sm="24">
+              <a-form-item label="定价状态">
+                <v-select code="ENABLED_FLAG" id="productPricingList-enabledFlag" v-model="queryParam.enabledFlag" allowClear placeholder="请选择定价状态"></v-select>
+              </a-form-item>
+            </a-col>
+          </template>
+          <a-col :md="6" :sm="24">
+            <a-button style="margin-bottom: 18px;" type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="productPricingList-refresh">查询</a-button>
+            <a-button style="margin: 0 0 18px 8px" @click="resetSearchForm" :disabled="disabled" id="productPricingList-reset">重置</a-button>
+            <a @click="advanced=!advanced" style="margin-left: 8px">
+              {{ advanced ? '收起' : '展开' }}
+              <a-icon :type="advanced ? 'up' : 'down'"/>
+            </a>
+          </a-col>
+        </a-row>
+      </a-form>
+    </div>
+    <!-- 列表 -->
+    <s-table
+      class="sTable"
+      ref="table"
+      size="default"
+      :rowKey="(record) => record.id"
+      :columns="columns"
+      :data="loadData"
+      :scroll="{ x: 2010 }"
+      bordered>
+      <!-- 产品类别 -->
+      <template slot="productType" slot-scope="text, record">
+        <a-tooltip placement="top">
+          <template slot="title">
+            <span>{{ record.productTypeName }}</span>
+          </template>
+          {{ record.productTypeName3 }}
+        </a-tooltip>
+      </template>
+      <!-- 产品状态 -->
+      <template slot="status" slot-scope="text, record">
+        <a-tag :color="record.status==1?'green':'red'" >{{ record.status==1? '待提交': '待单据审核' }}</a-tag>
+      </template>
+      <!-- 定价状态 -->
+      <template slot="sstatus" slot-scope="text, record">
+        <a-tag :color="record.status==1?'green':'red'" >{{ record.status==1? '待提交': '待单据审核' }}</a-tag>
+      </template>
+      <!-- 操作 -->
+      <template slot="action" slot-scope="text, record">
+        <a-button size="small" type="link" @click="handleAudit(record)" id="productPricingList-audit-btn">审核</a-button>
+        <a-divider type="vertical" style="margin: 0;" />
+        <a-button size="small" type="link" @click="handleEdit(record)" id="productPricingList-edit-btn">编辑</a-button>
+      </template>
+    </s-table>
+    <!-- 产品编辑 -->
+    <product-pricing-edit-modal :openModal="openModal" :itemId="itemId" @close="closeModal" />
+  </a-card>
 </template>
 
 <script>
+import { dealerProductBrandQuery } from '@/api/dealerProductBrand'
+import { dealerProductTypeQuery } from '@/api/dealerProductType'
+import { STable, VSelect } from '@/components'
+import productPricingEditModal from './editModal.vue'
+export default {
+  components: { STable, VSelect, productPricingEditModal },
+  data () {
+    return {
+      advanced: false, // 高级搜索 展开/关闭
+      queryParam: { //  查询条件
+        productName: '', //  产品名称
+        productCode: '', //  产品编码/原厂编码
+        productBrandSn: undefined, //  品牌
+        productTypeSn1: '', //  产品一级类别
+        productTypeSn2: '', //  产品二级类别
+        productTypeSn3: '', //  产品三级类别
+        enabledFlag: undefined //  定价状态
+      },
+      disabled: false, //  查询、重置按钮是否可操作
+      columns: [
+        { title: '序号', dataIndex: 'no', width: 80, align: 'center' },
+        { title: '创建时间', dataIndex: 'createDate', width: 160, align: 'center' },
+        { title: '产品名称', dataIndex: 'productName', align: 'center', ellipsis: true, customRender: function (text) { return text || '--' } },
+        { title: '产品编码', dataIndex: 'productCode', width: 140, align: 'center' },
+        { title: '原厂编码', dataIndex: 'origCode', width: 140, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '品牌', dataIndex: 'productBrandName', width: 100, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '产品类别', scopedSlots: { customRender: 'productType' }, width: 200, align: 'center' },
+        { title: '产品状态', scopedSlots: { customRender: 'status' }, width: 120, align: 'center' },
+        { title: '定价状态', scopedSlots: { customRender: 'sstatus' }, width: 120, align: 'center' },
+        { title: '成本价', dataIndex: 'sterminaldsdPrice', width: 100, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
+        { title: '省级价', dataIndex: 'sdterminaldsdPrice', width: 100, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
+        { title: '市级价', dataIndex: 'fterminaldsdPrice', width: 100, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
+        { title: '特约价', dataIndex: 'gterminaldsdPrice', width: 100, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
+        { title: '终端价', dataIndex: 'hterminaldsdPrice', width: 100, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
+        { title: '车主价', dataIndex: 'terminaldsdPrice', width: 100, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
+        { title: '操作', scopedSlots: { customRender: 'action' }, width: 150, align: 'center', fixed: 'right' }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.disabled = true
+        // return dealerProductList(Object.assign(parameter, this.queryParam)).then(res => {
+        //   const data = res.data
+        //   const no = (data.pageNo - 1) * data.pageSize
+        //   for (var i = 0; i < data.list.length; i++) {
+        //     data.list[i].no = no + i + 1
+        //     const productTypeName1 = data.list[i].productTypeName1 ? data.list[i].productTypeName1 : ''
+        //     const productTypeName2 = data.list[i].productTypeName2 ? ' > ' + data.list[i].productTypeName2 : ''
+        //     const productTypeName3 = data.list[i].productTypeName3 ? ' > ' + data.list[i].productTypeName3 : ''
+        //     data.list[i].productTypeName = productTypeName1 + productTypeName2 + productTypeName3
+        //   }
+        //   this.disabled = false
+        //   return data
+        // })
+        const _this = this
+        return new Promise(function (resolve, reject) {
+          const data = {
+            pageNo: 1,
+            pageSize: 10,
+            list: [
+              { id: '1', productNum: 'jgqp11111111111', productName: '产品1', productPic: ['https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg', 'https://qn.antdv.com/vue.png'], productOldNum: 'jgqp111123545', productBrand: '箭冠品牌', productType: '产品分类1', inventoryNum: '5', inventoryMoney: '122' }
+            ]
+          }
+          const no = (data.pageNo - 1) * data.pageSize
+          for (var i = 0; i < data.list.length; i++) {
+            data.list[i].no = no + i + 1
+          }
+          _this.disabled = false
+          resolve(data)
+        })
+      },
+      openModal: false, //  编辑  弹框
+      itemId: '', //  当前产品id
+      productBrandList: [], //  品牌下拉数据
+      productTypeList: [] //  类别下拉数据
+    }
+  },
+  methods: {
+    //  重置
+    resetSearchForm () {
+      this.queryParam.productCode = ''
+      this.queryParam.productName = ''
+      this.queryParam.productBrandSn = undefined
+      this.queryParam.productTypeSn1 = ''
+      this.queryParam.productTypeSn2 = ''
+      this.queryParam.productTypeSn3 = ''
+      this.queryParam.enabledFlag = undefined
+      this.$refs.table.refresh(true)
+    },
+    // 审核
+    handleAudit (row) {
+      const _this = this
+      this.$confirm({
+        title: '提示',
+        content: '确认要审核吗?',
+        centered: true,
+        onOk () {
+          // salesDel({ id: row.id }).then(res => {
+          //   if (res.status == 200) {
+          //     _this.$message.success(res.message)
+          //     _this.$refs.table.refresh()
+          //   }
+          // })
+        }
+      })
+    },
+    filterOption (input, option) {
+      return (
+        option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+      )
+    },
+    //  编辑
+    handleEdit (row) {
+      this.itemId = row.id
+      this.openModal = true
+    },
+    //  关闭弹框
+    closeModal () {
+      this.itemId = ''
+      this.openModal = false
+    },
+    //  产品类别  change
+    changeProductType (val, opt) {
+      this.queryParam.productTypeSn1 = val[0] ? val[0] : ''
+      this.queryParam.productTypeSn2 = val[1] ? val[1] : ''
+      this.queryParam.productTypeSn3 = val[2] ? val[2] : ''
+    },
+    //  产品品牌  列表
+    getProductBrand () {
+      dealerProductBrandQuery({}).then(res => {
+        if (res.status == 200) {
+          this.productBrandList = res.data
+        } else {
+          this.productBrandList = []
+        }
+      })
+    },
+    //  产品类别  列表
+    getProductType () {
+      dealerProductTypeQuery({}).then(res => {
+        if (res.status == 200) {
+          this.productTypeList = res.data
+        } else {
+          this.productTypeList = []
+        }
+      })
+    }
+  },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {
+      vm.getProductBrand()
+      vm.getProductType()
+    })
+  }
+}
 </script>
-
-<style>
-</style>