Browse Source

销售记录

lilei 4 years ago
parent
commit
567ddf1729

+ 90 - 78
src/views/salesManagement/salesQuery/productSalesRecordModal.vue

@@ -1,68 +1,30 @@
 <template>
   <a-modal
     centered
-    class="productInfoDetail-modal"
+    class="salesRecord-modal"
     :footer="null"
     :maskClosable="false"
     :title="modalTit"
     v-model="isShow"
     @cancle="isShow=false"
     width="80%">
-    <!-- 产品详情 -->
     <div>
-    <!-- <div v-if="detailsData"> -->
-      <a-row :gutter="35">
-        <a-col :span="8" class="item-cont">
-          <p class="item-label">产品名称:</p>
-          <p class="item-main">名称思密达</p>
-          <!-- <p class="item-main">{{ detailsData.name }}</p> -->
-        </a-col>
-        <a-col :span="8" class="item-cont">
-          <p class="item-label">产品编码:</p>
-          <p class="item-main">名称思密达</p>
-          <!-- <p class="item-main">{{ detailsData.name }}</p> -->
-        </a-col>
-        <a-col :span="8" class="item-cont">
-          <p class="item-label">原厂编码:</p>
-          <p class="item-main">名称思密达</p>
-          <!-- <p class="item-main">{{ detailsData.name }}</p> -->
-        </a-col>
-      </a-row>
-      <a-row :gutter="35">
-        <a-col :span="8" class="item-cont">
-          <p class="item-label">基本单位:</p>
-          <p class="item-main">陕西省西安市未央区凤城八路</p>
-          <!-- <p class="item-main">{{ detailsData.provinceName }}{{ detailsData.cityName }}{{ detailsData.districtName }}{{ detailsData.address }}</p> -->
-        </a-col>
-        <a-col :span="8" class="item-cont">
-          <p class="item-label">产品品牌:</p>
-          <p class="item-main">名称思密达</p>
-          <!-- <p class="item-main">{{ detailsData.name }}</p> -->
-        </a-col>
-        <a-col :span="8" class="item-cont">
-          <p class="item-label">产品类别:</p>
-          <p class="item-main">名称思密达</p>
-          <!-- <p class="item-main">{{ detailsData.name }}</p> -->
-        </a-col>
-      </a-row>
-      <a-row :gutter="35">
-        <a-col :span="8" class="item-cont">
-          <p class="item-label">经销批发价:</p>
-          <p class="item-main">名称思密达</p>
-          <!-- <p class="item-main">{{ detailsData.name }}</p> -->
-        </a-col>
-        <a-col :span="8" class="item-cont">
-          <p class="item-label">终端价:</p>
-          <p class="item-main">名称思密达</p>
-          <!-- <p class="item-main">{{ detailsData.name }}</p> -->
-        </a-col>
-        <a-col :span="8" class="item-cont">
-          <p class="item-label">车主价:</p>
-          <p class="item-main">名称思密达</p>
-          <!-- <p class="item-main">{{ detailsData.name }}</p> -->
-        </a-col>
-      </a-row>
-      <div class="btn-cont"><a-button id="product-management-detail-modal-back" @click="isShow = false">返回列表</a-button></div>
+      <a-tabs type="card" default-active-key="1" @change="callback">
+        <a-tab-pane key="1" tab="当前客户">
+        </a-tab-pane>
+        <a-tab-pane key="2" tab="全部客户">
+        </a-tab-pane>
+      </a-tabs>
+      <!-- 表格 -->
+      <s-table
+        class="sTable"
+        ref="table"
+        size="default"
+        :rowKey="(record) => record.id"
+        :columns="columns"
+        :data="loadData"
+        bordered>
+      </s-table>
     </div>
   </a-modal>
 </template>
@@ -70,7 +32,7 @@
 <script>
 import { STable } from '@/components'
 export default {
-  name: 'productInfoDetailModal',
+  name: 'salesRecordModal',
   components: { STable },
   props: {
     openModal: { //  弹框显示状态
@@ -84,19 +46,87 @@ export default {
   },
   computed: {
     modalTit () {
-      return '产品详情'
+      return '销售记录'
     }
   },
   data () {
     return {
       isShow: this.openModal, //  是否打开弹框
-      detailsData: null, //  网点数据
+      // 表头
+      columns: [
+        {
+          title: '销售时间',
+          dataIndex: 'salesTime',
+          align: 'center',
+          width: 250
+        },
+        {
+          title: '销售价(¥)',
+          dataIndex: 'price',
+          align: 'center',
+          width: 150
+        },
+        {
+          title: '销售数量',
+          dataIndex: 'salesNums',
+          align: 'center',
+          width: 150
+        },
+        {
+          title: '客户名称',
+          dataIndex: 'productBrand',
+          align: 'center'
+        },
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.disabled = true
+        // return customerBundleDelayList( Object.assign(parameter, this.queryParam) ).then(res => {
+        //   const data = res.data
+        //   return data
+        // })
+        const _this = this
+        return new Promise(function(resolve, reject){
+          const data = {
+            pageNo: 1,
+            pageSize: 10,
+            list: [
+              { 
+                id: '1', 
+                salesTime: '2020-12-23 15:23:15', 
+                price: 56, 
+                salesNums: 12, 
+                productBrand: '箭冠品牌', 
+              },
+              {
+                id: '23', 
+                salesTime: '2020-12-23 15:23:15', 
+                price: 56, 
+                salesNums: 12, 
+                productBrand: '箭冠品牌', 
+              },
+              {
+                id: '44', 
+                salesTime: '2020-12-23 15:23:15', 
+                price: 56, 
+                salesNums: 12, 
+                productBrand: '箭冠品牌', 
+              }
+            ],
+            count: 100
+          }
+          resolve(data)
+        })
+      },
     }
   },
   methods: {
     //  获取详情
     getDetail(){
       
+    },
+    callback(key){
+      console.log(key);
     }
   },
   watch: {
@@ -120,27 +150,9 @@ export default {
 </script>
 
 <style lang="less">
-  .productInfoDetail-modal{
+  .salesRecord-modal{
     .ant-modal-body {
-    	padding: 40px 40px 24px;
-    }
-    .item-cont {
-    	margin-bottom: 15px;
-    	display: flex;
-    	.item-label {
-    		width: 115px;
-    		font-size: 14px;
-    		color: rgba(0, 0, 0, 0.85);
-    		flex-shrink: 0;
-    	}
-    	.item-main {
-    		flex-grow: 1;
-        word-break: break-all;
-    	}
-    }
-    .btn-cont {
-    	text-align: center;
-    	margin: 35px 0 10px;
+    	padding: 10px;
     }
   }
 </style>

+ 4 - 3
src/views/salesManagement/salesQuery/queryPart.vue

@@ -51,7 +51,7 @@
           <a-col :md="6" :sm="24">
             <a-button style="margin-bottom: 18px;" type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="productInfoList-refresh">查询</a-button>
             <a-button style="margin: 0 0 18px 8px" @click="resetSearchForm" :disabled="disabled" id="productInfoList-reset">重置</a-button>
-            <a @click="advanced=!advanced" style="margin:0 8px">
+            <a @click="advanced=!advanced" style="margin:0 15px 0 8px">
               {{ advanced ? '收起' : '展开' }}
               <a-icon :type="advanced ? 'up' : 'down'"/>
             </a>
@@ -61,7 +61,7 @@
               </template>
               <a-icon type="question-circle" theme="twoTone" />
             </a-popover>
-            <a-icon style="margin:0 8px" type="setting" theme="twoTone" />
+            <a-icon style="margin:0 15px" type="setting" theme="twoTone" />
           </a-col>
         </a-row>
       </a-form>
@@ -209,7 +209,8 @@ export default {
                 salesNums: 12 ,
                 dw: '个'
                 }
-            ]
+            ],
+            count: 10
           }
           const no = (data.pageNo - 1) * data.pageSize
           for (var i = 0; i < data.list.length; i++) {

+ 15 - 3
src/views/salesManagement/salesQuery/salesNew.vue

@@ -7,7 +7,7 @@
         >
           <template slot="subTitle">
             <a href="javascript:;" @click="() => $router.go(-1)">客户名称:车领主常青二路店</a>
-            <a-button size="small" style="margin-left:50px" key="0">
+            <a-button size="small" @click="handleEditCustom" style="margin-left:50px" key="0">
               编辑
             </a-button>
           </template>
@@ -83,6 +83,8 @@
         </template>
       </s-table>
     </a-card>
+    <!-- 选择客户弹框 -->
+    <chooseCustom :show="openModal" @ok="chooseCustomOk" @cancel="openModal=false"></chooseCustom>
   </div>
 </template>
 
@@ -90,17 +92,20 @@
   import { STable, VSelect } from '@/components'
   import queryPart from './queryPart.vue'
   import EditableCell from '@/views/common/editInput.js'
+  import chooseCustom from './chooseCustom.vue'
   export default{
     name: 'salesDetail',
     components: {
       STable,
       VSelect,
       queryPart,
-      EditableCell
+      EditableCell,
+      chooseCustom
     },
     data(){
       return {
         disabled: false,
+        openModal: false,
         dataSource:[],
         productForm:{
           productNo: '',
@@ -237,7 +242,14 @@
       },
       handleSearch(){
         
-      }
+      },
+      // 选择客户成功
+      chooseCustomOk(data){
+        
+      },
+      handleEditCustom(){
+        this.openModal = true
+      },
     },
   }
 </script>