feat(cms): 优化刀具入库和库存列表功能

lixiangyu

3 天以前 e4e75a7312f5195144b105d59ac90f26e174d4ba

feat(cms): 优化刀具入库和库存列表功能

- 修改入库按钮文本为"新刀入库"
- 优化刀具入库表单布局和样式
- 完善刀具库存列表查询功能- 调整刀具库存列表显示格式，增加总数列

 src/views/cms/CuttingInboundList.vue

@@ -68,7 +68,7 @@

    <!-- 操作按钮区域 -->
    <div class="table-operator">
      <a-button @click="handleAdd" type="primary" icon="plus">新增</a-button>
      <a-button @click="handleAdd" type="primary" icon="plus">新刀入库</a-button>
      <a-button type="primary" icon="download" @click="handleExportXls('刀具入库单')">导出</a-button>
      <a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
        <a-button type="primary" icon="import">导入</a-button>

 src/views/cms/CuttingInventoryList.vue

@@ -2,41 +2,41 @@
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
<!--      <a-form layout="inline" @keyup.enter.native="searchQuery">-->
<!--        <a-row :gutter="24">-->
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
<!--          <a-col :md="6" :sm="8">-->
<!--            <a-form-item label="刀具编码">-->
<!--              <a-input placeholder="请输入刀具编码" v-model="queryParam.cuttingId" />-->
<!--            </a-form-item>-->
<!--          </a-col>-->
<!--          <a-col :md="6" :sm="8">-->
<!--              <a-form-item label="刀具条码">-->
<!--                <a-input placeholder="请输入刀具条码" v-model="queryParam.cuttingBarcode" />-->
<!--              </a-form-item>-->
<!--            </a-col>-->
<!--            <a-col-->
<!--            :md="6"-->
<!--            :sm="8"-->
<!--          >-->
<!--            <span-->
<!--              style="float: left;overflow: hidden;"-->
<!--              class="table-page-search-submitButtons"-->
<!--            >-->
<!--              <a-button-->
<!--                type="primary"-->
<!--                @click="searchQuery"-->
<!--                icon="search"-->
<!--              >查询</a-button>-->
<!--              <a-button-->
<!--                type="primary"-->
<!--                @click="searchReset"-->
<!--                icon="reload"-->
<!--                style="margin-left: 8px"-->
<!--              >重置</a-button>-->
<!--            </span>-->
<!--          </a-col>-->
<!--        </a-row>-->
<!--      </a-form>-->
          <a-col :md="6" :sm="8">
              <a-form-item label="刀具条码">
                <a-input placeholder="请输入刀具条码" v-model="queryParam.cuttingBarcode" />
              </a-form-item>
            </a-col>
            <a-col
            :md="6"
            :sm="8"
          >
            <span
              style="float: left;overflow: hidden;"
              class="table-page-search-submitButtons"
            >
              <a-button
                type="primary"
                @click="searchQuery"
                icon="search"
              >查询</a-button>
              <a-button
                type="primary"
                @click="searchReset"
                icon="reload"
                style="margin-left: 8px"
              >重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

@@ -220,9 +220,27 @@
            align: "center",
          },
          {
            title: '数量',
            title: '总数',
            dataIndex: 'cuttingIdNumber',
            align: "center"
            align: "center",
            customRender: (text, record, index) => {
              const obj = {
                children: text,
                attrs: {}
              };
              // 只在第一行显示总数量，其他行显示空
              if (record.rowSpan !== undefined && record.rowSpan > 0) {
                obj.children = text;
                obj.attrs.rowSpan = record.rowSpan;
              } else if (record.rowSpan === 0) {
                obj.children = '';
                obj.attrs.rowSpan = 0;
              } else {
                obj.children = text;
                obj.attrs.rowSpan = 1;
              }
              return obj;
            }
          }
        ],
        url: {
@@ -475,7 +493,8 @@
        }

        return result;
      }
      },

    }
  }
</script>

 src/views/cms/modules/CuttingInboundModal.vue

@@ -3,7 +3,7 @@
    <a-spin :spinning="confirmLoading">
      <a-form :form="form">
        <a-row style="width: 100%">
           <a-col :span="24 / 2">
          <a-col :span="24 / 2">
            <a-form-item label="入库人" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <j-search-select-tag
                :disabled="disableSubmit"
@@ -26,12 +26,13 @@
        <a-row style="width: 100%">
          <a-col :span="24">
            <a-form-item label="入库说明" :labelCol="{span:3}" :wrapperCol="{span:21}">
              <a-textarea :disabled="disableSubmit" placeholder="请输入入库说明" v-decorator="['receiveComment', validatorRules.receiveComment]" />
              <a-textarea :disabled="disableSubmit" placeholder="请输入入库说明"
                          v-decorator="['receiveComment', validatorRules.receiveComment]" />
            </a-form-item>
          </a-col>
        </a-row>
        <a-row style="width: 100%">
           <a-col :span="24 / 2">
          <a-col :span="24 / 2">
            <a-form-item label="确认人" :labelCol="labelCol" :wrapperCol="wrapperCol">
              <j-search-select-tag
                :disabled="disableSubmit"
@@ -54,7 +55,8 @@
        <a-row style="width: 100%">
          <a-col :span="24">
            <a-form-item label="确认意见" :labelCol="{span:3}" :wrapperCol="{span:21}">
              <a-textarea :disabled="disableSubmit" placeholder="请输入确认意见" v-decorator="['confirmComment', validatorRules.confirmComment]" />
              <a-textarea :disabled="disableSubmit" placeholder="请输入确认意见"
                          v-decorator="['confirmComment', validatorRules.confirmComment]" />
            </a-form-item>
          </a-col>
        </a-row>
@@ -103,27 +105,28 @@

<script>

  import pick from 'lodash.pick'
  import JSelectToolingModal from './JSelectToolingModal'
  import moment from 'moment'
  import { getAction, postAction, requestPut } from '@/api/manage'
  import JDictSelectTag from '@/components/dict/JDictSelectTag'
  import JSearchSelectTag from '@/components/dict/JSearchSelectTag'
  import JMultiSelectTag from '@/components/dict/JMultiSelectTag'
  import { filterObj } from '@/utils/util'
  import store from '@/store/'
  export default {
    name: 'CuttingInboundModal',
    components: {
import pick from 'lodash.pick'
import JSelectToolingModal from './JSelectToolingModal'
import moment from 'moment'
import { getAction, postAction, requestPut } from '@/api/manage'
import JDictSelectTag from '@/components/dict/JDictSelectTag'
import JSearchSelectTag from '@/components/dict/JSearchSelectTag'
import JMultiSelectTag from '@/components/dict/JMultiSelectTag'
import { filterObj } from '@/utils/util'
import store from '@/store/'

export default {
  name: 'CuttingInboundModal',
  components: {
    JSelectToolingModal,
    JMultiSelectTag,
    JDictSelectTag,
    store,
    moment,
    moment
  },
    data () {
      return {
         /* 分页参数 */
  data() {
    return {
      /* 分页参数 */
      ipagination: {
        current: 1,
        pageSize: 10,
@@ -133,27 +136,26 @@
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0,
        total: 0
      },
      title:'新增',
         visible: false,
         selectedRowKeys: {},
      title: '新增',
      visible: false,
      selectedRowKeys: {},
      model: {},
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 },
        sm: { span: 6 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 18 },
        sm: { span: 18 }
      },
      confirmLoading: false,
      loading: false,
      form: this.$form.createForm(this),
      dataSource: [],
      param: {},
      validatorRules: {
      },
      validatorRules: {},
      columns: [
        {
          title: '#',
@@ -161,52 +163,52 @@
          key: 'rowIndex',
          width: 50,
          align: 'center',
          customRender: function (t, r, index) {
          customRender: function(t, r, index) {
            return parseInt(index) + 1
          },
          }
        },
        {
          title: '刀具编码',
          align: 'center',
          dataIndex: 'cuttingCode',
          width: 150,
          width: 150
        },
        {
          title: '刀具名称',
          align: 'center',
          dataIndex: 'cuttingName',
          dataIndex: 'cuttingName'
        },
        {
          title: '入库数量',
          align: 'center',
          dataIndex: 'receiveNumber',
          scopedSlots: { customRender: 'receiveNumber' },
          scopedSlots: { customRender: 'receiveNumber' }
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: 'center',
          scopedSlots: { customRender: 'action' },
        },
          scopedSlots: { customRender: 'action' }
        }
      ],
      url: {
        add: '/cms/cuttingInbound/add',
        detailList: '/cms/cuttingInbound/detailList',
        detailList: '/cms/cuttingInbound/detailList'
      },
      orderId:'',
      disableSubmit:false
      }
    },
    methods: {
      modalFormOk(){
      orderId: '',
      disableSubmit: false
    }
  },
  methods: {
    modalFormOk() {

      },
       getQueryParams() {
    },
    getQueryParams() {
      this.param.pageNo = this.ipagination.current
      this.param.pageSize = this.ipagination.pageSize
      return filterObj(this.param)
    },
      add() {
    add() {
      let receiver = store.getters.userInfo.id
      let receiveTime = moment(new Date()).format('YYYY-MM-DD HH:mm:ss')
      this.edit({ receiver: receiver, receiveTime: receiveTime })
@@ -228,7 +230,7 @@
        )
      })
    },
     handleDelete(record, index) {
    handleDelete(record, index) {
      this.dataSource.splice(index, 1)
    },
    handleChange(value, key, column, index) {
@@ -240,7 +242,7 @@
        this.dataSource = temp
      }
    },
    selectTooling: function () {
    selectTooling: function() {
      let ids = []
      for (let i = 0; i < this.dataSource.length; i++) {
        ids.push(this.dataSource[i].cuttingId)
@@ -266,7 +268,7 @@
        return
      }
      // 校验入库数量是否填写
      for(let i=0; i<this.dataSource.length; i++) {
      for (let i = 0; i < this.dataSource.length; i++) {
        if (!this.dataSource[i].receiveNumber || this.dataSource[i].receiveNumber <= 0) {
          this.$message.error(`必须填写入库数量`)
          return
@@ -303,9 +305,9 @@
      this.dataSource = []
      this.visible = false
      this.disableSubmit = false
    },
    },
    mounted() {
    }
  },
  mounted() {
    this.$bus.$on('selectionRows', (data) => {
      //getCurrSelected 事件 接收组件传递的参数
      for (let i = 0; i < data.length; i++) {
@@ -316,6 +318,6 @@
        })
      }
    })
  },
  }
}
</script>