Smart_platform_ui/src/views/purchasingManagement/inStock/index.vue

<template>
    <div>
        <basic-container v-show="show" class="page-crad">
            <avue-crud ref="crud" :option="option" :data="dataList" v-model="form" :page.sync="page"
                :search.sync="search" @search-change="searchChange" @current-change="currentChange"
                @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad" :table-loading="loading"
                @saveColumn="saveColumn" @resetColumn="resetColumn" :cell-style="cellStyle"
                @selection-change="selectionChange" @search-criteria-switch="searchCriteriaSwitch">
                <template slot="menuLeft">
                    <el-button type="primary" icon="el-icon-plus" size="small" @click.stop="newAdd()">创建单据
                    </el-button>
                </template>
                <template slot-scope="{ row,index}" slot="menu">
                    <el-button type="text" icon="el-icon-plus" size="small" :disabled="row.status!=3"
                        @click.stop="generate(row, index)">生成出库单
                    </el-button>
                    <el-button type="text" icon="el-icon-delete" size="small" :disabled="row.status>0"
                        @click.stop="rowDel(row, index)">删除
                    </el-button>
                </template>
                <template slot="stockTimeSearch">
                    <el-date-picker v-model="search.stockTime" type="daterange" start-placeholder="开始日期"
                        end-placeholder="结束日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd">
                    </el-date-picker>
                </template>
                <template slot="purchaserIdSearch">
                    <crop-select v-model="search.purchaserId" corpType="KH" :refresh="false"></crop-select>
                </template>
                <template slot="corpIdSearch">
                    <crop-select v-model="search.corpId" corpType="GYS" :refresh="false"></crop-select>
                </template>
                <template slot-scope="{ row,index}" slot="purchaserId">
                    <span style="color: #409EFF;cursor: pointer" @click.stop="editOpen(row, 1)">{{ row.purchaser }}
                    </span>
                </template>
                <template slot-scope="{ row,index}" slot="corpId">
                    <span>{{ row.corpName }}
                    </span>
                </template>
            </avue-crud>
        </basic-container>
        <detail-page @goBack="goBack" :detailData="detailData" v-if="!show"></detail-page>
    </div>
</template>

<script>
import { getList, remove, getStoragetree } from "@/api/purchasingManagement/inStock";
import option from "./config/mainList.json";
import detailPage from "./detailsPage";
import _ from "lodash";
export default {
    name: "instock",
    data() {
        return {
            search: {},
            form: {},
            option: {},
            dataList: [],
            page: {
                pageSize: 20,
                currentPage: 1,
                total: 0,
                pageSizes: [10, 20, 30, 40, 50, 100, 200, 300, 400, 500]
            },
            show: true,
            detailData: {},
            loading: false,
            searchShow: true,
            selectionList: [],
        };
    },
    components: { detailPage },
    async created() {
        this.option = await this.getColumnData(this.getColumnName(188), option);
        this.option.height = window.innerHeight - 210;
        this.getWorkDicts("approval_status").then(res => {
            this.findObject(this.option.column, "status").dicData =
                res.data.data;
        });
        this.getWorkDicts("CMY_business_type").then(res => {
            this.findObject(this.option.column, "businessType").dicData =
                res.data.data;
        });
        getStoragetree().then(res => {
            this.findObject(this.option.column, "storageId").dicData =
                res.data.data;
        })
    },
    methods: {
        searchCriteriaSwitch(type) {
            if (type) {
                this.option.height = this.option.height - 191;
            } else {
                this.option.height = this.option.height + 191;
            }
            this.$refs.crud.getTableHeight();
        },
        cellStyle() {
            return "padding:0;height:40px;";
        },
        rowDel(row, index, done) {
            this.$confirm("确定删除数据?", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning"
            }).then(() => {
                remove({ id: row.id }).then(res => {
                    this.$message({
                        type: "success",
                        message: "删除成功!"
                    });
                })
                    .finally(() => {
                        this.onLoad(this.page, this.search);
                    });

            });
        },
        selectionChange(list) {
            this.selectionList = list;
        },
        editOpen(row, status) {
            this.detailData = {
                id: row.id,
                status: status
            };
            this.show = false;
        },
        //点击搜索按钮触发
        searchChange(params, done) {
            this.page.currentPage = 1;
            this.onLoad(this.page, params);
            done();
        },
        currentChange(val) {
            this.page.currentPage = val;
        },
        sizeChange(val) {
            this.page.currentPage = 1;
            this.page.pageSize = val;
        },
        onLoad(page, params) {
            if (this.search.stockTime && this.search.stockTime.length > 0) {
                params = {
                    ...params,
                    createStartTime: this.search.stockTime[0]+' '+"00:00:00",
                    createEndTime: this.search.stockTime[1]+' '+"23:59:59"
                };
            }
            let data = this.deepClone(Object.assign({}, params, this.search));
            delete data.stockTime;
            data.billType = "RK"
            this.loading = true;
            getList(page.currentPage, page.pageSize, data)
                .then(res => {
                    this.dataList = res.data.data.records ? res.data.data.records : [];
                    this.page.total = res.data.data.total;
                })
                .finally(() => {
                    this.loading = false;
                });
        },
        refreshChange() {
            this.onLoad(this.page, this.search);
        },
        newAdd() {
            this.show = false;
        },
        generate(row) {
            this.$router.push({
                path: "/salesManagement/outStock/index",
                query: {
                    generateId: row.id
                }
            });
        },
        goBack() {
            if (this.$route.query.id) {
                this.$router.$avueRouter.closeTag(this.$route.fullPath);
                this.$router.push({
                    path: "/purchasingManagement/inStock/index"
                });
            }
            this.detailData = this.$options.data().detailData;
            this.show = true;
            this.onLoad(this.page, this.search);
        },
        async saveColumn() {
            const inSave = await this.saveColumnData(
                this.getColumnName(188),
                this.option
            );
            if (inSave) {
                this.$nextTick(() => {
                    this.$refs.crud.doLayout();
                });
                this.$message.success("保存成功");
                //关闭窗口
                this.$refs.crud.$refs.dialogColumn.columnBox = false;
            }
        },
        async resetColumn() {
            this.option = option;
            const inSave = await this.delColumnData(this.getColumnName(188), this.option);
            if (inSave) {
                this.$nextTick(() => {
                    this.$refs.crud.doLayout();
                });
                this.$message.success("重置成功");
                this.$refs.crud.$refs.dialogColumn.columnBox = false;
            }
        }
    }
};
</script>

<style scoped>
::v-deep .select-component {
    display: flex;
}

.page-crad ::v-deep .basic-container__card {
    height: 94.2vh;
}

.itemTable ::v-deep .el-table {
    width: 738px;
}
</style>