jonhon-mes-web/src/views/basicData/warehouseMaintenance.vue

<template>
    <basic-container>
        <el-tabs v-model="tabPosition" class="demo-tabs" @tab-change="tabPositionChange">
            <el-tab-pane label="库房设置" name="warehouseSetup"></el-tab-pane>
            <el-tab-pane label="库管设置" name="inventorySetup"></el-tab-pane>
            <el-tab-pane label="库位设置" name="storageSetup"></el-tab-pane>
        </el-tabs>
        <avue-crud v-if="tabPosition != 'inventorySetup'" :option="option" :table-loading="loading" :data="data"
            v-model="form" v-model:page="page" ref="crud" @row-del="rowDel" @search-change="searchChange"
            @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
            @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad">
            <template #menu="{ row }">
                <el-button type="text" v-if="tabPosition == 'warehouseSetup'">管理员设置</el-button>
            </template>
        </avue-crud>
        <div v-if="tabPosition == 'inventorySetup'" class="setup-height">
            <div style="margin-bottom: 10px;">
                <el-button type="primary" @click="selectFn(1)">按人员设置</el-button>
                <el-button type="primary" @click="selectFn(2)">按库房设置</el-button>
            </div>
             <el-select v-model="value" placeholder="请选择人员" v-if="isUser==1">
                <el-option label="人员一" value="1">
                </el-option>
                <el-option label="人员二" value="2">
                </el-option>
            </el-select>
            <el-select v-model="value" placeholder="请选择库房" v-if="isUser==2">
                <el-option label="库房一" value="1">
                </el-option>
                <el-option label="库房二" value="2">
                </el-option>
            </el-select>
            <el-transfer style="margin-top: 10px;height: 580px;" filterable :titles="['未选择', '已选择']"
                :filter-method="filterMethod" filter-placeholder="请输入城市拼音" v-model="value" :data="transferData">
            </el-transfer>
            <div style="margin-top: 10px;display: flex;justify-content: center;align-items: center;">
                <el-button type="primary">保 存</el-button>
            </div>
        </div>
    </basic-container>
</template>
<script>
import warehouseMain from './js/warehouseMain'
export default {
    data() {
        return {
            loading: false,
            tabPosition: 'warehouseSetup',
            data: [],
            form: {},
            page: {
                pageSize: 10,
                currentPage: 1,
                total: 0,
            },
            option: {
                columnSort: true,
                tip: false,
                height: 'auto',
                align: 'center',
                calcHeight: 32,
                simplePage: false,
                searchShow: true,
                searchMenuSpan: 6,
                searchIcon: true,
                searchIndex: 3,
                tree: false,
                border: true,
                index: true,
                selection: true,
                viewBtn: false,
                addBtn: true,
                delBtn: true,
                editBtn: true,
                editBtnIcon: ' ',
                delBtnIcon: ' ',
                labelWidth: 120,
                menu: true,
                menuWidth: 200,
                dialogWidth: 920,
                dialogClickModal: false,
                searchEnter: true,
                excelBtn: true,
                gridBtn: false,
                searchShowBtn: false,
                showOverflowTooltip: true,
                searchLabelPosition: 'left',
                searchLabelPosition: 'left',
                searchGutter: 24,
                searchSpan: 6,
                menuAlign: 'left',
                gridBtn: false,
                searchMenuPosition: 'right',
                addBtnIcon: ' ',
                viewBtnIcon: ' ',
                delBtnIcon: ' ',
                editBtnIcon: ' ',
                column: []
            },
            isUser:1,
        }
    },
    mounted() {
        this.option.delBtn = true
        this.option.editBtn = true
        this.option.column = warehouseMain[this.tabPosition]
    },
    methods: {
        selectFn(val){
            this.isUser = val
        },
        tabPositionChange(val) {
            this.option.delBtn = false
            this.option.editBtn = false
            if (this.tabPosition == 'warehouseSetup') {
                this.option.delBtn = true
                this.option.editBtn = true
                this.option.column = warehouseMain[this.tabPosition]
            } else if (this.tabPosition == 'storageSetup') {
                this.option.delBtn = true
                this.option.editBtn = true
                this.option.column = warehouseMain[this.tabPosition]
            }
        },
        rowDel() {
            this.$confirm('确定删除此条数据?', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning',
            }).then(() => {

            })
        },
        onLoad() {
            this.data = [
                { id: 1, shCode: '001', shName: '名称一', memo: '', toolingTypeStr: '001', typeStr: '', shLevel: '', userName: "" },
                { id: 1, shCode: '001', shName: '名称一', memo: '', toolingTypeStr: '001', typeStr: '', shLevel: '', userName: "" },
                { id: 1, shCode: '001', shName: '名称一', memo: '', toolingTypeStr: '001', typeStr: '', shLevel: '', userName: "" },
            ]
            this.page.total = this.data.length
        },
    }
}
</script>
<style lang="scss" scoped>
::v-deep.el-transfer {
    .el-transfer-panel {
        width: 44% !important;
    }
}

.setup-height {
    height: calc(100vh - 54px - 40px - 40px - 56px - 35px);
}
</style>