1

lzhe

2024-05-20 e929925ce9b9d9601697aabdb7d0fcfd7dee8a3a

1

 src/views/console/basic-data/addProduct.vue

@@ -1,34 +1,51 @@
<template>
    <el-dialog :title="titleMap[mode]" v-model="visible" :width="800" destroy-on-close @closed="$emit('closed')">
        <el-form :model="addDictForm" :rules="addDictRules" :disabled="mode=='show'" ref="dialogForm" label-width="120px" label-position="center">
        <div class="plan-content-title">基础字段</div>
        <el-form :model="addDictForm" :rules="addDictRules" :disabled="mode=='show'" ref="dialogForm" label-width="80px" label-position="center">
            <el-row>
                <el-col :span="8">
                    <el-form-item label="上级产品">
                        <el-input v-model="addDictForm.code" placeholder="上级产品" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="产品编号">
                        <el-input v-model="addDictForm.dictValue" placeholder="产品编号" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="产品名称" prop="sort">
                        <el-input v-model="addDictForm.sort" placeholder="产品名称" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="产品类型" prop="sort">
                        <el-input v-model="addDictForm.sort" placeholder="产品类型" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="计量单位">
                        <el-input v-model="addDictForm.sort" placeholder="计量单位" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="规格型号">
                        <el-input v-model="addDictForm.sort" placeholder="规格型号" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="字典编号" prop="code">
                        <el-input v-model="addDictForm.code" placeholder="字典编号" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="字典名称" prop="dictValue">
                        <el-input v-model="addDictForm.dictValue" placeholder="字典名称" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="字典排序" prop="sort">
                        <el-input v-model="addDictForm.sort" placeholder="字典排序" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="封存">
                        <el-switch v-model="addDictForm.isSealed" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="字典备注">
                    <el-form-item label="产品描述">
                        <el-input v-model="addDictForm.remark" placeholder="字典备注" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="启用状态">
                        <el-input v-model="addDictForm.sort" placeholder="启用状态" clearable></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <div class="plan-content-title">扩展字段</div>
        <template #footer>
            <el-button @click="visible=false" >取 消</el-button>
            <el-button v-if="mode!='show'" type="primary" :loading="isSaveing" @click="dictSubmit()">保 存</el-button>
@@ -44,7 +61,7 @@
                value1: true,
                mode: "add",
                titleMap: {
                    add: '新增',
                    add: '新建产品',
                    edit: '修改',
                    show: '查看'
                },
@@ -143,5 +160,15 @@
    }
</script>

<style>
<style scoped>
    .plan-content-title {
        border-left: 2px solid #337ecc;
        padding: 0 8px;
        font-weight: 700;
        font-size: 14px;
        text-align: left;
        color: #333;
        margin-bottom: 16px;
        margin-top: 12px;
    }
</style>

 src/views/console/basic-data/product.vue

@@ -21,24 +21,25 @@
                    </div>
                    <el-row class="search-condition">
                        <el-col :span="5">
                            <el-select v-model="searchData.test" :prefix-icon="Search" placeholder="请选择" style="width: 100%;padding-right: 20px;">
                            <el-select multiple v-model="searchData.typeId" :prefix-icon="Search" placeholder="请选择" style="width: 100%;padding-right: 20px;">
                                <template #prefix><span style="margin-right: 6px;">产品类型</span></template>
                                <el-option v-for="item in testList" :key="item.value" :label="item.label" :value="item.value" />
                                <el-option v-for="item in typeIdList" :key="item.id" :label="item.name" :value="item.id" />
                            </el-select>
                        </el-col>
                        <el-col :span="5">
                            <el-input v-model="searchData.test" placeholder="请输入" style="padding-right: 20px;">
                            <el-input v-model="searchData.standardModel" placeholder="请输入" style="padding-right: 20px;">
                                <template #prefix><span style="margin-right: 6px;">规格型号</span></template>
                            </el-input>
                        </el-col>
                        <el-col :span="5">
                            <el-select v-model="searchData.test" :prefix-icon="Search" placeholder="请选择" style="width: 100%;padding-right: 20px;">
                            <el-select v-model="searchData.status" :prefix-icon="Search" placeholder="请选择" style="width: 100%;padding-right: 20px;">
                                <template #prefix><span style="margin-right: 6px;">状态</span></template>
                                <el-option v-for="item in testList" :key="item.value" :label="item.label" :value="item.value" />
                                <el-option key="0" label="停用" value="0" />
                                <el-option key="1" label="启用" value="1" />
                            </el-select>
                        </el-col>
                        <el-col :span="5">
                            <el-input v-model="searchData.test" placeholder="请输入">
                            <el-input v-model="searchData.keyWord" placeholder="请输入">
                                <template #prefix><span style="margin-right: 6px;">编号/名称</span></template>
                            </el-input>
                        </el-col>
@@ -47,54 +48,95 @@
                        </el-col>
                    </el-row>
                    <el-drawer title="查询设置" v-model="drawer" :direction="direction" :before-close="handleClose" size="780" class="drawerClass">
                        <div>
							
                        <div class="drawer-form">
                            <div class="drawer-left">
                                <div class="plan-content-title">基础字段</div>
                                <el-checkbox-group v-model="checkData">
                                    <el-checkbox v-for="item in checkList" :label="item.fieldName" :value="item.fieldId" />
                                  </el-checkbox-group>
                                  <div class="plan-content-title">扩展字段</div>
                            </div>
                            <div class="drawer-right">
                                <div class="plan-content-title">已选字段</div>
                                <ul class="drawer-ul">
                                    <li v-for="(item,index) in checkData">
                                        <span>{{item}}</span>
                                        <el-icon style="cursor: pointer;" @click="delIcon(index)"><Delete /></el-icon>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <div class="drawer-foot">
                            <el-button @click="closeDrawer">关闭</el-button>
                            <el-button type="primary" @click="drawerConfirm" disabled>保存</el-button>
                            <el-button type="primary" @click="drawerConfirm">保存</el-button>
                        </div>
                    </el-drawer>
                </div>
            </el-tab-pane>
            <el-tab-pane label="产品类型" name="second">
                <!-- <person-post v-if="activeName == 'second'"></person-post> -->
                <div v-if="activeName == 'second'">
                    <div>
                        <el-button type="primary" @click="addTypeData" class="marginR12">快速添加</el-button>
                        <el-button type="danger" plain @click="delTypeData" class="marginR12">删除</el-button>
                    </div>
                    <el-row style="margin-top: 12px;" v-if="isAddType">
                        <el-col :span="4">
                            <el-input v-model="typeData.name" size="small" placeholder="请输入名称" style="padding-right: 20px;"></el-input>
                        </el-col>
                        <el-col :span="4">
                            <el-input v-model="typeData.remark" size="small" placeholder="请输入描述" style="padding-right: 20px;"></el-input>
                        </el-col>
                        <el-col :span="4">
                            <el-button type="primary" size="small" @click="addTypeDataSubmit">确定</el-button>
                            <el-button size="small" @click="addTypeDataCencel">取消</el-button>
                        </el-col>
                    </el-row>
                    <div class="product-type-table">
                        <el-table ref="multipleTableRef" :data="productTypeTableData" border style="width: 100%" class="multipleTableRef" @selection-change="handleSelectionChange">
                            <el-table-column type="selection" width="55" />
                            <el-table-column prop="name" label="产品类型名称"></el-table-column>
                            <el-table-column prop="remark" label="描述"></el-table-column>
                            <el-table-column prop="status" label="状态">
                                <template #default="scope">
                                     <span>{{ scope.row.status == "1"?"启用":"停用" }}</span>
                                 </template>
                            </el-table-column>
                            <el-table-column fixed="right" label="操作">
                                <template #default="scope">
                                    <el-button text type="primary" size="small" @click="del_product_type(scope.row, scope.$index)">删除</el-button>
                                </template>
                            </el-table-column>
                        </el-table>
                        <el-pagination
                            style="margin-top: 12px;"
                            @size-change="handleSizeChange"
                            @current-change="handleCurrentChange"
                            :current-page="currentPage4"
                            :page-sizes="[15, 50, 100]"
                            :page-size="15"
                            layout="total, sizes, prev, pager, next, jumper"
                            :total="productTypeTableData.length">
                        </el-pagination>
                    </div>
                </div>
            </el-tab-pane>
        </el-tabs>
        <!-- <div>
            <div class="Product-table">
                <el-table ref="multipleTableRef" :data="tableData" border style="width: 100%" class="multipleTableRef" @selection-change="handleSelectionChange">
                    <el-table-column type="selection" width="55" />
                    <el-table-column prop="ProductValue" label="字典名称"></el-table-column>
                    <el-table-column prop="sort" label="字典排序"></el-table-column>
                    <el-table-column prop="isSealed" label="封存">
                        <template #default="scope">
                            <div>{{scope.row.isSealed == 0?"否":"是"}}</div>
                        </template>
                    </el-table-column>
                    <el-table-column fixed="right" label="操作">
                        <template #default="scope">
                            <el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
                            <el-button type="text" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
                            <el-button text type="primary" size="small" @click="table_del(scope.row, scope.$index)">删除</el-button>
                            <el-button text type="primary" size="small" @click="table_allocation(scope.row, scope.$index)">字典配置</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination
                    style="margin-top: 12px;"
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage4"
                    :page-sizes="[15, 50, 100]"
                    :page-size="15"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total">
                </el-pagination>
            </div> -->
    </div>
    
    <save-dialog v-if="dialog.save" ref="saveDialog" @success="addProductSuccess" @closed="dialog.save=false"></save-dialog>
    <!-- 删除 -->
    <el-dialog title="" v-model="delTypeModel" :width="400" destroy-on-close>
        <div>
            <div style="margin-bottom: 6px;"><span class="delIcon">!</span>请你谨慎选择！</div>
            <div style="text-indent: 24px;">删除数据会影响已关联的业务 ,若您想在已关联的业务中依然显示这些数据, 您可以选择 停用 操作。停用后此数据将不能再被新业务使用。</div>
        </div>
        <template #footer>
            <div class="footerDiv">
                <div class="delBtn" @click="delTypeDataSingle(0)">删除</div>
                <div class="delBtn" @click="delTypeDataSingle(1)">停用</div>
            </div>
        </template>
    </el-dialog>
</template>
<script>
    import * as ElementPlusIconsVue from '@element-plus/icons-vue'
@@ -108,6 +150,17 @@
        name: "allocation",
        data(){
            return {
                checkData: [],
                checkList: [],
                id: "",
                delTypeModel: false,
                isAddType: false,
                typeData: {
                    name: "",
                    remark: ""
                },
                productTypeTableData: [],
                typeIdList: [],
                direction: "rtl",
                drawer: false,
                testList: [],
@@ -117,7 +170,10 @@
                selection: [],
                total: 0,
                searchData: {
                    test: "",
                    keyWord: "",
                    standardModel: "",
                    status: "1",
                    typeId: [],
                    current: "1",
                    size: "15"
                },
@@ -132,11 +188,90 @@
        },
        mounted(){
            //this.searchBtn();
            this.getProductType();
            this.getProductTypeSelect();
            this.getFields();  //查询设置
        },
        components: {
            ...ElementPlusIconsVue,saveDialog,importTable
        },
        methods: {
            delIcon(index) {
                this.checkData.splice(index,1);
            },
            getFields() {
                this.$HTTP.get(`/api/blade-system/custom-template-field-relation/getConditionFields?templateId=`).then(res => {
                    if (res.code == 200) {
                        this.checkList = res.data.systemFieldList;
                        res.data.systemFieldList.forEach(item=> {
                            if(item.querySupport == 1) this.checkData.push(item.fieldName);
                        })
                    }
                })
            },
            delTypeDataSingle(type) {
                if(type == 0) {  //删除
                    this.$HTTP.delete(`/api/blade-cps/product-type/remove`,[this.id]).then(res=> {
                        if(res.code == 200) {
                            this.$message.success("操作成功");
                            this.delTypeModel = false;
                            this.id = "";
                            this.getProductType();
                        }
                    })
                }else {  //停用
                    var obj = {
                        ids: [this.id],
                        status: 0
                    }
                    this.$HTTP.put(`/api/blade-cps/product-type/change-status`,obj).then(res=> {
                        if(res.code == 200) {
                            this.$message.success("操作成功");
                            this.delTypeModel = false;
                            this.id = "";
                            this.getProductType();
                        }
                    })
                }
                this.getProductTypeSelect();
            },
            addTypeDataSubmit() {
                this.$HTTP.post(`/api/blade-cps/product-type/saveOrUpdate`,this.typeData).then(res => {
                    if (res.code == 200) {
                        this.getProductType();
                        this.clearTypeData();
                        this.getProductTypeSelect();
                    }
                })
            },
            addTypeDataCencel() {
                this.clearTypeData();
            },
            clearTypeData() {
                this.isAddType = false;
                this.typeData = {
                    name: "",
                    remark: ""
                }
            },
            getProductType() {
                this.$HTTP.get(`/api/blade-cps/product-type/page?current=1&size=10`).then(res => {
                    if (res.code == 200) {
                        this.productTypeTableData = res.data.records;
                    }
                })
            },
            del_product_type(row) {
                this.id = row.id;
                this.delTypeModel = true;
            },
            getProductTypeSelect() {
                this.$HTTP.get(`/api/blade-cps/product-type/page?size=-1`).then(res => {
                    if (res.code == 200) {
                        this.typeIdList = res.data.records;
                    }
                })
            },
            addDrawer() {
                this.drawer = true;
            },
@@ -144,6 +279,23 @@
                this.drawer = false;
            },
            drawerConfirm() {
                var ids = [];
                this.checkList.forEach(item=> {
                    this.checkData.forEach(item1=> {
                        if(item1 == item.fieldName) {
                            ids.push(item.fieldId)
                        }
                    })
                })
                var obj = {
                    ids: ids,
                    templateId: ""
                }
                this.$HTTP.post(`/api/blade-system/custom-template-field-relation/submitConditionFields`,obj).then(res => {
                    if (res.code == 200) {
                        this.$message.success("操作成功");
                    }
                })
                this.drawer = false;
            },
            handleClose(done) {
@@ -241,6 +393,12 @@
            handleSelectionChange(selection) {
                this.selection = selection;
            },
            addTypeData() {
                this.isAddType = true;
            },
            delTypeData() {

            },
            delData() {
                if(this.selection.length == 0) {
                    this.$message({
@@ -306,4 +464,86 @@
        margin-left: 12px;
        margin-top: 7px;
    }
    .product-type-table {
        margin-top: 12px;
    }
    .delIcon {
        color: #fff;
        background: red;
        border-radius: 50%;
        display: inline-block;
        width: 20px;
        height: 20px;
        font-size: 14px;
        text-align: center;
        line-height: 20px;
        margin-right: 6px;
    }
    .footerDiv {
        text-align: center;
    }
    .delBtn {
        color: #fff;
        width: 112px;
        height: 32px;
        display: inline-block;
        color: #fa554c;
        background-color: #fff;
        border: 1px solid #fdbbb7;
        text-align: center;
        line-height: 32px;
        cursor: pointer;
    }

    .delBtn:nth-child(1) {
        margin-right: 4px;
    }

    .delBtn:hover {
        background-color: #f34d5b;
        border-color: #f34d5b;
        color: #fff;
    }
    .drawer-foot {
        position: fixed;
        bottom: 20px;
        right: 20px;
    }
    .plan-content-title {
        border-left: 2px solid #337ecc;
        padding: 0 8px;
        font-weight: 700;
        font-size: 14px;
        text-align: left;
        color: #333;
        margin-bottom: 16px;
        margin-top: 12px;
    }
    .drawer-form {
        height: calc(100% - 60px);
        overflow: auto;
        border-top: 1px solid rgba(59,142,142,.18);
        border-bottom: 1px solid rgba(59,142,142,.18);
        padding: 0 24px;
        display: flex;
    }
    .drawer-left {
        width:70%;
        border-right: 1px solid rgba(59,142,142,.18);
        padding: 24px;
    }
    .drawer-right {
        flex: 1;
        padding: 24px;
    }
    .drawer-ul li {
        list-style: none;
        font-size: 14px;
        margin-bottom: 12px;
    }
    .drawer-ul li span {
        margin-right: 50px;
        display: inline-block;
        min-width: 80px;
    }
</style>