digital-medicine-front/src/views/zycp-app/swyq-code/index.vue

<template>
    <div class="p-3">
        <div class="bg-fff flex1 ov-hd d-flex flex-cln">
            <div class="pd-16 border-bottom">
                <el-form ref="formRef" :model="paramForm" :inline="true" label-width="auto">
                    <el-form-item label="产品类别：" class="search-form-item" prop="classType">
                        <el-select v-model="paramForm.classType" placeholder="请选择" @change="onSearch" style="width: 120px;">
                            <el-option v-for="item in class_type" :key="item.value" :label="item.label" :value="item.value"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="审核状态：" class="search-form-item" prop="res">
                        <el-select v-model="paramForm.res" placeholder="请选择" @change="onSearch" style="width: 120px;">
                            <el-option v-for="item in check_status" :key="item.value" :label="item.label" :value="item.value"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="生成时间：" class="search-form-item" prop="dateTime">
                        <div style="width: 240px" class="d-flex">
                            <DateRange v-model="paramForm.dateTime" v-model:start-date="paramForm.startAt" v-model:end-date="paramForm.endAt" @change="onSearch"></DateRange>
                        </div>
                    </el-form-item>
                    <el-form-item prop="keywords" label="关键字搜索：" class="search-form-item">
                        <el-input v-model="paramForm.keywords" style="width: 260px;" @keyup.enter="onSearch" class="input-with-search" clearable placeholder="搜生成批号、产品名称、备注"></el-input>
                    </el-form-item>
                    <el-form-item class="search-form-item">
                        <el-button @click="onSearch" type="primary">搜索</el-button>
                        <el-button @click="resetSearch">重置</el-button>
                    </el-form-item>
                </el-form>
            </div>
            <div class="flex1 ov-hd pd-16 d-flex flex1 ov-hd flex-cln">
                <div class="flex1 ov-hd">
                    <vxe-table :data="list" border :loading="loading" min-height="0" max-height="100%">
                        <vxe-column type="seq" title="序号" width="50">
                            <template #default="{ $rowIndex }">
                                {{ paramForm.pageSize * (paramForm.pageNum - 1) + $rowIndex + 1 }}
                            </template>
                        </vxe-column>
                        <vxe-column field="batchSn" class-name="c-333 f-w-5" width="100" title="生成批号"></vxe-column>
                        <vxe-column min-width="300" title="产品信息">
                            <template #default="{ row }">
                                <RowProGB :row="row"></RowProGB>
                            </template>
                        </vxe-column>
                        <vxe-column field="cpyName" class-name="c-333 f-w-5" width="100" title="申请企业名称"></vxe-column>
                        <vxe-column min-width="160" title="码数量" :formatter="colNoData">
                            <template #default="{ row }">
                                <div class="f-w-5 c-333">{{ row.codeAllCount || '-' }}</div>
                                <div class="f-12 c-999">
                                    <template v-for="(item, index) in row?.codeInfo" :key="index">
                                        <div class="mr20">{{ item?.level }}级：{{ item?.count || 0 }}</div>
                                    </template>
                                </div>
                            </template>
                        </vxe-column>
                        <vxe-column field="useCount" width="80" title="使用记录" :formatter="colNoData">
                            <template #default="{ row }">
                                <el-button v-if="row.useCount" @click="clickLookUseLog(row)" type="primary" text class="small-f-14" size="small">{{ row.useCount }}条</el-button>
                                <template v-else>-</template>
                            </template>
                        </vxe-column>
                        <vxe-column field="downloadCount" width="80" title="下载次数" :formatter="colNoData"></vxe-column>
                        <vxe-column field="downloadTime" width="110" title="最近下载时间" :formatter="colNoData"></vxe-column>
                        <vxe-column width="110" title="审核状态">
                            <template #default="{ row }">
                                <div>{{ selectDictLabel(check_status, row?.res) || '-' }}</div>
                                <div class="f-s-12 c-#999" v-if="row?.res == '2'">理由: {{  row?.msg }}</div>
                            </template>
                        </vxe-column>
                        <vxe-column width="110" title="生成状态" :formatter="colNoData">
                            <template #default="{ row }">
                                <template v-if="row.status * 1 == 1">生成成功</template>
                                <template v-else-if="row.status * 1 == 11">未开始</template>
                                <template v-else>生成中</template>
                            </template>
                        </vxe-column>
                        <vxe-column field="remark" min-width="130" title="备注" :formatter="colNoData"></vxe-column>
                        <vxe-column field="createByName" min-width="100" title="创建人" :formatter="colNoData"></vxe-column>
                        <vxe-column field="createTime" width="110" title="创建时间" :formatter="colNoData"></vxe-column>
                        <vxe-column fixed="right" title="操作" align="center" width="240">
                            <template #default="{ row }">
                                <template v-if="row?.res === '0'">
                                    <el-button @click="handleApproval(row, '1')" type="success">审核通过</el-button>
                                    <el-button @click="handleApproval(row, '2')" type="warning">审核不通过</el-button>
                                </template>
                            </template>
                        </vxe-column>
                        <template #empty>
                            <Empty description="暂无数据"></Empty>
                        </template>
                    </vxe-table>
                </div>
                <el-pagination v-model:page-size="paramForm.pageSize" background v-model:current-page="paramForm.pageNum" layout="total, sizes, prev, pager, next, jumper" :total="total" hide-on-single-page @size-change="changePageSize" @current-change="changePage" />
            </div>
        </div>
    </div>
</template>
<script setup name="Lm-list" lang="ts">
import { approvalSwyqCodeLog, swyqCodeLogList } from '@/api/gb';
import { debounce } from 'lodash';
import { RowProGB } from './model';
import { CircleCheck, CircleClose } from '@element-plus/icons-vue';
import { colNoData } from '@/utils/models';
import { DateRange, searchTabs } from '@/views/models';

const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const dict = proxy?.useDict('class_type', 'expiration_unit', 'code_type', 'ref_type', 'pack_status', 'trace_level', 'check_status');
const { check_status, class_type } = toRefs<any>(dict);
const showDown = ref(false);
const showUseLog = ref(false);
const showUseLogList = ref(false);

const downId = ref<any>(null);
const clickDownload = (row: any) => {
    downId.value = row?.id;
    showDown.value = true;
};

const rowInfo = ref<any>(null);
const clickAddUseLog = (row: any) => {
    rowInfo.value = row;
    showUseLog.value = true;
};
const clickLookUseLog = (row: any) => {
    rowInfo.value = row;
    showUseLogList.value = true;
};
const list = ref<any[]>([]);
const loading = ref(false);
const total = ref(0);
const paramForm = ref({
    pageSize: 10,
    pageNum: 1,
    keywords: '',
    swyqFlag: '1',
    dateTime: [],
    startAt: '',
    endAt: '',
    source: '1',
    classType: '',
    res: '' // 审核状态
});
const onSearch = () => {
    paramForm.value.pageNum = 1;
    getList();
};
const getList = debounce(async () => {
    loading.value = true;
    const res = await swyqCodeLogList({ ...paramForm.value }).catch(() => {});
    loading.value = false;
    if (!res || res.code !== 200) return;
    total.value = res.total;
    list.value = [...res.rows];
}, 600);
const approvalAjax = async (params: any) => {
    proxy?.$modal.loading('审核中...');
    const res = await approvalSwyqCodeLog(params).catch(() => {});
    proxy?.$modal.closeLoading();
    if (!res) return;
    proxy?.$modal.msgSuccess('操作完成');
    getList();
};
const changePageSize = (pageSize: number) => {
    paramForm.value.pageSize = pageSize;
    getList();
};
const changePage = (pageNum: number) => {
    paramForm.value.pageNum = pageNum;
    getList();
};
const formRef = ref<any>(null);
// 重置搜索
const resetSearch = () => {
    paramForm.value.pageNum = 1;
    formRef.value?.resetFields();
    paramForm.value.startAt = '';
    paramForm.value.endAt = '';
    getList();
};
/**
 * 申请审批
 */
const handleApproval = async (row: any, res: string) => {
    if (res === '1') {
        ElMessageBox.confirm('该成员审核通过?', '提示', {
            confirmButtonText: '确认',
            cancelButtonText: '取消',
            type: 'success',
            icon: markRaw(CircleCheck)
        })
            .then(() => {
                const params = {
                    approvalType: '2',
                    targetId: row.id,
                    res
                };
                approvalAjax(params);
            })
            .catch(() => {
                proxy?.$modal.msgWarning('取消审核');
            });
    } else {
        ElMessageBox.prompt('该成员审核不通过', '提示', {
            confirmButtonText: '确认',
            cancelButtonText: '取消',
            inputPlaceholder: '不通过理由',
            inputErrorMessage: '请填写不通过理由',
            type: 'error',
            icon: markRaw(CircleClose),
            inputValidator: (value) => {
                return value ? true : false;
            }
        })
            .then(({ value }) => {
                const params = {
                    approvalType: '2',
                    targetId: row.id,
                    res,
                    msg: value
                };
                approvalAjax(params);
            })
            .catch(() => {
                proxy?.$modal.msgWarning('取消审核');
            });
    }
};
onMounted(() => {
    getList();
});
</script>
<style lang="scss">
.el-form-item--default {
    &.search-form-item {
        margin: 5px;

        .el-form-item__label {
            padding-right: 0;
        }
    }
}
</style>