Browse Source

新建销售单

lilei 4 năm trước cách đây
mục cha
commit
2ec7c3c64e

+ 40 - 0
src/views/common/editInput.js

@@ -0,0 +1,40 @@
+const EditableCell = {
+  template: `
+      <div class="editable-cell">
+        <div class="editable-cell-input-wrapper">
+          <a-input :value="value" @change="handleChange" @pressEnter="check">
+            <a-icon
+              type="check"
+              slot="suffix"
+              :style="{color: editable?'#08c':'#666' }"
+              @click="check"
+            />
+          </a-input>
+        </div>
+      </div>
+    `,
+  props: {
+    text: String,
+  },
+  data() {
+    return {
+      value: this.text,
+      editable: false,
+    };
+  },
+  methods: {
+    handleChange(e) {
+      const value = e.target.value;
+      this.value = value;
+      this.editable = true
+    },
+    check() {
+      if(this.editable){
+        this.editable = false;
+        this.$emit('change', this.value);
+      }
+    },
+  },
+};
+
+export default EditableCell

+ 8 - 0
src/views/salesManagement/salesQuery/queryPart.vue

@@ -0,0 +1,8 @@
+<template>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>

+ 227 - 1
src/views/salesManagement/salesQuery/salesNew.vue

@@ -1,8 +1,234 @@
 <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">
+            <a-button key="2">
+              打印预览
+            </a-button>
+            <a-button key="1" type="primary">
+              快速打印
+            </a-button>
+          </template>
+        </a-page-header>
+    </a-affix>
+    
+    <a-card :bordered="false" size="small" class="pages-wrap">
+      <!-- 查询配件列表 -->
+      <queryPart></queryPart>
+    </a-card>
+    <a-card :bordered="false" size="small" class="pages-wrap">
+      <!-- alert -->
+      <a-alert style="margin-bottom: 15px;" type="info">
+        <div slot="message">
+          <span>总售价:15;</span>
+          <span>总款数:6;</span>
+          <span>总数量:3;</span>
+          <span>赠品总数量:7;</span>
+        </div>
+      </a-alert>
+      <!-- 查询条件 -->
+      <a-row :gutter="15">
+        <a-col :span="18">
+          <a-form-model layout="inline" :model="productForm" @submit="handleSearch" @submit.native.prevent>
+              <a-form-model-item label="产品编码">
+                <a-input v-model="productForm.productNo" placeholder="输入产品编码" />
+              </a-form-model-item>
+              <a-form-model-item label="产品名称">
+                <a-input v-model="productForm.productName" placeholder="输入产品名称" />
+              </a-form-model-item>
+              <a-form-model-item>
+                <a-button type="primary">
+                  查询
+                </a-button>
+                <a-button style="margin-left: 10px;">
+                  重置
+                </a-button>
+              </a-form-model-item>
+            </a-form-model>
+        </a-col>
+        <a-col :span="6">
+          <div style="float:right;overflow: hidden;">
+            <a-button id="salesNew-dru">导入明细</a-button>
+            <a-button type="primary" style="margin-left: 15px" id="salesNew-del-all">整单删除</a-button>
+          </div>
+        </a-col>
+      </a-row>
+      <!-- 已选配件列表 -->
+      <s-table
+        class="sTable"
+        ref="table"
+        size="default"
+        :rowKey="(record) => record.id"
+        :columns="columns"
+        :data="loadData"
+        :scroll="{ x: 1500, y: 300 }"
+        bordered>
+        <!-- 价格 -->
+        <template slot="price" slot-scope="text, record">
+          <editable-cell :text="text" @change="onCellChange(record.key, 'price', $event)" />
+        </template>
+        <!-- 数量 -->
+        <template slot="salesNums" slot-scope="text, record">
+          <editable-cell :text="text" @change="onCellChange(record.key, 'salesNums', $event)" />
+        </template>
+      </s-table>
+    </a-card>
+  </div>
 </template>
 
 <script>
+  import { STable, VSelect } from '@/components'
+  import queryPart from './queryPart.vue'
+  import EditableCell from '@/views/common/editInput.js'
+  export default{
+    name: 'salesDetail',
+    components: {
+      STable,
+      VSelect,
+      queryPart,
+      EditableCell
+    },
+    data(){
+      return {
+        disabled: false,
+        productForm:{
+          productNo: '',
+          productName: ''
+        },
+        // 表头
+        columns: [
+          {
+            title: '序号',
+            dataIndex: 'no',
+            align: 'center',
+            width: 100
+          },
+          {
+            title: '产品编码',
+            dataIndex: 'productNo',
+            align: 'center',
+            sorter: true
+          },
+          {
+            title: '产品名称',
+            dataIndex: 'productName',
+            align: 'center'
+          },
+          {
+            title: '原厂编码',
+            dataIndex: 'ycNo',
+            align: 'center'
+          },
+          {
+            title: '品牌',
+            dataIndex: 'brand',
+            align: 'center',
+            sorter: true
+          },
+          {
+            title: '仓库',
+            dataIndex: 'cangku',
+            align: 'center',
+            sorter: true
+          },
+          {
+            title: '仓位',
+            dataIndex: 'cangwei',
+            align: 'center'
+          },
+          {
+            title: '辅助单位',
+            dataIndex: 'cangwei',
+            align: 'center'
+          },
+          {
+            title: '售价',
+            dataIndex: 'price',
+            align: 'center',
+            scopedSlots: { customRender: 'price' },
+          },
+          {
+            title: '销售数量',
+            dataIndex: 'salseNums',
+            align: 'center',
+            scopedSlots: { customRender: 'salesNums' },
+          },
+          {
+            title: '单位',
+            dataIndex: 'mementPay',
+            align: 'center'
+          },
+          {
+            title: '售价小计',
+            dataIndex: 'isJj',
+            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)
+          })
+        },
+      }
+    },
+    methods: {
+      onCellChange(key, dataIndex, value) {
+        const dataSource = [...this.dataSource];
+        const target = dataSource.find(item => item.key === key);
+        if (target) {
+          target[dataIndex] = value;
+          this.dataSource = dataSource;
+        }
+      },
+    },
+  }
 </script>
 
-<style>
+<style lang="less">
+  .pages-wrap{
+    margin-top: 15px;
+    .sTable{
+      margin-top: 15px;
+    }
+  }
 </style>