<template>
|
<div class="app-container stock-container">
|
<el-container>
|
<el-card class="box-card" style="width: 100%" shadow="never">
|
<!--搜索条件-->
|
<div class="filter-container">
|
<my-search ref="searchBar" :items="items" @search="fifterForm"></my-search>
|
</div>
|
<el-row style="margin-top: 15px">
|
<el-col>
|
<!--列表-->
|
<div class="table-tool-bar" style="margin-bottom: 15px;">
|
<my-button name="新增" @click="handleAdd" site="tools" size="medium" />
|
</div>
|
<div :style="{ 'overflow-y': 'auto', height: `${clientHeight - 320}px` }" v-loading="loading">
|
<el-row v-if="list.length" class="card" :gutter="5">
|
<el-col v-for="(item, index) in list" :key="index" class="cm-item">
|
<el-card class="card-data">
|
<div class="card-container">
|
<div class="card-header">
|
<div class="card-header-left">
|
<span>出库单号：</span>
|
<span class="value">{{ item.businessFormCode }}</span>
|
</div>
|
<div class="card-header-right">
|
<el-button site="form" type="success" size="mini" @click="handleExport(item)"
|
>导出出库单</el-button
|
>
|
<el-button name="查看详情" site="form" type="info" size="mini" @click="handleDetail(item)"
|
>查看详情</el-button
|
>
|
</div>
|
</div>
|
<div class="one-hed">
|
<div class="box"><span class="span-two">机构：</span>{{ item.agencyName }}</div>
|
<div class="box"><span class="span-two">操作人：</span>{{ item.operatorName }}</div>
|
<div class="box">
|
<span class="span-two">出库时间：</span>{{ item.dealTime | formatTime }}
|
</div>
|
</div>
|
<div class="card-end">
|
<div v-for="(just, index) in item.formOutputTemplateInfoList" :key="index" class="item">
|
<div class="name">{{ just.goodsName }}</div>
|
<div class="value-box">
|
<div class="value-box-item">
|
<span class="label">数量：</span>
|
<span class="value">{{ just.count }}</span>
|
<span class="unit">{{ just.unit }}</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</el-card>
|
</el-col>
|
</el-row>
|
<div class="no-data" v-else>暂无数据</div>
|
</div>
|
<el-pagination
|
:small="false"
|
:current-page="pageNum"
|
:page-sizes="[5, 10, 20, 50, 100, 200, 300, 400, 500]"
|
:page-size="pageSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="total"
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
/>
|
</el-col>
|
</el-row>
|
</el-card>
|
</el-container>
|
<!--添加/编辑弹窗-->
|
<edit v-if="editSetting.show" :setting="editSetting" ref="editRef" @close="editSetting.show=false" @search="refreshData"></edit>
|
<detail v-if="detailSetting.show" :setting="detailSetting" @close="detailSetting.show=false" ref="detailRef"></detail>
|
</div>
|
</template>
|
|
<script>
|
import { outputList } from '@/api/stock/accessStock';
|
import MyButton from '@/components/myButton/myButton';
|
import myImport from '@/views/components/myImport';
|
import edit from './edit';
|
import detail from './detail';
|
import listPage from '../../../mixins/listPage'
|
|
export default {
|
name: 'index',
|
mixins: [listPage],
|
components: { MyButton, myImport, edit, detail },
|
data() {
|
return {
|
list: [],
|
// 搜索框
|
items: [
|
{
|
type: 'text',
|
dataIndex: 'businessFormCode',
|
label: '出库单号',
|
placeholder: '请输入',
|
defaultValue: '',
|
},
|
{
|
type: 'text',
|
dataIndex: 'goodsName',
|
label: '物品名称',
|
placeholder: '可模糊搜索',
|
defaultValue: '',
|
},
|
{
|
type: 'cascader',
|
dataIndex: 'agencyId',
|
label: '机构',
|
placeholder: '请选择',
|
optionsConfig: { url: '/pc/fin/sys/tenant/select/tree_fin_tenant', props: null },
|
defaultValue: '',
|
options: [],
|
},
|
{
|
type: 'text',
|
dataIndex: 'createName',
|
label: '创建人',
|
placeholder: '请输入',
|
defaultValue: '',
|
},
|
{
|
type: 'date-picker',
|
dataIndex: 'startTime',
|
label: '出库时间',
|
defaultValue: '',
|
},
|
{
|
type: 'date-picker',
|
dataIndex: 'endTime',
|
label: '至',
|
defaultValue: '',
|
},
|
],
|
};
|
},
|
methods: {
|
fetchData() {
|
this.loading = true;
|
outputList({
|
pageNum: this.pageNum,
|
pageSize: this.pageSize,
|
...this.filterFrom,
|
}).then((res) => {
|
this.list = res.datas;
|
this.total = res.totalRows;
|
this.loading = false;
|
});
|
},
|
fifterForm(params) {
|
this.filterFrom = Object.assign(this.filterFrom, params);
|
if (this.filterFrom.startTime) {
|
this.filterFrom.startTime = this.filterFrom.startTime.replace(/\-/g, '');
|
}
|
if (this.filterFrom.endTime) {
|
this.filterFrom.endTime = this.filterFrom.endTime.replace(/\-/g, '');
|
}
|
if (this.filterFrom.agencyId&&this.filterFrom.agencyId.length) {
|
this.filterFrom.agencyId = this.filterFrom.agencyId[this.filterFrom.agencyId.length - 1];
|
}
|
this.search(1);
|
},
|
},
|
};
|
</script>
|
|
<style scoped lang="scss">
|
@import url(../../index.scss);
|
</style>
|
