Przeglądaj źródła

智能补货页面编写

chenrui 4 lat temu
rodzic
commit
1157556a80

BIN
src/assets/explain/def_calculation.png


BIN
src/assets/explain/icon_example.png


BIN
src/assets/explain/icon_inventory.png


BIN
src/assets/explain/icon_mete.png


BIN
src/assets/explain/icon_sales.png


BIN
src/assets/explain/pressed_gray.png


+ 30 - 0
src/config/router.config.js

@@ -803,6 +803,36 @@ export const asyncRouterMap = [
                   icon: 'monitor',
                   hidden: true
                 }
+              },
+              {
+                path: 'import/:sn',
+                name: 'intelligentReplenishmentImport',
+                component: () => import(/* webpackChunkName: "shop" */ '@/views/inventoryManagement/intelligentReplenishment/import.vue'),
+                meta: {
+                  title: '确认导入',
+                  icon: 'monitor',
+                  hidden: true
+                }
+              },
+              {
+                path: 'explainXsbz',
+                name: 'intelligentReplenishmentExplainXsbz',
+                component: () => import(/* webpackChunkName: "shop" */ '@/views/inventoryManagement/intelligentReplenishment/explainXsbz.vue'),
+                meta: {
+                  title: '销售保障法-说明',
+                  icon: 'monitor',
+                  hidden: true
+                }
+              },
+              {
+                path: 'explainQspj',
+                name: 'intelligentReplenishmentExplainQspj',
+                component: () => import(/* webpackChunkName: "shop" */ '@/views/inventoryManagement/intelligentReplenishment/explainQspj.vue'),
+                meta: {
+                  title: '趋势平均法-说明',
+                  icon: 'monitor',
+                  hidden: true
+                }
               }
             ]
           },

+ 1 - 1
src/views/inventoryManagement/intelligentReplenishment/detailModal.vue

@@ -32,7 +32,7 @@
       </div>
       <div class="module-cont">
         <p class="title">趋势平均法</p>
-        <p class="explain">服务水平:<span>90%</span></p>
+        <p class="explain">服务水平:<span>90%(对应的安全系数为1.28)</span></p>
       </div>
       <div class="spin-cont">
         按照以上参数设置,系统正在计算中,请耐心等待...

+ 25 - 7
src/views/inventoryManagement/intelligentReplenishment/edit.vue

@@ -23,7 +23,7 @@
       >
         <div class="module-cont">
           <p class="title">产品范围</p>
-          <a-form-model-item label="" prop="loginFlag" class="form-item">
+          <a-form-model-item label=" " :colon="false" prop="loginFlag" class="form-item">
             <a-radio-group name="radioGroup" v-model="form.loginFlag" placeholder="请选择">
               <a-radio :value="1">全部产品</a-radio>
               <a-radio :value="0">自选产品</a-radio>
@@ -32,7 +32,7 @@
 
         </div>
         <div class="module-cont">
-          <p class="title">销售保障法<a-button type="link" size="small" class="link-btn">算法说明</a-button></p>
+          <p class="title">销售保障法<a-button type="link" size="small" class="link-btn" @click="handleExplain('xsbz')">算法说明</a-button></p>
           <a-form-model-item label="保障倍数" prop="loginFlag" class="form-item">
             <a-input-number
               id="intelligentReplenishmentEdit-outQty"
@@ -45,18 +45,22 @@
           </a-form-model-item>
         </div>
         <div class="module-cont">
-          <p class="title">趋势平均法<a-button type="link" size="small" class="link-btn">算法说明</a-button></p>
+          <p class="title">趋势平均法<a-button type="link" size="small" class="link-btn" @click="handleExplain('qspj')">算法说明</a-button></p>
           <a-form-model-item label="服务水平" prop="loginFlag" class="form-item">
-            <a-input id="intelligentReplenishmentEdit-outQty" v-model="form.productOrigCode" placeholder="请选择" readonly @click="chooseFun" />
+            <a-input id="intelligentReplenishmentEdit-outQty" v-model="form.productOrigCode" placeholder="请选择" read-only @click="chooseFun" />
           </a-form-model-item>
         </div>
       </a-form-model>
     </a-card>
+    <!-- 服务水平 -->
+    <replenishment-service-level-modal :openModal="openModal" @close="openModal=false" @ok="handleOk" />
   </div>
 </template>
 
 <script>
+import ReplenishmentServiceLevelModal from './serviceLevelModal.vue'
 export default {
+  components: { ReplenishmentServiceLevelModal },
   data () {
     return {
       formItemLayout: {
@@ -68,7 +72,8 @@ export default {
       },
       rules: {
         name: [ { required: true, message: '请输入客户类型名称', trigger: 'blur' } ]
-      }
+      },
+      openModal: false
     }
   },
   methods: {
@@ -78,7 +83,20 @@ export default {
     },
     //  选择
     chooseFun () {
-
+      this.openModal = true
+    },
+    // 算法说明
+    handleExplain (type) {
+      if (type == 'xsbz') {
+        this.$router.push({ path: `/inventoryManagement/intelligentReplenishment/explainXsbz` })
+      } else if (type == 'qspj') {
+        this.$router.push({ path: `/inventoryManagement/intelligentReplenishment/explainQspj` })
+      }
+    },
+    // 服务水平选择
+    handleOk (val) {
+      console.log(val)
+      this.openModal = false
     }
   }
 }
@@ -92,7 +110,7 @@ export default {
     .intelligentReplenishmentEdit-cont{
       .steps-cont{
         width: 50%;
-        margin: 0 auto;
+        margin: 30px auto 10px;
       }
       .module-cont{
         border: 1px dashed #e8e8e8;

+ 0 - 143
src/views/inventoryManagement/intelligentReplenishment/editModal.vue

@@ -1,143 +0,0 @@
-<template>
-  <a-modal
-    centered
-    class="intelligentReplenishmentEdit-modal"
-    :footer="null"
-    :maskClosable="false"
-    :title="modalTit"
-    v-model="isShow"
-    @cancle="isShow=false"
-    :width="800">
-    <!-- 表单 -->
-    <div>
-      <a-form-model
-        id="intelligentReplenishmentEdit-form"
-        ref="ruleForm"
-        :model="form"
-        :rules="rules"
-        :label-col="formItemLayout.labelCol"
-        :wrapper-col="formItemLayout.wrapperCol"
-      >
-        <a-form-model-item label="客户类型名称" prop="name">
-          <a-input
-            id="intelligentReplenishmentEdit-name"
-            :maxLength="30"
-            v-model.trim="form.name"
-            @change="filterEmpty"
-            placeholder="请输入客户类型名称(最多30个字符)"
-            allowClear />
-        </a-form-model-item>
-      </a-form-model>
-      <div class="btn-cont">
-        <a-button type="primary" id="customer-type-edit-modal-save" @click="handleSave">保存</a-button>
-        <a-button id="customer-type-edit-modal-back" @click="isShow = false" style="margin-left: 15px;">返回列表</a-button>
-      </div>
-    </div>
-  </a-modal>
-</template>
-
-<script>
-import { STable } from '@/components'
-import { custTypeSave } from '@/api/custType'
-export default {
-  name: 'CustomerTypeEditModal',
-  components: { STable },
-  props: {
-    openModal: { //  弹框显示状态
-      type: Boolean,
-      default: false
-    },
-    itemId: {
-      type: [Number, String],
-      default: ''
-    },
-    nowData: {
-      type: Object,
-      default: null
-    }
-  },
-  computed: {
-    modalTit () {
-      return (this.itemId ? '编辑' : '新增') + '客户类型'
-    }
-  },
-  data () {
-    return {
-      isShow: this.openModal, //  是否打开弹框
-      detailsData: null, //  品牌数据
-      formItemLayout: {
-        labelCol: { span: 6 },
-        wrapperCol: { span: 16 }
-      },
-      form: {
-        name: '' // 客户类型名称
-      },
-      rules: {
-        name: [
-          { required: true, message: '请输入客户类型名称', trigger: 'blur' }
-        ]
-      }
-    }
-  },
-  methods: {
-    filterEmpty () {
-      let str = this.form.name
-      str = str.replace(/\ +/g, '')
-      str = str.replace(/[ ]/g, '')
-      str = str.replace(/[\r\n]/g, '')
-      this.form.name = str
-    },
-    //  保存
-    handleSave () {
-      const _this = this
-      this.$refs.ruleForm.validate(valid => {
-        if (valid) {
-          const form = _this.form
-          form.id = _this.itemId ? _this.itemId : null
-          custTypeSave(form).then(res => {
-            if (res.status == 200) {
-              _this.$message.success(res.message)
-              _this.isShow = false
-            }
-          })
-        } else {
-          console.log('error submit!!')
-          return false
-        }
-      })
-    }
-  },
-  watch: {
-    //  父页面传过来的弹框状态
-    openModal (newValue, oldValue) {
-      this.isShow = newValue
-    },
-    //  重定义的弹框状态
-    isShow (newValue, oldValue) {
-      if (!newValue) {
-        this.$emit('close')
-        this.$refs.ruleForm.resetFields()
-      }
-    },
-    itemId (newValue, oldValue) {
-      if (this.isShow && newValue) { //  编辑
-        this.form.name = this.nowData && this.nowData.name ? this.nowData.name : ''
-      } else { //  添加
-        this.form.name = ''
-      }
-    }
-  }
-}
-</script>
-
-<style lang="less">
-  .intelligentReplenishmentEdit-modal{
-    .ant-modal-body {
-      padding: 40px 40px 24px;
-    }
-    .btn-cont {
-      text-align: center;
-      margin: 35px 0 10px;
-    }
-  }
-</style>

+ 218 - 0
src/views/inventoryManagement/intelligentReplenishment/explainQspj.vue

@@ -0,0 +1,218 @@
+<template>
+  <a-card size="small" :bordered="false" class="explainQspj-warp">
+    <div class="explainQspj-cont">
+      <p class="explain-tit">趋势平均法</p>
+      <p class="explain-txt margin-b-30">趋势平均法是从过去各期实际销售量中,观察其增减变动的基本趋势并使其平均化,从而排除了某一个别销售期可能存在偶然因素的影响的一种销售预测法。</p>
+      <div class="sub-tit">
+        <img src="@/assets/explain/icon_sales.png" width="16" class="tit-icon" />
+        <p class="txt">预计月销量</p>
+      </div>
+      <div class="item-cont">
+        <p class="item-exp">预计月销量= = A + n×T</p>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">其中 A 表示五期平均值,n 表示距离预测时间的期数,T 表示趋势平均值</p>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">如果是新产品,没有历史销量,则不会进行预测,下载结果的excel中显示为-</p>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">如果产品上线时间不长,历史销售量记录小于12个月,则取有记录的销量平均值作为预计月销量</p>
+        </div>
+      </div>
+      <div class="sub-tit">
+        <img src="@/assets/explain/icon_inventory.png" width="16" class="tit-icon" />
+        <p class="txt">安全库存</p>
+      </div>
+      <div class="item-cont">
+        <p class="item-exp">安全库存=需求的标准偏差 × 安全系数 × 交付前置期开方</p>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">标准偏差是一个统计值,用来衡量一组个体值的离散程度,由希腊字母西格玛(σ)表示。在具体计算时,先计算出每个个体值的方差,加总后再开方便得到标准偏差。</p>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">安全系数与服务水平相关,服务水平越高,对应的安全系数就越大</p>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">交付前置期是订货周期/30</p>
+        </div>
+      </div>
+      <div class="sub-tit">
+        <img src="@/assets/explain/icon_mete.png" width="16" class="tit-icon" />
+        <p class="txt">预计需求量</p>
+      </div>
+      <div class="item-cont">
+        <p class="item-exp">预计需求量=预计月销量 × 交付前置期 + 安全库存</p>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">交付前置期是订货周期/30</p>
+        </div>
+      </div>
+      <div class="sub-tit">
+        <img src="@/assets/explain/icon_example.png" width="16" class="tit-icon" />
+        <p class="txt">示例</p>
+      </div>
+      <div class="item-cont">
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">某产品的订货周期为45天,最近12个月的实际销量如下表</p>
+        </div>
+        <div class="item-table">
+          <a-table :columns="columns" :data-source="dataSource" bordered :pagination="false"></a-table>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">计算预计月销量 = 54.4 + 3 × (-0.2) = 53.8 ≈ 54(四舍五入)</p>
+        </div>
+        <div class="item-table">
+          <a-table :columns="columnsXl" :data-source="dataSourceXl" bordered :pagination="false"></a-table>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">计算安全库存 = 71的开方 × 90%的服务水平对应的安全系数 × 45/30的开方 = 8.43 × 1.28 × 1.22 = 13.16 ≈ 13(四舍五入)</p>
+        </div>
+        <div class="item-table">
+          <a-table :columns="columnsKc" :data-source="dataSourceKc" bordered :pagination="false"></a-table>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">计算预计需求量 = 54 × (45/30) + 13 = 94</p>
+        </div>
+      </div>
+    </div>
+  </a-card>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      columns: [
+        { title: '1月', dataIndex: 'january', align: 'center' },
+        { title: '2月', dataIndex: 'february', align: 'center' },
+        { title: '3月', dataIndex: 'march', align: 'center' },
+        { title: '4月', dataIndex: 'april', align: 'center' },
+        { title: '5月', dataIndex: 'may', align: 'center' },
+        { title: '6月', dataIndex: 'june', align: 'center' },
+        { title: '7月', dataIndex: 'july', align: 'center' },
+        { title: '8月', dataIndex: 'august', align: 'center' },
+        { title: '9月', dataIndex: 'september', align: 'center' },
+        { title: '10月', dataIndex: 'october', align: 'center' },
+        { title: '11月', dataIndex: 'november', align: 'center' },
+        { title: '12月', dataIndex: 'december', align: 'center' }
+      ],
+      dataSource: [
+        { january: 55, february: 53, march: 54, april: 56, may: 58, june: 57, july: 52, august: 52, september: 56, october: 52, november: 53, december: 59 }
+      ],
+      columnsXl: [
+        { title: '月份', dataIndex: 'title', align: 'center' },
+        { title: '1月', dataIndex: 'january', align: 'center' },
+        { title: '2月', dataIndex: 'february', align: 'center' },
+        { title: '3月', dataIndex: 'march', align: 'center' },
+        { title: '4月', dataIndex: 'april', align: 'center' },
+        { title: '5月', dataIndex: 'may', align: 'center' },
+        { title: '6月', dataIndex: 'june', align: 'center' },
+        { title: '7月', dataIndex: 'july', align: 'center' },
+        { title: '8月', dataIndex: 'august', align: 'center' },
+        { title: '9月', dataIndex: 'september', align: 'center' },
+        { title: '10月', dataIndex: 'october', align: 'center' },
+        { title: '11月', dataIndex: 'november', align: 'center' },
+        { title: '12月', dataIndex: 'december', align: 'center' }
+      ],
+      dataSourceXl: [
+        { title: '实际销量', january: 55, february: 53, march: 54, april: 56, may: 58, june: 57, july: 52, august: 52, september: 56, october: 52, november: 53, december: 59 },
+        { title: '五期平均值', january: '-', february: '-', march: 55.2, april: 55.6, may: 55.4, june: 55.0, july: 55.0, august: 53.8, september: 53.0, october: 54.4, november: '-', december: '-' },
+        { title: '变动趋势值', january: '-', february: '-', march: '-', april: 0.4, may: -0.2, june: -0.4, july: 0, august: -1.2, september: -0.8, october: 1.4, november: '-', december: '-' },
+        { title: '三期趋势平均值', january: '-', february: '-', march: '-', april: '-', may: -0.067, june: -0.2, july: -0.533, august: -0.667, september: -0.2, october: '-', november: '-', december: '-' }
+      ],
+      columnsKc: [
+        { title: '月份', dataIndex: 'title', align: 'center' },
+        { title: '1月', dataIndex: 'january', align: 'center' },
+        { title: '2月', dataIndex: 'february', align: 'center' },
+        { title: '3月', dataIndex: 'march', align: 'center' },
+        { title: '4月', dataIndex: 'april', align: 'center' },
+        { title: '5月', dataIndex: 'may', align: 'center' },
+        { title: '6月', dataIndex: 'june', align: 'center' },
+        { title: '7月', dataIndex: 'july', align: 'center' },
+        { title: '8月', dataIndex: 'august', align: 'center' },
+        { title: '9月', dataIndex: 'september', align: 'center' },
+        { title: '10月', dataIndex: 'october', align: 'center' },
+        { title: '11月', dataIndex: 'november', align: 'center' },
+        { title: '12月', dataIndex: 'december', align: 'center' },
+        { title: '求和', dataIndex: 'sum', align: 'center' }
+      ],
+      dataSourceKc: [
+        { title: '实际销量', january: 55, february: 53, march: 54, april: 56, may: 58, june: 57, july: 52, august: 52, september: 56, october: 52, november: 53, december: 59, sum: 657 },
+        { title: '实际销量', january: 54, february: 54, march: 54, april: 54, may: 54, june: 54, july: 54, august: 54, september: 54, october: 54, november: 54, december: 54, sum: 648 },
+        { title: '实际销量', january: 1, february: -1, march: 0, april: 2, may: 4, june: 3, july: -2, august: -2, september: 2, october: -2, november: -1, december: 5, sum: 9 },
+        { title: '实际销量', january: 1, february: 1, march: 0, april: 4, may: 14, june: 9, july: 4, august: 4, september: 4, october: 4, november: 1, december: 25, sum: 71 }
+      ]
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .explainQspj-warp{
+    .explainQspj-cont{
+      width: 960px;
+      margin: 0 auto;
+      p{
+        margin: 0;
+      }
+      .explain-tit{
+        font-size: 18px;
+        font-weight: bold;
+        text-align: center;
+        margin: 20px 0 30px;
+      }
+      .explain-txt{
+        font-size: 13px;
+        color: rgba(0,0,0,0.85);
+      }
+      .margin-b-30{
+        margin-bottom: 30px;
+      }
+      .sub-tit{
+        margin-bottom: 10px;
+        .tit-icon{
+          vertical-align: text-bottom;
+          margin-right: 5px;
+        }
+        .txt{
+          font-size: 16px;
+          color: rgba(0, 21, 41, 1);
+          display: inline-block;
+          margin: 0;
+        }
+      }
+      .item-cont{
+        font-size: 13px;
+        padding-left: 23px;
+        line-height: 26px;
+        margin-bottom: 25px;
+        .item-exp{
+          color: rgba(231, 0, 18, 0.85);
+        }
+        .item-main{
+          position: relative;
+          .item-icon{
+            position: absolute;
+            left: 0;
+            top: 7px;
+          }
+          .item-txt{
+            padding-left: 20px;
+          }
+        }
+        .item-table{
+          margin: 15px 0;
+        }
+      }
+    }
+  }
+</style>

+ 142 - 0
src/views/inventoryManagement/intelligentReplenishment/explainXsbz.vue

@@ -0,0 +1,142 @@
+<template>
+  <a-card size="small" :bordered="false" class="explainXsbz-warp">
+    <div class="explainXsbz-cont">
+      <p class="explain-tit">销售保障法</p>
+      <p class="explain-txt margin-b-30">销售保障法以历史的实际销售量为数据基础,并结合专家经验,得到预计的需求量,以满足销售需求,具体计算公式如下。</p>
+      <div class="sub-tit">
+        <img src="@/assets/explain/icon_sales.png" width="16" class="tit-icon" />
+        <p class="txt">预计月销量</p>
+      </div>
+      <div class="item-cont">
+        <p class="item-exp">预计月销量= {上个月实际销量,最近两个月实际销量平均值,最近半年实际销量平均值,去年同期实际销量} 取大者</p>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">如果是新产品,没有历史销量,则不会进行预测,下载结果的excel中显示为-</p>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">如果产品上线时间不长,历史销售量记录小于12个月,则取有记录的销量平均值作为预计月销量</p>
+        </div>
+      </div>
+      <div class="sub-tit">
+        <img src="@/assets/explain/icon_mete.png" width="16" class="tit-icon" />
+        <p class="txt">预计需求量</p>
+      </div>
+      <div class="item-cont">
+        <p class="item-exp">预计需求量=预计月销量 × 保障倍数</p>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">保障倍数是专家根据经验判断,自行设置的一个数值,取值范围在1~3之间,最多两位小数</p>
+        </div>
+      </div>
+      <div class="sub-tit">
+        <img src="@/assets/explain/icon_example.png" width="16" class="tit-icon" />
+        <p class="txt">示例</p>
+      </div>
+      <div class="item-cont">
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">某产品的订货周期为45天,最近12个月的实际销量如下表</p>
+        </div>
+        <div class="item-table">
+          <a-table :columns="columns" :data-source="dataSource" bordered :pagination="false"></a-table>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">计算预计月销量 = MAX { 59,(53+59)/2,(57+52+52+56+52+53+59)/6,55 } =59</p>
+        </div>
+        <div class="item-main">
+          <img src="@/assets/explain/pressed_gray.png" width="12" class="item-icon" />
+          <p class="item-txt">计算预计需求量 = 59 × 保障倍数1.5 = 88.5 ≈ 89(假设保障倍数为1.5)</p>
+        </div>
+      </div>
+    </div>
+  </a-card>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+      columns: [
+        { title: '1月', dataIndex: 'january', align: 'center' },
+        { title: '2月', dataIndex: 'february', align: 'center' },
+        { title: '3月', dataIndex: 'march', align: 'center' },
+        { title: '4月', dataIndex: 'april', align: 'center' },
+        { title: '5月', dataIndex: 'may', align: 'center' },
+        { title: '6月', dataIndex: 'june', align: 'center' },
+        { title: '7月', dataIndex: 'july', align: 'center' },
+        { title: '8月', dataIndex: 'august', align: 'center' },
+        { title: '9月', dataIndex: 'september', align: 'center' },
+        { title: '10月', dataIndex: 'october', align: 'center' },
+        { title: '11月', dataIndex: 'november', align: 'center' },
+        { title: '12月', dataIndex: 'december', align: 'center' }
+      ],
+      dataSource: [
+        { january: 55, february: 53, march: 54, april: 56, may: 58, june: 57, july: 52, august: 52, september: 56, october: 52, november: 53, december: 59 }
+      ]
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .explainXsbz-warp{
+    .explainXsbz-cont{
+      width: 960px;
+      margin: 0 auto;
+      p{
+        margin: 0;
+      }
+      .explain-tit{
+        font-size: 18px;
+        font-weight: bold;
+        text-align: center;
+        margin: 20px 0 30px;
+      }
+      .explain-txt{
+        font-size: 13px;
+        color: rgba(0,0,0,0.85);
+      }
+      .margin-b-30{
+        margin-bottom: 30px;
+      }
+      .sub-tit{
+        margin-bottom: 10px;
+        .tit-icon{
+          vertical-align: text-bottom;
+          margin-right: 5px;
+        }
+        .txt{
+          font-size: 16px;
+          color: rgba(0, 21, 41, 1);
+          display: inline-block;
+          margin: 0;
+        }
+      }
+      .item-cont{
+        font-size: 13px;
+        padding-left: 23px;
+        line-height: 26px;
+        margin-bottom: 25px;
+        .item-exp{
+          color: rgba(231, 0, 18, 0.85);
+        }
+        .item-main{
+          position: relative;
+          .item-icon{
+            position: absolute;
+            left: 0;
+            top: 7px;
+          }
+          .item-txt{
+            padding-left: 20px;
+          }
+        }
+        .item-table{
+          margin: 15px 0;
+        }
+      }
+    }
+  }
+</style>

+ 113 - 0
src/views/inventoryManagement/intelligentReplenishment/import.vue

@@ -0,0 +1,113 @@
+<template>
+  <div class="intelligentReplenishmentImport-wrap">
+    <a-page-header :ghost="false" :backIcon="false" class="intelligentReplenishmentImport-back">
+      <!-- 自定义的二级文字标题 -->
+      <template slot="subTitle">
+        <a id="intelligentReplenishmentImport-back-btn" href="javascript:;" @click="handleBack"><a-icon type="left" /> 返回列表</a>
+      </template>
+    </a-page-header>
+    <a-card size="small" :bordered="false" class="intelligentReplenishmentImport-cont">
+      <div>
+        <p class="total">共 <span>50</span> 条数据,红色字体表示数据不符合规范,请返回上一步修改文件后重新上传</p>
+        <s-table
+          class="sTable"
+          ref="table"
+          size="small"
+          :rowKey="(record) => record.id"
+          :columns="columns"
+          :data="loadData"
+          :scroll="{ x: 1440 }"
+          bordered>
+        </s-table>
+        <div class="btn-cont">
+          <a-button type="primary" class="button-error" id="intelligentReplenishmentLevel-submit" @click="handleSubmit">确认导入</a-button>
+          <a-button type="primary" class="button-error" id="intelligentReplenishmentLevel-back" @click="handleBackSet">上一步</a-button>
+          <a-button id="intelligentReplenishmentLevel-back" @click="isShow = false" class="button-cancel">取消</a-button>
+        </div>
+      </div>
+    </a-card>
+  </div>
+</template>
+
+<script>
+import { STable } from '@/components'
+export default {
+  components: { STable },
+  data () {
+    return {
+      columns: [
+        { title: '序号', dataIndex: 'no', width: 80, align: 'center', fixed: 'left' },
+        { title: '产品编码', dataIndex: 'purchaseNo', width: 220, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '产品名称', dataIndex: 'creatDate', align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '产品状态', dataIndex: 'purchaseNos', width: 100, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '订货周期(天)', dataIndex: 'purchaseNoa', width: 120, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '是否淘汰', dataIndex: 'purchaseNod', width: 100, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '淘汰描述', dataIndex: 'purchaseNof', width: 200, align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '备注', dataIndex: 'purchaseNog', width: 200, align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
+        { title: '错误原因', dataIndex: 'purchaseNoh', width: 200, align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        // return custTypeList(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
+        //   }
+        //   return data
+        // })
+        return new Promise(function (resolve, reject) {
+          const data = {
+            pageNo: 1,
+            pageSize: 10,
+            list: [
+              { id: '1', state: 1, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' },
+              { id: '2', state: 2, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' },
+              { id: '3', state: 3, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' },
+              { id: '4', state: 4, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' },
+              { id: '5', state: 5, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' }
+            ],
+            count: 10
+          }
+          resolve(data)
+        })
+      }
+    }
+  },
+  methods: {
+    // 返回
+    handleBack () {
+      this.$router.push({ path: `/inventoryManagement/intelligentReplenishment/list` })
+    },
+    // 返回基础设置页
+    handleBackSet () {
+      this.$router.push({ path: `/inventoryManagement/intelligentReplenishment/set/${this.$route.params.sn}` })
+    },
+    // 确认导入
+    handleSubmit () {}
+  }
+}
+</script>
+<style lang="less">
+  .intelligentReplenishmentImport-wrap{
+    .intelligentReplenishmentImport-back{
+      margin-bottom: 10px;
+    }
+    .intelligentReplenishmentImport-cont{
+      .total{
+        margin: 20px 0 30px;
+        span{
+          font-weight: bold;
+        }
+      }
+      .btn-cont{
+        margin: 30px 0 20px;
+        text-align: center;
+        .button-cancel{
+          font-size: 12px;
+          margin-left: 15px;
+        }
+      }
+    }
+  }
+</style>

+ 3 - 7
src/views/inventoryManagement/intelligentReplenishment/list.vue

@@ -46,20 +46,18 @@
           id="chainTransferInList-download-btn">结果下载</a-button>
       </template>
     </s-table>
-    <!-- 新增/编辑 -->
-    <intelligent-replenishment-edit-modal :openModal="openModal" :itemId="itemId" @close="closeModal" />
+    <!-- 详情 -->
     <intelligent-replenishment-detail-modal :openModal="openDetailModal" :itemId="itemId" @close="closeModal" />
   </a-card>
 </template>
 
 <script>
 import moment from 'moment'
-import { custTypeList, custTypeDel } from '@/api/custType'
+import { custTypeList } from '@/api/custType'
 import { STable, VSelect } from '@/components'
-import intelligentReplenishmentEditModal from './editModal.vue'
 import intelligentReplenishmentDetailModal from './detailModal.vue'
 export default {
-  components: { STable, VSelect, intelligentReplenishmentEditModal, intelligentReplenishmentDetailModal },
+  components: { STable, VSelect, intelligentReplenishmentDetailModal },
   data () {
     return {
       columns: [
@@ -80,7 +78,6 @@ export default {
           return data
         })
       },
-      openModal: false, //  新增编辑  弹框
       itemId: '', //  当前id
       downloadLoading: false,
       openDetailModal: false
@@ -125,7 +122,6 @@ export default {
     //  关闭弹框
     closeModal () {
       this.itemId = ''
-      this.openModal = false
       this.openDetailModal = false
       this.$refs.table.refresh(true)
     },

+ 147 - 0
src/views/inventoryManagement/intelligentReplenishment/serviceLevelModal.vue

@@ -0,0 +1,147 @@
+<template>
+  <a-modal
+    centered
+    class="intelligentReplenishmentLevel-modal"
+    :footer="null"
+    :maskClosable="false"
+    title="选择服务水平"
+    v-model="isShow"
+    @cancle="isShow=false"
+    :width="800">
+    <div>
+      <s-table
+        class="sTable"
+        ref="table"
+        size="small"
+        :rowKey="(record) => record.id"
+        :row-selection="{ type: 'radio', columnTitle: '选择', selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
+        :columns="columns"
+        :data="loadData"
+        :scroll="{ y: 400 }"
+        bordered>
+      </s-table>
+      <div class="btn-cont">
+        <a-button type="primary" id="intelligentReplenishmentLevel-save" @click="handleSave">保存</a-button>
+        <a-button id="intelligentReplenishmentLevel-back" @click="isShow = false" style="margin-left: 15px;">关闭</a-button>
+      </div>
+    </div>
+  </a-modal>
+</template>
+
+<script>
+import { STable } from '@/components'
+// import { custTypeSave } from '@/api/custType'
+export default {
+  name: 'IntelligentReplenishmentLevelModal',
+  components: { STable },
+  props: {
+    openModal: { //  弹框显示状态
+      type: Boolean,
+      default: false
+    },
+    itemId: {
+      type: [Number, String],
+      default: ''
+    }
+  },
+  data () {
+    return {
+      isShow: this.openModal, //  是否打开弹框
+      detailsData: null, //  详情数据
+      columns: [
+        { title: '服务水平(%)', dataIndex: 'purchaseNo', align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '安全系数', dataIndex: 'creatDate', align: 'center', customRender: function (text) { return text || '--' } }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        // return custTypeList(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
+        //   }
+        //   return data
+        // })
+        return new Promise(function (resolve, reject) {
+          const data = {
+            pageNo: 1,
+            pageSize: 10,
+            list: [
+              { id: '1', state: 1, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' },
+              { id: '2', state: 2, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' },
+              { id: '3', state: 3, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' },
+              { id: '4', state: 4, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' },
+              { id: '5', state: 5, purchaseNo: 'jgqp11111111111', creatDate: '产品1', custName: 'jgqp111123545', totalP: '箭冠品牌', totalNums: '产品分类1', totalPrice: '5', payType: '122' }
+            ],
+            count: 10
+          }
+          resolve(data)
+        })
+      },
+      selectedRowKeys: []
+    }
+  },
+  methods: {
+    onSelectChange (selectedRowKeys, selectedRows) {
+      console.log('selectedRowKeys changed: ', selectedRowKeys, selectedRows)
+      this.selectedRowKeys = selectedRowKeys
+    },
+    //  保存
+    handleSave () {
+      if (this.selectedRowKeys.length > 0) {
+        this.$emit('ok', this.selectedRowKeys)
+      } else {
+        this.$message.warning('请选择服务水平后再进行保存!')
+      }
+    }
+  },
+  watch: {
+    //  父页面传过来的弹框状态
+    openModal (newValue, oldValue) {
+      this.isShow = newValue
+    },
+    //  重定义的弹框状态
+    isShow (newValue, oldValue) {
+      if (!newValue) {
+        this.$emit('close')
+      }
+    },
+    itemId (newValue, oldValue) {
+      if (this.isShow && newValue) {
+
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .intelligentReplenishmentLevel-modal{
+    .module-cont{
+      border: 1px dashed #e8e8e8;
+      border-radius: 12px;
+      position: relative;
+      margin: 30px 0;
+      padding: 20px 15px 15px;
+      .title{
+        position: absolute;
+        left: 50px;
+        top: -12px;
+        padding: 0 10px;
+        background-color: #fff;
+      }
+      .explain{
+        margin-bottom: 5px;
+        font-weight: bold;
+      }
+    }
+    .spin-cont{
+      text-align: center;
+    }
+    .btn-cont {
+      text-align: center;
+      font-weight: bold;
+      margin: 35px 0 10px;
+    }
+  }
+</style>

+ 23 - 34
src/views/inventoryManagement/intelligentReplenishment/set.vue

@@ -15,8 +15,11 @@
             </div>
             <p>所有允许导入的数据字段请参考模板,数据字段不符合规则,整条不予以导入。</p>
             <ul>
-              <li>1) “产品编码”字段为必填项。</li>
-              <li>2) “起订量限制“为选项,只可选择”按整箱‘或者“按设置数量”,选择“按设置数量”时,“起订数量”为必填项。</li>
+              <li>1) 下载导入模板得到的excel中,是目前系统中全部的产品信息,请修改变化的字段(该行的其他字段保持不变),并删除没有变化的行</li>
+              <li>2) “产品编码”字段为必填项</li>
+              <li>3) “订货周期”字段只能输入正整数,如果没有订货周期,保持为空即可</li>
+              <li>4) “是否淘汰”字段,如果确定淘汰,则输入“是”,如果不淘汰,则不需要输入,保持为空即可</li>
+              <li>5) “淘汰描述”字段,只有当是否淘汰为“是”时,才能录入淘汰描述,否则,淘汰描述只能保持为空</li>
             </ul>
             <a :href="filePath" style="padding: 5px 0 0 23px;display: block;">
               <a-icon type="download" style="padding-right: 5px;" />下载导入模板
@@ -54,13 +57,11 @@
             id="importGuide-cancel"
             size="large"
             class="button-cancel"
-            @click="isShow=false"
+            @click="handleBack"
             style="padding: 0 60px;margin-left: 15px;">取消</a-button>
         </div>
       </div>
     </a-card>
-    <!-- 导入 -->
-    <!-- <chooseImportModal :openModal="openImportModal" :paramsData="paramsData" @close="handleClose" @ok="hanldeOk" /> -->
   </div>
 </template>
 
@@ -70,8 +71,8 @@ export default {
   components: { Upload },
   data () {
     return {
-      filePath: 'http://jg-ocs.oss-cn-beijing.aliyuncs.com/templ/promo/normal_product_templ.xlsx',
-      openImportModal: false, //  导入
+      // filePath: 'http://jg-ocs.oss-cn-beijing.aliyuncs.com/templ/promo/normal_product_templ.xlsx',
+      filePath: 'javascript:;',
       attachAction: process.env.VUE_APP_API_BASE_URL + '/upload',
       paramsData: null,
       uploadParams: {
@@ -86,44 +87,32 @@ export default {
     },
     // 下一步
     handlerNextStep () {
-      if (this.paramsData) {
-        this.openImportModal = true
-      } else {
-        this.$message.warning('添加文件后再进行下一步操作!')
-      }
+      // if (this.paramsData) {
+      this.$router.push({ path: `/inventoryManagement/intelligentReplenishment/import/${this.$route.params.sn}` })
+      // } else {
+      //   this.$message.warning('添加文件后再进行下一步操作!')
+      // }
     },
     // 上传文件  change
     changeImport (file) {
-      if (file) {
-        this.paramsData = {
-          promoRuleType: this.params.promoRuleType || '',
-          promoGoodsType: this.params.promoGoodsType || '',
-          path: file
-        }
-      }
-    },
-    // 导入
-    hanldeOk (obj) {
-      if (obj && obj.length > 0) {
-        this.$emit('ok', obj)
-        this.isShow = false
-      }
-    },
-    // 关闭
-    handleClose () {
-      this.openImportModal = false
-      this.isShow = false
+      console.log(file, '----上传')
     }
   }
 }
 </script>
 
 <style lang="less">
-  .importGuide-warp{
+  .intelligentReplenishmentSet-wrap{
+    .intelligentReplenishmentSet-back{
+      margin-bottom: 10px;
+    }
     .importGuide-con{
+      width: 900px;
+      margin: 30px auto 50px;
+      line-height: 30px;
       .explain-con{
         .explain-item{
-          margin-bottom: 10px;
+          margin-bottom: 40px;
           .explain-tit{
             font-weight: bold;
             span{
@@ -153,7 +142,7 @@ export default {
         }
       }
       .btn-con{
-        margin: 60px 0 20px;
+        margin: 80px 0 20px;
         .button-cancel{
           font-size: 12px;
         }