Blame view

ant-design-vue-jeecg/src/views/system/stocktaking/CycleCountHeaderList.vue 11.2 KB
1
2
3
4
5
6
<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
7
8
9
10
11
12
13
14
15
16
17
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="盘点单编码">
              <a-input placeholder="请输入盘点单编码" v-model="queryParam.code"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <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>
18
19
20
21
22
23
        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->
    <!-- 操作按钮区域 -->
    <div class="table-operator">
易文鹏 authored
24
      <a-button v-has="'cycleCountHeader:add'" @click="handleAdd" type="primary" icon="plus">新增</a-button>
25
26
      <a-button v-has="'cycleCountHeader:export'" type="primary" icon="download" @click="handleExportXls('盘点主表')">导出</a-button>
      <a-upload v-has="'cycleCountHeader:import'" name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader" :action="importExcelUrl" @change="handleImportExcel">
27
28
29
30
        <a-button type="primary" icon="import">导入</a-button>
      </a-upload>
      <a-dropdown v-if="selectedRowKeys.length > 0">
        <a-menu slot="overlay">
31
          <a-menu-item key="1" @click="batchDel">
32
            <a-icon type="delete"/> 删除
33
          </a-menu-item>
34
        </a-menu>
35
36
37
        <a-button style="margin-left: 8px"> 批量操作
          <a-icon type="down"/>
        </a-button>
38
39
40
41
42
      </a-dropdown>
    </div>
    <!-- table区域-begin -->
    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px;">
43
44
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择
        <a style="font-weight: 600">{{ selectedRowKeys.length }}</a> 项
45
46
47
48
49
50
51
52
53
54
55
56
57
58
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>
      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
        class="j-table-force-nowrap"
        @change="handleTableChange">
李泰瑜 authored
59
60
61
        <!-- 内嵌table区域 begin -->
        <template slot="expandedRowRender" slot-scope="record">
          <a-tabs tabPosition="top">
62
63
            <a-tab-pane tab="盘点明细" key="cycleCountDetailId" forceRender>
              <cycle-count-detail-list :record="record" :isLoad="true"/>
李泰瑜 authored
64
65
66
67
            </a-tab-pane>
          </a-tabs>
        </template>
        <!-- 内嵌table区域 end -->
68
69
70
71
72
73
74
        <span slot="companyCode" slot-scope="companyCode">
          <a-tag :key="companyCode" color=blue>
            {{ solutionCompany(companyCode) }}
          </a-tag>
        </span>

        <span slot="countType" slot-scope="countType">
75
          <a-tag :key="countType" :color="getCountTypeColor(countType)">
76
77
78
79
            {{ solutionCountType(countType) }}
          </a-tag>
        </span>
80
81
82
83
84
85
        <span slot="statusCyc_dictText" slot-scope="statusCyc_dictText">
            <a-tag :key="statusCyc_dictText" :color="getStatusColor(statusCyc_dictText)">
              {{ statusCyc_dictText }}
            </a-tag>
        </span>
86
        <span slot="action" slot-scope="text, record">
87
88
          <a v-if="record.statusCyc === 1" @click="cycleCountDetailAdd(record)">新增</a>
          <a-divider type="vertical" v-if="record.statusCyc !== 100"/>
89
          <a-dropdown>
90
            <a class="ant-dropdown-link">更多 <a-icon type="down"/></a>
91
            <a-menu slot="overlay">
谭毅彬 authored
92
              <a-menu-item v-has="'cycleCountHeader:edit'">
93
                <a v-if="record.statusCyc === 1" @click="handleEdit(record)">编辑</a>
94
95
              </a-menu-item>
              <a-menu-item>
96
97
                <a @click="handleDetail(record)">详情</a>
              </a-menu-item>
98
              <a-menu-item v-if="record.statusCyc === 1" v-has="'cycleCountHeader:delete'">
谭毅彬 authored
99
                <a-popconfirm title="确定删除吗?" @confirm="() => handleDelete(record.id)">
100
101
102
103
104
105
                  <a>删除</a>
                </a-popconfirm>
              </a-menu-item>
            </a-menu>
          </a-dropdown>
        </span>
106
107
108
109
      </a-table>
    </div>
    <cycle-count-header-modal ref="modalForm" @ok="modalFormOk"></cycle-count-header-modal>
110
    <cycle-count-detail-modal ref="detailModalForm" @ok="detailModalFormOk"/>
111
112
113
114
115
  </a-card>
</template>

<script>
116
117
118
import '@/assets/less/TableExpand.less'
import {mixinDevice} from '@/utils/mixin'
import {JeecgListMixin} from '@/mixins/JeecgListMixin'
119
import {getCompanyList, getCountTypeList} from '@/api/api'
120
121
import CycleCountHeaderModal from './modules/CycleCountHeaderModal'
import CycleCountDetailList from "./CycleCountDetailList";
122
123
import Utils from "@/components/jeecgbiz/JButtonBizComponent/util.js"
import CycleCountDetailModal from "./modules/CycleCountDetailModal";
124
125
126
127
128
export default {
  name: 'CycleCountHeaderList',
  mixins: [JeecgListMixin, mixinDevice],
  components: {
129
    CycleCountDetailModal,
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
    CycleCountHeaderModal,
    CycleCountDetailList,
  },
  data() {
    return {
      // 选择用户查询条件配置
      selectUserQueryConfig: [
        {key: 'locationCode', label: '库位'},
      ],
      description: '盘点主表管理页面',
      companyList: [],
      CountTypeList: [],
      // 表头
      columns: [
        {
          title: 'ID',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: "center",
          customRender: function (t, r, index) {
            return parseInt(index) + 1;
152
153
          }
        },
154
155
156
157
        {
          title: '盘点单编码',
          align: "center",
          dataIndex: 'code'
158
        },
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
        {
          title: '货主编码',
          align: "center",
          dataIndex: 'companyCode',
          key: 'companyCode',
          scopedSlots: {customRender: 'companyCode'}
        },
        {
          title: '总货位数',
          align: "center",
          dataIndex: 'totalLocs'
        },
        {
          title: '总物料数',
          align: "center",
          dataIndex: 'totalItems'
        },
        {
          title: '盘点类型',
          align: "center",
          dataIndex: 'countType',
          key: 'countType',
          scopedSlots: {customRender: 'countType'}
        },
        {
          title: '盘点主单状态',
          align: "center",
186
187
          dataIndex: 'statusCyc_dictText',
          scopedSlots: {customRender: 'statusCyc_dictText'}
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
        },
        {
          title: '指定盘点人员',
          align: "center",
          dataIndex: 'stocktakingAs'
        },
        {
          title: '实际盘点人员',
          align: "center",
          dataIndex: 'stocktakingAc'
        },
        {
          title: '是否有效',
          align: "center",
          dataIndex: 'enable_dictText'
        },
        {
          title: '备注',
          align: "center",
          dataIndex: 'remark'
        },
        {
          title: '操作',
          dataIndex: 'action',
          align: "center",
          // fixed:"right",
          width: 147,
          scopedSlots: {customRender: 'action'}
        }
      ],
      url: {
        list: "/cycleCountHeader/cycleCountHeader/list",
        delete: "/cycleCountHeader/cycleCountHeader/delete",
        deleteBatch: "/cycleCountHeader/cycleCountHeader/deleteBatch",
        exportXlsUrl: "/cycleCountHeader/cycleCountHeader/exportXls",
        importExcelUrl: "cycleCountHeader/cycleCountHeader/importExcel",
      },
      dictOptions: {
        status: [],
      },
      superFieldList: [],
    }
  },
  created() {
232
233
    this.getSuperFieldList();
    this.loadFrom();
234
  },
235
236
237
238
239
240
  mounted() {
    let that = this;
    Utils.$on('refreshCycleCountHeader', () => {
      that.loadData()
    })
  },
241
242
243
  computed: {
    importExcelUrl: function () {
      return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
244
    },
245
246
247
248
249
250
251
252
253
  },
  methods: {
    initDictConfig() {
    },
    getSuperFieldList() {
      let fieldList = [];
      fieldList.push({type: 'string', value: 'code', text: '盘点主表编号', dictCode: ''})
      fieldList.push({type: 'string', value: 'companyCode', text: '货主编码', dictCode: ''})
      fieldList.push({type: 'string', value: 'countType', text: '盘点类型', dictCode: ''})
254
      fieldList.push({type: 'int', value: 'statusCyc', text: '盘点状态', dictCode: 'cycleCount_status'})
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
      fieldList.push({type: 'string', value: 'remark', text: '备注', dictCode: ''})
      fieldList.push({type: 'int', value: 'totalLocs', text: '总货位数', dictCode: ''})
      fieldList.push({type: 'int', value: 'totalItems', text: '总物料数', dictCode: ''})
      fieldList.push({type: 'string', value: 'stocktakingAs', text: '指定盘点人员', dictCode: ''})
      fieldList.push({type: 'string', value: 'stocktakingAc', text: '实际盘点人员', dictCode: ''})
      fieldList.push({type: 'int', value: 'enable', text: '是否有效', dictCode: 'valid_status'})
      fieldList.push({type: 'datetime', value: 'uploadTime', text: '回传时间'})
      fieldList.push({type: 'int', value: 'uploadStatus', text: '回传状态', dictCode: 'valid_status'})
      fieldList.push({type: 'string', value: 'closedBy', text: '关闭人', dictCode: ''})
      this.superFieldList = fieldList
    },
    loadFrom() {
      getCompanyList().then((res) => {
        if (res.success) {
          this.companyList = res.result
        }
      });
      getCountTypeList().then((res) => {
        if (res.success) {
          this.CountTypeList = res.result
        }
      });
277
    },
278
    solutionCompany(value) {
279
      let actions = []
280
      Object.keys(this.companyList).some((key) => {
281
        if (this.companyList[key].code === ('' + value)) {
282
283
284
285
286
287
288
          actions.push(this.companyList[key].name)
          return true
        }
      })
      return actions.join('')
    },
    solutionCountType(value) {
289
      let actions = []
290
      Object.keys(this.CountTypeList).some((key) => {
291
        if (this.CountTypeList[key].code === ('' + value)) {
292
293
294
295
296
297
          actions.push(this.CountTypeList[key].name)
          return true
        }
      })
      return actions.join('')
    },
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
    cycleCountDetailAdd(record){
      this.$refs.detailModalForm.title = "库存";
      this.$refs.detailModalForm.cycleCountHeader = record;
      this.$refs.detailModalForm.visible = true;
    },
    detailModalFormOk(){
        this.loadData();
    },
    getStatusColor(status) {
      const colors = {
        '新建': 'green',
        '已登记': 'orange',
        '盘点完成': 'grey',
        default: 'blue'
      };
      return colors[status] || colors.default;
    },
    getCountTypeColor(countType) {
      const colors = {
        '01': 'cyan',
        '02': 'purple',
        '明盘': 'cyan',
        '暗盘': 'purple',
        default: 'blue'
      };
      return colors[countType] || colors.default;
    }
325
  }
326
}
327
328
</script>
<style scoped>
329
@import '~@assets/less/common.less';
330
</style>