董国庆
2025-05-26 f90eb2159fc4aa79d7cd28e0f30b7e82a2cea779
laboratory/src/views/chemistQa/pilotAndProduction/index.vue
@@ -1,139 +1,257 @@
<template>
    <div class="list">
        <TableCustom :queryForm="queryForm" :total="total" @currentChange="handleCurrentChange"
            @sizeChange="handleSizeChange">
        <TableCustom :queryForm="queryForm" :total="total" @currentChange="handleCurrentChange" :height="null"
            @sizeChange="handleSizeChange" :tableData="tableData">
            <template #search>
                <el-form :model="form" label-width="auto" inline>
                    <el-form-item label="所属项目组:">
                        <el-input v-model="form.name" placeholder="请输入"></el-input>
                        <el-input v-model="form.teamName" placeholder="请输入项目组名称"></el-input>
                    </el-form-item>
                    <el-form-item label="报告标题">
                        <el-input v-model="form.name" placeholder="请输入"></el-input>
                        <el-input v-model="form.reportTitle" placeholder="请输入报告标题"></el-input>
                    </el-form-item>
                    <el-form-item label="报告编号">
                        <el-input v-model="form.name" placeholder="请输入"></el-input>
                        <el-input v-model="form.reportCode" placeholder="请输入报告编号"></el-input>
                    </el-form-item>
                    <el-form-item label="状态:">
                        <el-select v-model="form.status" placeholder="请选择">
                            <el-option label="草稿箱" value="-1"></el-option>
                            <el-option label="待审核" value="1"></el-option>
                            <el-option label="已通过" value="0"></el-option>
                            <el-option label="已驳回" value="2"></el-option>
                            <el-option label="已通过待评定" value="2"></el-option>
                            <el-option label="已评定" value="3"></el-option>
                            <el-option label="已驳回" value="4"></el-option>
                            <el-option label="已撤销" value="5"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="" style="margin-left: 63px;">
                        <el-button type="default" style="margin-right: 10px;">重置</el-button>
                        <el-button type="primary">查询</el-button>
                        <el-button type="default" @click="resetForm" style="margin-right: 10px;">重置</el-button>
                        <el-button type="primary" @click="getList">查询</el-button>
                    </el-form-item>
                </el-form>
            </template>
            <template #setting>
                <div class="table-setting">
                    <div class="flex a-center">
                        <div class="table-title" :class="{ active: currentType === 'list' }" @click="handleTypeChange('list')">
                        <div class="table-title" :class="{ active: currentType == 'list' }" @click="handleTypeChange('list')">
                            中试、生产验证试验检验分析报告
                        </div>
                        <div class="table-tit" :class="{ active: currentType === 'draft' }" @click="handleTypeChange('draft')">
                        <div v-if="isChemist" class="table-tit" :class="{ active: currentType == 'draft' }" @click="handleTypeChange('draft')">
                            草稿箱
                        </div>
                    </div>
                    <el-button @click="handleAddProject" class="el-icon-plus" type="primary">
                    <el-button v-if="isChemist" @click="handleAddProject" class="el-icon-plus" type="primary">
                        新增</el-button>
                </div>
            </template>
            <template #table>
                <el-table-column prop="name" label="所属项目组" />
                <el-table-column prop="age" label="报告标题" />
                <el-table-column prop="age" label="报告编号" />
                <el-table-column prop="age" label="制定人" />
                <el-table-column prop="age" label="制定日期" />
                <el-table-column prop="age" label="操作">
                <el-table-column prop="teamName" label="所属项目组" />
                <el-table-column prop="reportTitle" label="报告标题" />
                <el-table-column prop="reportCode" label="报告编号" />
                <el-table-column prop="createBy" label="制定人" />
                <el-table-column prop="createTime" label="制定日期" />
                <el-table-column prop="status" label="状态">
                    <template #default="{ row }">
                        <el-button type="text" @click="showApproval = true">详情</el-button>
                        <el-tag :type="getStatusType(row.status)">
                            {{ getStatusText(row.status) }}
                        </el-tag>
                    </template>
                </el-table-column>
                <el-table-column label="操作" width="200">
                    <template #default="{ row }">
                        <!-- 化验师的按钮 -->
                        <template v-if="isChemist">
                            <template v-if="currentType == 'draft'">
                                <el-button type="text" @click="handleEdit(row)">编辑</el-button>
                                <el-button type="text" @click="handleDelete(row)">删除</el-button>
                            </template>
                            <el-button v-else type="text" @click="handleDetail(row)">详情</el-button>
                        </template>
                        <!-- 工艺工程师的按钮 -->
                        <template v-else-if="isProcessEngineer">
                            <el-button v-if="row.status == 1" type="text" @click="handleApprove(row)">审批</el-button>
                            <el-button v-else type="text" @click="handleDetail(row)">详情</el-button>
                        </template>
                        <!-- 其他角色的按钮 -->
                        <template v-else>
                            <el-button type="text" @click="handleDetail(row)">详情</el-button>
                        </template>
                    </template>
                </el-table-column>
            </template>
        </TableCustom>
        <Approval :visible="showApproval" @close="showApproval = false" />
        <ShowDelConfirm :show="showDelConfirm" @close="showDelConfirm = false" @confirm="handleDelConfirm" />
        <ShowDelConfirm :title="changeStatusTitle" :tip="changeStatusTip" :show="changeStatus"
            @close="changeStatus = false" @confirm="handleChangeStatusConfirm" />
        <Approval
            :visible.sync="showApproval"
            :type="approvalType"
            :data="approvalData"
            @close="handleApprovalClose"
        />
        <ShowDelConfirm
            :show="showDelConfirm"
            title="确认删除"
            tip="删除后数据将无法恢复,是否确认删除?"
            @close="showDelConfirm = false"
            @confirm="handleDelConfirm"
        />
    </div>
</template>
<script>
import Approval from './components/approval'
import ShowDelConfirm from "@/components/showDelConfirm/index.vue";
import { getDataList, deleteById } from './service'
export default {
    name: 'ProjectList',
    components: {
        Approval
        Approval,
        ShowDelConfirm
    },
    data() {
        return {
            currentType: 'list', // 当前显示类型:list-列表,draft-草稿箱
            form: {
                name: '',
                teamName: '',
                reportTitle: '',
                reportCode: '',
                status: '',
                pageNum: 1,
                pageSize: 10
            },
            showDelConfirm: false,
            rowId: '',
            changeStatus: false,
            showApproval: false,
            changeStatusTitle: '',
            changeStatusTip: '',
            approvalType: 'view',
            approvalData: {},
            queryForm: {
                pageSize: 10,
                pageNum: 1
            },
            total: 0
            total: 0,
            tableData: [] // 添加表格数据
        }
    },
    computed: {
        isChemist() {
            const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}');
            return userInfo.roleType == 4; // 2是化验师
        },
        isProcessEngineer() {
            const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}');
            return userInfo.roleType == 3; // 3是工艺工程师
        }
    },
    created() {
        this.getList();
    },
    methods: {
        resetForm() {
            this.form = {
                teamName: '',
                reportTitle: '',
                reportCode: '',
                status: this.currentType == 'draft' ? -1 : '',
                pageNum: 1,
                pageSize: 10
            };
            this.getList();
        },
        handleAddProject() {
            this.$router.push('/chemistQa/addPilot')
        },
        handleDel(row) {
            this.rowId = row.id
            this.showDelConfirm = true
        handleEdit(row) {
            this.$router.push({
                path: '/chemistQa/editPilot',
                query: { id: row.id }
            });
        },
        handleDelete(row) {
            this.rowId = row.id;
            this.showDelConfirm = true;
        },
        handleDelConfirm() {
            this.showDelConfirm = false
            this.msgsuccess('删除成功')
            this.rowId = ''
            this.getList()
            // 调用删除API
            deleteById({ id: this.rowId }).then(res => {
                if (res.code == 200) {
                    this.$message.success('删除成功');
                    this.showDelConfirm = false;
                    this.getList();
                } else {
                    this.$message.error(res.msg || '删除失败');
                }
            }).catch(err => {
                console.error('删除失败:', err);
                this.$message.error('删除失败');
            });
        },
        handleChangeStatus(row, status) {
            this.rowId = row.id
            this.changeStatusTitle = status == 1 ? '确认要封存这个项目组吗?' : '确认要解封该项目组吗?'
            this.changeStatusTip = status == 1 ? '封存后项目组内人员看不到数据,审批人仍然可见数据。' : '解封后项目组内人员数据恢复。'
            this.changeStatus = true
        handleApprove(row) {
            this.approvalType = 'approve';
            this.approvalData = row;
            this.showApproval = true;
        },
        handleChangeStatusConfirm() {
            this.changeStatus = false
            this.msgsuccess('操作成功')
            this.rowId = ''
            this.changeStatusTitle = ''
            this.changeStatusTip = ''
            this.getList()
        handleDetail(row) {
            this.approvalType = 'view';
            this.approvalData = row;
            this.showApproval = true;
        },
        handleCurrentChange(page) {
            this.queryForm.pageNum = page
            this.getList()
            this.queryForm.pageNum = page;
            this.getList();
        },
        handleSizeChange(size) {
            this.queryForm.pageSize = size
            this.getList()
            this.queryForm.pageSize = size;
            this.getList();
        },
        getList() {
            const params = {
                ...this.form,
                pageNum: this.queryForm.pageNum,
                pageSize: this.queryForm.pageSize,
                // reportType: 1
            };
            getDataList(params).then(res => {
                if (res.code == 200) {
                    this.tableData = res.data.records || [];
                    this.total = res.data.total || 0;
                } else {
                    this.$message.error(res.msg || '获取数据失败');
                }
            }).catch(err => {
                console.error('获取数据失败:', err);
                this.$message.error('获取数据失败');
            });
        },
        handleTypeChange(type) {
            this.currentType = type;
            this.form.status = type === 'draft' ? -1 : '';
            this.form.status = type == 'draft' ? -1 : '';
            this.getList();
        },
        getStatusType(status) {
            const statusMap = {
                '-1': 'info',
                '1': 'warning',
                '2': 'success',
                '3': 'success',
                '4': 'danger',
                '5': 'info'
            };
            return statusMap[status] || 'info';
        },
        getStatusText(status) {
            const statusMap = {
                '-1': '草稿箱',
                '1': '待审核',
                '2': '已通过待评定',
                '3': '已评定',
                '4': '已驳回',
                '5': '已撤销'
            };
            return statusMap[status] || '未知状态';
        },
        handleApprovalClose() {
            this.showApproval = false;
            this.approvalData = {};
            this.getList(); // 刷新列表数据
        }
    }
}
@@ -196,8 +314,8 @@
    align-items: center;
    justify-content: center;
    font-family: SourceHanSansCN, SourceHanSansCN;
    font-weight: bold;
    font-size: 18px;
    font-weight: 400;
    color: #606266;
    line-height: 27px;
    cursor: pointer;
@@ -207,6 +325,7 @@
        color: #049c9a;
        background: #ffffff;
        border: 1px solid #049c9a;
        font-weight: bold;
    }
}
@@ -220,7 +339,7 @@
    align-items: center;
    justify-content: center;
    font-family: SourceHanSansCN, SourceHanSansCN;
    font-weight: bold;
    font-weight: 400;
    font-size: 18px;
    color: #606266;
    line-height: 27px;
@@ -232,6 +351,7 @@
        color: #049c9a;
        background: #ffffff;
        border: 1px solid #049c9a;
        font-weight: bold;
    }
}