Browse Source

销售出库

lilei 4 years ago
parent
commit
c881b92b63

+ 72 - 36
src/config/router.config.js

@@ -117,46 +117,35 @@ export const asyncRouterMap = [{
         ]
       },
       {
-        path: '/salesManagement/customerManagement',
-        redirect: '/salesManagement/customerManagement/list',
-        name: 'customerManagement',
+        path: '/salesManagement/outboundOrder',
+        redirect: '/salesManagement/outboundOrder/list',
+        name: 'outboundOrder',
         component: RouteView,
         meta: {
-          title: '客户管理',
-          icon: 'shopping'
-          // permission: 'M_goodsManage_list'
+          title: '出库',
+          icon: 'export'
+          // permission: 'M_outboundOrder'
         },
         hideChildrenInMenu: true,
         children: [
           {
-            path: '/salesManagement/customerManagement/list',
-            name: 'customerManagementList',
-            component: () => import(/* webpackChunkName: "shop" */ '@/views/salesManagement/customerManagement/list.vue'),
-            meta: {
-              title: '客户列表',
-              icon: 'shopping',
-              hidden: true
-              // permission: 'M_goodsManage_list'
-            }
-          },
-          {
-            path: '/salesManagement/customerManagement/add',
-            name: 'customerManagementAdd',
-            component: () => import(/* webpackChunkName: "shop" */ '@/views/salesManagement/customerManagement/edit.vue'),
+            path: 'list',
+            name: 'outboundOrderList',
+            component: () => import(/* webpackChunkName: "salesManagement" */ '@/views/salesManagement/outboundOrder/list.vue'),
             meta: {
-              title: '新增客户',
-              icon: 'shopping',
+              title: '出库列表',
+              icon: 'profile',
               hidden: true
-              // permission: 'B_goodsManage_edit'
+              // permission: 'M_outboundOrder_list'
             }
           },
           {
-            path: '/salesManagement/customerManagement/edit/:id',
-            name: 'customerManagementEdit',
-            component: () => import(/* webpackChunkName: "shop" */ '@/views/salesManagement/customerManagement/edit.vue'),
+            path: 'detail/:id',
+            name: 'outboundOrderDetail',
+            component: () => import(/* webpackChunkName: "salesManagement" */ '@/views/salesManagement/outboundOrder/detail.vue'),
             meta: {
-              title: '编辑客户',
-              icon: 'shopping',
+              title: '出库明细',
+              icon: 'file-done',
               hidden: true
               // permission: 'B_goodsManage_edit'
             }
@@ -170,7 +159,7 @@ export const asyncRouterMap = [{
         component: RouteView,
         meta: {
           title: '急件冲减',
-          icon: 'shopping'
+          icon: 'rocket'
           // permission: 'M_goodsManage_list'
         },
         hideChildrenInMenu: true,
@@ -178,10 +167,10 @@ export const asyncRouterMap = [{
           {
             path: '/salesManagement/urgentItemsOffset/list',
             name: 'urgentItemsOffsetList',
-            component: () => import(/* webpackChunkName: "shop" */ '@/views/salesManagement/urgentItemsOffset/list.vue'),
+            component: () => import(/* webpackChunkName: "salesManagement" */ '@/views/salesManagement/urgentItemsOffset/list.vue'),
             meta: {
               title: '急件冲减列表',
-              icon: 'shopping',
+              icon: 'profile',
               hidden: true
               // permission: 'M_goodsManage_list'
             }
@@ -189,10 +178,57 @@ export const asyncRouterMap = [{
           {
             path: '/salesManagement/urgentItemsOffset/detail/:id',
             name: 'urgentItemsOffsetDetail',
-            component: () => import(/* webpackChunkName: "shop" */ '@/views/salesManagement/urgentItemsOffset/detail.vue'),
+            component: () => import(/* webpackChunkName: "salesManagement" */ '@/views/salesManagement/urgentItemsOffset/detail.vue'),
             meta: {
               title: '急件冲减详情',
-              icon: 'shopping',
+              icon: 'snippets',
+              hidden: true
+              // permission: 'B_goodsManage_edit'
+            }
+          }
+        ]
+      },
+      {
+        path: '/salesManagement/customerManagement',
+        redirect: '/salesManagement/customerManagement/list',
+        name: 'customerManagement',
+        component: RouteView,
+        meta: {
+          title: '客户管理',
+          icon: 'idcard'
+          // permission: 'M_goodsManage_list'
+        },
+        hideChildrenInMenu: true,
+        children: [
+          {
+            path: '/salesManagement/customerManagement/list',
+            name: 'customerManagementList',
+            component: () => import(/* webpackChunkName: "salesManagement" */ '@/views/salesManagement/customerManagement/list.vue'),
+            meta: {
+              title: '客户列表',
+              icon: 'profile',
+              hidden: true
+              // permission: 'M_goodsManage_list'
+            }
+          },
+          {
+            path: '/salesManagement/customerManagement/add',
+            name: 'customerManagementAdd',
+            component: () => import(/* webpackChunkName: "salesManagement" */ '@/views/salesManagement/customerManagement/edit.vue'),
+            meta: {
+              title: '新增客户',
+              icon: 'plus-circle',
+              hidden: true
+              // permission: 'B_goodsManage_edit'
+            }
+          },
+          {
+            path: '/salesManagement/customerManagement/edit/:id',
+            name: 'customerManagementEdit',
+            component: () => import(/* webpackChunkName: "salesManagement" */ '@/views/salesManagement/customerManagement/edit.vue'),
+            meta: {
+              title: '编辑客户',
+              icon: 'edit',
               hidden: true
               // permission: 'B_goodsManage_edit'
             }
@@ -359,7 +395,7 @@ export const asyncRouterMap = [{
               hidden: true
               // permission: 'B_goodsManage_edit'
             }
-          },
+          }
         ]
       }
     ]
@@ -489,7 +525,7 @@ export const asyncRouterMap = [{
             }
           }
         ]
-      },
+      }
     ]
   },
   // 采购管理
@@ -655,7 +691,7 @@ export const asyncRouterMap = [{
           }
         ]
       }
-  
+
     ]
   },
   // 产品管理

+ 274 - 0
src/views/salesManagement/outboundOrder/detail.vue

@@ -0,0 +1,274 @@
+<template>
+  <div>
+    <a-affix>
+      <a-page-header
+        :ghost="false"
+        @back="() => $router.go(-1)"
+      >
+        <template slot="subTitle">
+          <a href="javascript:;" @click="() => $router.go(-1)">返回列表</a>
+          <a-button size="small" style="margin-left:50px" key="0">
+            订单推送
+          </a-button>
+          <a-button size="small" type="danger" style="margin-left:20px" key="1">
+            销售导出
+          </a-button>
+        </template>
+        <template slot="extra">
+          <span>打印字段:</span>
+          <a-select key="2" style="width:150px" id="sales-pritKey" placeholder="请选择打印字段" allowClear>
+            <a-select-option v-for="item in pritKey" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
+          </a-select>
+          <span><i style="color: red;">*</i>打印模板:</span>
+          <a-select key="3" style="width:150px" id="sales-pritKey" placeholder="请选择打印模板" allowClear>
+            <a-select-option v-for="item in pritModal" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
+          </a-select>
+          <a-button key="4">
+            打印预览
+          </a-button>
+          <a-button key="5" type="primary">
+            快速打印
+          </a-button>
+        </template>
+        <a-descriptions size="small" :column="4">
+          <a-descriptions-item label="客户名称">
+            张三的
+          </a-descriptions-item>
+          <a-descriptions-item label="客户地址">
+            山西省太原市阿斯加德法律静安寺水电费
+          </a-descriptions-item>
+          <a-descriptions-item label="支付方式">
+            货到付款
+          </a-descriptions-item>
+          <a-descriptions-item label="收款方式">
+            现金
+          </a-descriptions-item>
+          <a-descriptions-item label="联系手机">
+            13709146191
+          </a-descriptions-item>
+          <a-descriptions-item label="联系电话">
+            13709146191
+          </a-descriptions-item>
+          <a-descriptions-item label="备注">
+            备注备注备注备注备注
+          </a-descriptions-item>
+          <a-descriptions-item label="销售单号">
+            34242sdf234234
+          </a-descriptions-item>
+          <a-descriptions-item label="制单人">
+            王明
+          </a-descriptions-item>
+          <a-descriptions-item label="业务员">
+            李四
+          </a-descriptions-item>
+          <a-descriptions-item label="审核状态">
+            未审核
+          </a-descriptions-item>
+          <a-descriptions-item label="完结状态">
+            未完结
+          </a-descriptions-item>
+        </a-descriptions>
+      </a-page-header>
+    </a-affix>
+
+    <a-card size="small" :bordered="false" class="pages-wrap">
+      <!-- alert -->
+      <a-alert type="info">
+        <div slot="message">
+          <div>
+            <span>总款数:1;</span>
+            <span>总数量:6;</span>
+            <span>总赠品数量:3;</span>
+            <span>急件总款数:7;</span>
+            <span>急件总数量:12;</span>
+          </div>
+          <div>
+            <span>总售价:11;</span>
+            <span>总成本:8;</span>
+            <span>总毛利:10;</span>
+            <span>折后总售价:11;</span>
+            <span>折扣:0.00%;</span>
+            <span>折扣金额:0.00;</span>
+          </div>
+        </div>
+      </a-alert>
+      <!-- 列表 -->
+      <s-table
+        class="sTable"
+        ref="table"
+        size="default"
+        :rowKey="(record) => record.id"
+        :columns="columns"
+        :data="loadData"
+        :scroll="{ x: 1500, y: 300 }"
+        bordered>
+        <!-- 状态 -->
+        <template slot="state" slot-scope="text, record">
+          <span>{{ record.state == 1 ? '已启用' : '已禁用' }}</span>
+        </template>
+      </s-table>
+    </a-card>
+  </div>
+</template>
+
+<script>
+import { STable, VSelect } from '@/components'
+export default {
+  name: 'SalesDetail',
+  components: {
+    STable,
+    VSelect
+  },
+  data () {
+    return {
+      disabled: false,
+      pritKey: [
+        {
+          id: 0,
+          name: '打印促销'
+        },
+        {
+          id: 1,
+          name: '打印支付方式'
+        },
+        {
+          id: 2,
+          name: '打印收款方式'
+        }
+      ],
+      pritModal: [
+        {
+          id: 0,
+          name: '普通模板一'
+        },
+        {
+          id: 1,
+          name: '普通模板二'
+        },
+        {
+          id: 2,
+          name: '仓库模板一'
+        }
+      ],
+      // 表头
+      columns: [
+        {
+          title: '序号',
+          dataIndex: 'no',
+          align: 'center',
+          width: 100
+        },
+        {
+          title: '产品编码',
+          dataIndex: 'salerNo',
+          align: 'center'
+        },
+        {
+          title: '产品名称',
+          dataIndex: 'storeNo',
+          align: 'center'
+        },
+        {
+          title: '原厂编码',
+          dataIndex: 'custName',
+          align: 'center'
+        },
+        {
+          title: '成本价',
+          dataIndex: 'totalP',
+          align: 'center'
+        },
+        {
+          title: '售价',
+          dataIndex: 'totalNums',
+          align: 'center'
+        },
+        {
+          title: '折后售价',
+          dataIndex: 'totalPrice',
+          align: 'center'
+        },
+        {
+          title: '销售数量',
+          dataIndex: 'payType',
+          align: 'center'
+        },
+        {
+          title: '单位',
+          dataIndex: 'mementPay',
+          align: 'center'
+        },
+        {
+          title: '辅助数量',
+          dataIndex: 'shDate',
+          align: 'center'
+        },
+        {
+          title: '售价小计',
+          dataIndex: 'isJj',
+          align: 'center'
+        },
+        {
+          title: '折后小计',
+          dataIndex: 'status',
+          align: 'center'
+        },
+        {
+          title: '仓库',
+          dataIndex: 'status',
+          align: 'center'
+        },
+        {
+          title: '仓位',
+          dataIndex: 'status',
+          align: 'center'
+        },
+        {
+          title: '销售类型',
+          dataIndex: 'status',
+          align: 'center'
+        }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.disabled = true
+        // return customerBundleDelayList( 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
+        //   }
+        //   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', productOldNum: 'jgqp111123545', productBrand: '箭冠品牌', productType: '产品分类1', inventoryNum: '5', inventoryMoney: '122' }
+            ],
+            count: 10
+          }
+          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)
+        })
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .pages-wrap{
+    margin-top: 15px;
+    .sTable{
+      margin-top: 15px;
+    }
+  }
+</style>

+ 239 - 0
src/views/salesManagement/outboundOrder/list.vue

@@ -0,0 +1,239 @@
+<template>
+  <a-card :bordered="false" class="outboundOrderList-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="8" :sm="24">
+            <a-form-item label="审核时间">
+              <a-range-picker
+                style="width:100%"
+                id="outboundOrderList-creatTime"
+                :disabledDate="disabledDate"
+                v-model="time"
+                :format="dateFormat"
+                :placeholder="['开始时间', '结束时间']" />
+            </a-form-item>
+            </a-form-item>
+          </a-col>
+          <a-col :md="6" :sm="24">
+            <a-form-item label="客户名称">
+              <a-select
+                id="outboundOrderList-bundleName"
+                placeholder="请选择"
+                allowClear
+                v-model="queryParam.dataSourceNo"
+                :showSearch="true"
+                option-filter-prop="children"
+                :filter-option="filterOption">
+                <a-select-option v-for="item in brandData" :key="item.salesChannelNo" :value="item.salesChannelNo">{{ item.salesChannelName }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :md="5" :sm="24">
+            <a-form-item label="出库类型">
+              <v-select
+                v-model="queryParam.outType"
+                ref="outType"
+                id="outboundOrderList-outType"
+                code="PAYMENT_TYPE"
+                placeholder="请选择出库类型"
+                allowClear></v-select>
+            </a-form-item>
+          </a-col>
+          <template v-if="advanced">
+            <a-col :md="5" :sm="24">
+              <a-form-item label="单据状态">
+                <v-select
+                  v-model="queryParam.billStatus"
+                  ref="billStatus"
+                  id="outboundOrderList-billStatus"
+                  code="PAYMENT_TYPE"
+                  placeholder="请选择单据状态"
+                  allowClear></v-select>
+              </a-form-item>
+            </a-col>
+          </template>
+          <a-col :md="5" :sm="24">
+            <a-button type="primary" @click="$refs.table.refresh(true)" :disabled="disabled" id="outboundOrderList-refresh">查询</a-button>
+            <a-button style="margin-left: 8px" @click="resetSearchForm" :disabled="disabled" id="outboundOrderList-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>
+    <!-- 列表 -->
+    <div style="margin-bottom: 15px">
+      <a-button type="primary" id="outboundOrder-export" :disabled="!hasSelected" :loading="loading" @click="handleOutbounds">
+        批量出库
+      </a-button>
+      <span style="margin-left: 8px">
+        <template v-if="hasSelected">
+          {{ `已选 ${selectedRowKeys.length} 项` }}
+        </template>
+      </span>
+    </div>
+    <s-table
+      class="sTable"
+      ref="table"
+      size="default"
+      :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
+      :rowKey="(record) => record.id"
+      :columns="columns"
+      :data="loadData"
+      :showPagination="false"
+      bordered>
+      <!-- 状态 -->
+      <template slot="state" slot-scope="text, record">
+        <span :class="[record.state == 1 ? 'green' : 'red']">{{ record.state == 1 ? '已出库' : '未出库' }}</span>
+      </template>
+      <!-- 操作 -->
+      <template slot="action" slot-scope="text, record">
+        <a-button size="small" type="primary" @click="handleOutbound(record)" id="outboundOrderList-out-btn">出库</a-button>
+        <a-button size="small" @click="handleDetail(record)" style="margin-left: 10px;" id="outboundOrderList-detail-btn">明细</a-button>
+      </template>
+    </s-table>
+  </a-card>
+</template>
+
+<script>
+import moment from 'moment'
+// import { customerBundleDelayList, customerBundleExportDelay } from '@/api/FinancialManagement'
+import { STable, VSelect } from '@/components'
+export default {
+  components: { STable, VSelect },
+  data () {
+    return {
+      advanced: false, // 高级搜索 展开/关闭
+      queryParam: { //  查询条件
+        bundleName: '', //  供应商名称
+        state: undefined //  状态
+      },
+      disabled: false, //  查询、重置按钮是否可操作
+      dateFormat: 'YYYY-MM-DD',
+      time: [], //  创建时间
+      brandData: [], //  客户 下拉数据
+      columns: [
+        { title: '序号', dataIndex: 'no', width: 100, align: 'center' },
+        { title: '创建时间', dataIndex: 'inventoryMoneys', width: 180, align: 'center' },
+        { title: '关联单号', dataIndex: 'productName', width: 200, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '客户名称', dataIndex: 'productBrand', width: 200, align: 'center', ellipsis: true, customRender: function (text) { return text || '--' } },
+        { title: '总款数', dataIndex: 'productType', width: 200, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
+        { title: '总数量', dataIndex: 'inventoryNum', width: 180, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
+        { title: '总售价', dataIndex: 'totalPrice', width: 180, align: 'center', customRender: function (text) { return ((text || text == 0) ? ('¥' + text) : '--') } },
+        { title: '审核时间', dataIndex: 'authTime', width: 180, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '出库时间', dataIndex: 'outTime', width: 180, align: 'center', customRender: function (text) { return text || '--' } },
+        { title: '出库状态', scopedSlots: { customRender: 'state' }, width: 180, align: 'center' },
+        { title: '操作', scopedSlots: { customRender: 'action' }, width: 240, align: 'center' }
+      ],
+      selectedRowKeys: [], // Check here to configure the default column
+      loading: false,
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.disabled = true
+        // return customerBundleDelayList( 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
+        //   }
+        //   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', 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)
+        })
+      }
+    }
+  },
+  computed: {
+    hasSelected () {
+      return this.selectedRowKeys.length > 0
+    }
+  },
+  methods: {
+    // 不可选日期
+    disabledDate (date, dateStrings) {
+      return date && date.valueOf() > Date.now()
+    },
+    filterOption (input, option) {
+    	return (
+    		option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
+    	)
+    },
+    //  重置
+    resetSearchForm () {
+      this.queryParam.orderBundleNo = ''
+      this.queryParam.orderBundle.custMobile = ''
+      this.queryParam.bundleName = ''
+      this.queryParam.itemName = ''
+      this.oldTime = undefined
+      this.newTime = undefined
+      this.$refs.table.refresh(true)
+    },
+    //  详情
+    handleDetail (row) {
+      this.$router.push({ name: 'outboundOrderDetail', params: { id: row.id } })
+    },
+    // 单个出库
+    handleOutbound (row) {
+      this.$confirm({
+        title: '提升',
+        content: '确认要出库吗?',
+        onOk () {
+          console.log('OK')
+        },
+        onCancel () {
+          console.log('Cancel')
+        }
+      })
+    },
+    // 批量出库
+    handleOutbounds () {
+      this.loading = true
+      // ajax request after empty completing
+      setTimeout(() => {
+        this.loading = false
+        this.selectedRowKeys = []
+      }, 1000)
+    },
+    onSelectChange (selectedRowKeys) {
+      console.log('selectedRowKeys changed: ', selectedRowKeys)
+      this.selectedRowKeys = selectedRowKeys
+    }
+  }
+}
+</script>
+
+<style lang="less">
+  .outboundOrderList-wrap{
+    .sTable{
+      margin-top: 20px;
+      table{
+        width: auto;
+      }
+    }
+    .red{
+      color: #ff0000;
+    }
+    .green{
+      color: #19be6b;
+    }
+  }
+</style>

+ 228 - 224
src/views/salesManagement/salesQuery/salesDetail.vue

@@ -1,88 +1,92 @@
 <template>
   <div>
     <a-affix>
-        <a-page-header
-          :ghost="false"
-          @back="() => $router.go(-1)"
-        >
-          <template slot="subTitle">
-            <a href="javascript:;" @click="() => $router.go(-1)">返回列表</a>
-            <a-button size="small" style="margin-left:50px" key="0">
-              编辑
-            </a-button>
-          </template>
-          <template slot="extra">
-            <span>打印字段:</span>
-            <a-select key="4" style="width:150px" id="sales-pritKey" placeholder="请选择打印字段" allowClear>
-              <a-select-option v-for="item in pritKey" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
-            </a-select>
-            <span><i style="color: red;">*</i>打印模板:</span>
-            <a-select key="3" style="width:150px" id="sales-pritKey" placeholder="请选择打印模板" allowClear>
-              <a-select-option v-for="item in pritModal" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
-            </a-select>
-            <a-button key="2">
-              打印预览
-            </a-button>
-            <a-button key="1" type="primary">
-              快速打印
-            </a-button>
-          </template>
-          <a-descriptions size="small" :column="4">
-            <a-descriptions-item label="客户名称">
-              张三的
-            </a-descriptions-item>
-            <a-descriptions-item label="客户地址">
-              山西省太原市阿斯加德法律静安寺水电费
-            </a-descriptions-item>
-            <a-descriptions-item label="支付方式">
-              货到付款
-            </a-descriptions-item>
-            <a-descriptions-item label="收款方式">
-              现金
-            </a-descriptions-item>
-            <a-descriptions-item label="联系手机">
-              13709146191
-            </a-descriptions-item>
-            <a-descriptions-item label="联系电话">
-              13709146191
-            </a-descriptions-item>
-            <a-descriptions-item label="备注">
-              备注备注备注备注备注
-            </a-descriptions-item>
-            <a-descriptions-item label="销售单号">
-              34242sdf234234
-            </a-descriptions-item>
-            <a-descriptions-item label="制单人">
-              王明
-            </a-descriptions-item>
-            <a-descriptions-item label="业务员">
-              李四
-            </a-descriptions-item>
-            <a-descriptions-item label="审核状态">
-              未审核
-            </a-descriptions-item>
-            <a-descriptions-item label="完结状态">
-              未完结
-            </a-descriptions-item>
-          </a-descriptions>
-        </a-page-header>
+      <a-page-header
+        :ghost="false"
+        @back="() => $router.go(-1)"
+      >
+        <template slot="subTitle">
+          <a href="javascript:;" @click="() => $router.go(-1)">返回列表</a>
+          <a-button size="small" style="margin-left:50px" key="0">
+            编辑
+          </a-button>
+        </template>
+        <template slot="extra">
+          <span>打印字段:</span>
+          <a-select key="4" style="width:150px" id="sales-pritKey" placeholder="请选择打印字段" allowClear>
+            <a-select-option v-for="item in pritKey" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
+          </a-select>
+          <span><i style="color: red;">*</i>打印模板:</span>
+          <a-select key="3" style="width:150px" id="sales-pritKey" placeholder="请选择打印模板" allowClear>
+            <a-select-option v-for="item in pritModal" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
+          </a-select>
+          <a-button key="2">
+            打印预览
+          </a-button>
+          <a-button key="1" type="primary">
+            快速打印
+          </a-button>
+        </template>
+        <a-descriptions size="small" :column="4">
+          <a-descriptions-item label="客户名称">
+            张三的
+          </a-descriptions-item>
+          <a-descriptions-item label="客户地址">
+            山西省太原市阿斯加德法律静安寺水电费
+          </a-descriptions-item>
+          <a-descriptions-item label="支付方式">
+            货到付款
+          </a-descriptions-item>
+          <a-descriptions-item label="收款方式">
+            现金
+          </a-descriptions-item>
+          <a-descriptions-item label="联系手机">
+            13709146191
+          </a-descriptions-item>
+          <a-descriptions-item label="联系电话">
+            13709146191
+          </a-descriptions-item>
+          <a-descriptions-item label="备注">
+            备注备注备注备注备注
+          </a-descriptions-item>
+          <a-descriptions-item label="销售单号">
+            34242sdf234234
+          </a-descriptions-item>
+          <a-descriptions-item label="制单人">
+            王明
+          </a-descriptions-item>
+          <a-descriptions-item label="业务员">
+            李四
+          </a-descriptions-item>
+          <a-descriptions-item label="审核状态">
+            未审核
+          </a-descriptions-item>
+          <a-descriptions-item label="完结状态">
+            未完结
+          </a-descriptions-item>
+        </a-descriptions>
+      </a-page-header>
     </a-affix>
-    
-    <a-card :bordered="false" class="pages-wrap">
+
+    <a-card size="small" :bordered="false" class="pages-wrap">
       <!-- alert -->
       <a-alert type="info">
         <div slot="message">
-          <span>总款数:1;</span>
-          <span>总数量:6;</span>
-          <span>总赠品数量:3;</span>
-          <span>急件总款数:7;</span>
-          <span>急件总数量:12;</span>
-          <span>总售价:11;</span>
-          <span>总成本:8;</span>
-          <span>总毛利:10;</span>
-          <span>折后总售价:11;</span>
-          <span>折扣:0.00%;</span>
-          <span>折扣金额:0.00;</span>
+          <div>
+            <span>总款数:1;</span>
+            <span>总数量:6;</span>
+            <span>总赠品数量:3;</span>
+            <span>急件总款数:7;</span>
+            <span>急件总数量:12;</span>
+          </div>
+          <div>
+            <span>总售价:11;</span>
+            <span>总成本:8;</span>
+            <span>总毛利:10;</span>
+            <span>折后总售价:11;</span>
+            <span>折扣:0.00%;</span>
+            <span>折扣金额:0.00;</span>
+          </div>
         </div>
       </a-alert>
       <!-- 列表 -->
@@ -97,7 +101,7 @@
         bordered>
         <!-- 状态 -->
         <template slot="state" slot-scope="text, record">
-          <span>{{record.state == 1 ? '已启用' : '已禁用'}}</span>
+          <span>{{ record.state == 1 ? '已启用' : '已禁用' }}</span>
         </template>
       </s-table>
     </a-card>
@@ -105,156 +109,156 @@
 </template>
 
 <script>
-  import { STable, VSelect } from '@/components'
-  export default{
-    name: 'salesDetail',
-    components: {
-      STable,
-      VSelect
-    },
-    data(){
-      return {
-        disabled: false,
-        pritKey:[
-          {
-            id: 0,
-            name:'打印促销'
-          },
-          {
-            id: 1,
-            name:'打印支付方式'
-          },
-          {
-            id: 2,
-            name:'打印收款方式'
+import { STable, VSelect } from '@/components'
+export default {
+  name: 'SalesDetail',
+  components: {
+    STable,
+    VSelect
+  },
+  data () {
+    return {
+      disabled: false,
+      pritKey: [
+        {
+          id: 0,
+          name: '打印促销'
+        },
+        {
+          id: 1,
+          name: '打印支付方式'
+        },
+        {
+          id: 2,
+          name: '打印收款方式'
+        }
+      ],
+      pritModal: [
+        {
+          id: 0,
+          name: '普通模板一'
+        },
+        {
+          id: 1,
+          name: '普通模板二'
+        },
+        {
+          id: 2,
+          name: '仓库模板一'
+        }
+      ],
+      // 表头
+      columns: [
+        {
+          title: '序号',
+          dataIndex: 'no',
+          align: 'center',
+          width: 100
+        },
+        {
+          title: '产品编码',
+          dataIndex: 'salerNo',
+          align: 'center'
+        },
+        {
+          title: '产品名称',
+          dataIndex: 'storeNo',
+          align: 'center'
+        },
+        {
+          title: '原厂编码',
+          dataIndex: 'custName',
+          align: 'center'
+        },
+        {
+          title: '成本价',
+          dataIndex: 'totalP',
+          align: 'center'
+        },
+        {
+          title: '售价',
+          dataIndex: 'totalNums',
+          align: 'center'
+        },
+        {
+          title: '折后售价',
+          dataIndex: 'totalPrice',
+          align: 'center'
+        },
+        {
+          title: '销售数量',
+          dataIndex: 'payType',
+          align: 'center'
+        },
+        {
+          title: '单位',
+          dataIndex: 'mementPay',
+          align: 'center'
+        },
+        {
+          title: '辅助数量',
+          dataIndex: 'shDate',
+          align: 'center'
+        },
+        {
+          title: '售价小计',
+          dataIndex: 'isJj',
+          align: 'center'
+        },
+        {
+          title: '折后小计',
+          dataIndex: 'status',
+          align: 'center'
+        },
+        {
+          title: '仓库',
+          dataIndex: 'status',
+          align: 'center'
+        },
+        {
+          title: '仓位',
+          dataIndex: 'status',
+          align: 'center'
+        },
+        {
+          title: '销售类型',
+          dataIndex: 'status',
+          align: 'center'
+        }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.disabled = true
+        // return customerBundleDelayList( 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
+        //   }
+        //   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', productOldNum: 'jgqp111123545', productBrand: '箭冠品牌', productType: '产品分类1', inventoryNum: '5', inventoryMoney: '122' }
+            ],
+            count: 10
           }
-        ],
-        pritModal:[
-          {
-            id: 0,
-            name:'普通模板一'
-          },
-          {
-            id: 1,
-            name:'普通模板二'
-          },
-          {
-            id: 2,
-            name:'仓库模板一'
+          const no = (data.pageNo - 1) * data.pageSize
+          for (var i = 0; i < data.list.length; i++) {
+            data.list[i].no = no + i + 1
           }
-        ],
-        // 表头
-        columns: [
-          {
-            title: '序号',
-            dataIndex: 'no',
-            align: 'center',
-            width: 100
-          },
-          {
-            title: '产品编码',
-            dataIndex: 'salerNo',
-            align: 'center'
-          },
-          {
-            title: '产品名称',
-            dataIndex: 'storeNo',
-            align: 'center'
-          },
-          {
-            title: '原厂编码',
-            dataIndex: 'custName',
-            align: 'center'
-          },
-          {
-            title: '成本价',
-            dataIndex: 'totalP',
-            align: 'center'
-          },
-          {
-            title: '售价',
-            dataIndex: 'totalNums',
-            align: 'center'
-          },
-          {
-            title: '折后售价',
-            dataIndex: 'totalPrice',
-            align: 'center'
-          },
-          {
-            title: '销售数量',
-            dataIndex: 'payType',
-            align: 'center'
-          },
-          {
-            title: '单位',
-            dataIndex: 'mementPay',
-            align: 'center'
-          },
-          {
-            title: '辅助数量',
-            dataIndex: 'shDate',
-            align: 'center'
-          },
-          {
-            title: '售价小计',
-            dataIndex: 'isJj',
-            align: 'center'
-          },
-          {
-            title: '折后小计',
-            dataIndex: 'status',
-            align: 'center'
-          },
-          {
-            title: '仓库',
-            dataIndex: 'status',
-            align: 'center'
-          },
-          {
-            title: '仓位',
-            dataIndex: 'status',
-            align: 'center'
-          },
-          {
-            title: '销售类型',
-            dataIndex: 'status',
-            align: 'center'
-          },
-        ],
-        // 加载数据方法 必须为 Promise 对象
-        loadData: parameter => {
-          this.disabled = true
-          // return customerBundleDelayList( 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
-          //   }
-          //   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', productOldNum: 'jgqp111123545', productBrand: '箭冠品牌', productType: '产品分类1', inventoryNum: '5', inventoryMoney: '122' }
-              ],
-              count: 10
-            }
-            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)
-          })
-        },
+          _this.disabled = false
+          resolve(data)
+        })
       }
     }
   }
+}
 </script>
 
 <style lang="less">