审批界面增加pdf，图片预览功能

yangys

2025-11-27 f97351a6f1fdc679f4956030d179dca843bbeb0c

 src/views/basesetting/produceplan.vue

@@ -1,13 +1,13 @@
<!--
 * @Date: 2025-06-17 11:44:52
 * @LastEditors: gaoshp
 * @LastEditTime: 2025-08-13 22:30:53
 * @LastEditTime: 2025-09-05 17:57:29
 * @FilePath: /mdmweb/src/views/basesetting/produceplan.vue
-->
<template>
    <basic-container>
        <el-tabs v-model="activeName" type="card" class="demo-tabs" @tab-click="tabsClick">
            <el-tab-pane label="主制分工表" name="zhuzhi">
            <el-tab-pane label="人员职责表" name="zhuzhi">
                <avue-crud :option="option" :table-loading="loading" :data="data" v-model:page="page" v-model="form" ref="crud"
                    @search-change="searchChange" @search-reset="searchReset" @current-change="currentChange"
                    @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad" @row-del="rowDel"
@@ -73,6 +73,7 @@
    name: 'ProducePlan',
    data() {
        return {
            getApproveList: [],
            activeName: "zhuzhi",
            // Define your data properties here
            excelOption: {
@@ -158,7 +159,8 @@
                        display: true,
                        filterable:true,
                        span: 24,
                        dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        // dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        dicData: [],
                        props: {
                            label: 'name',
                            value: 'id',
@@ -173,7 +175,8 @@
                        display: true,
                        filterable:true,
                        span: 24,
                        dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        // dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        dicData: [],
                        props: {
                            label: 'name',
                            value: 'id',
@@ -187,7 +190,8 @@
                        span: 24,
                        display: true,
                        filterable:true,
                        dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        // dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        dicData: [],
                        props: {
                            label: 'name',
                            value: 'id',
@@ -202,7 +206,8 @@
                        filterable:true,
                        display: true,
                        span: 24,
                        dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        // dicUrl: `/blade-mdm/flow/flow-user-list?deptId=0`,
                        dicData: [],
                        props: {
                            label: 'name',
                            value: 'id',
@@ -249,6 +254,13 @@
                dialogClickModal: false,
                column: [
                    {
                        label: '产品型号',
                        prop: 'cph',
                        type: 'input',
                        display: true,
                        span: 24,
                    },
                    {
                        label: '零组件号',
                        prop: 'ljh',
                        type: 'input',
@@ -258,13 +270,14 @@
                        span: 24,
                    },
                    {
                        label: '产品号',
                        prop: 'cph',
                        label: '零组件名称',
                        prop: 'ljmc',
                        type: 'input',
                        search: false,
                        display: true,
                        disabled:true,
                        span: 24,
                    },
					
                    {
                        label: '主管工艺',
                        prop: 'zggy',
@@ -294,6 +307,19 @@
        };
    },
    methods: {
        getApprovers () {
            axios({
            url: '/blade-mdm/flow/flow-user-list?deptId=0',
            method: 'get',
            params: {}
          }).then(
            res => {
                this.option.column[1].dicData = res.data.data;
                this.option.column[2].dicData = res.data.data;
                this.option.column[3].dicData = res.data.data;
                this.option.column[4].dicData = res.data.data;
            });
        },
        // Define your methods here
        tabsClick(tab,event) {
            //console.log('tab',tab)
@@ -517,6 +543,7 @@
    },
    mounted() {
        // Code to run when the component is mounted
        this.getApprovers()
    },
}
</script>