From f97351a6f1fdc679f4956030d179dca843bbeb0c Mon Sep 17 00:00:00 2001
From: yangys <y_ys79@sina.com>
Date: 星期四, 27 十一月 2025 14:09:04 +0800
Subject: [PATCH] 审批界面增加pdf，图片预览功能
---
src/views/wel/gongkong.vue | 335 ++++++++++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 301 insertions(+), 34 deletions(-)
diff --git a/src/views/wel/gongkong.vue b/src/views/wel/gongkong.vue
index 3abca46..fc42c9f 100644
--- a/src/views/wel/gongkong.vue
+++ b/src/views/wel/gongkong.vue
@@ -8,8 +8,23 @@
-->
<template>
<div class="gongkongMain">
- <div>
- <el-tree :data="treeData" :props="defaultProps" node-key="id" :default-expand-all="false" :default-expanded-keys="defaultKeys" @node-click="handleNodeClick" />
+ <div class="organization-tree">
+ <el-input v-model="keyword" placeholder="杈撳叆鎼滅储鍏抽敭瀛�" @input="handleInput" clearable="true"/>
+ <el-tree ref="tree" :filter-node-method="filterNodeMethod" :current-node-key="currentNodeKey" :data="treeData" :highlight-current="true" :props="defaultProps" node-key="id" :default-expand-all="false" :default-expanded-keys="defaultKeys" @node-click="handleNodeClick" >
+ <template #default="scope">
+ <div
+ :class="
+ keyword === ''
+ ? ''
+ : scope.data.name.indexOf(keyword) !== -1
+ ? 'has-key-word-style'
+ : ''
+ "
+ >
+ {{ scope.data.name}}
+ </div>
+ </template>
+ </el-tree>
</div>
<div>
<el-row>
@@ -21,14 +36,16 @@
</el-col>
</el-row>
<el-table :data="treecFileData" style="width: 100%">
- <el-table-column prop="name" label="鍚嶇О" />
- <el-table-column prop="fileModifyTime" label="鍒涘缓鏃ユ湡" />
- <el-table-column prop="fileModifyTime" label="淇敼鏃ユ湡" />
- <el-table-column prop="fileSizeDisplay" label="澶у皬" />
- <el-table-column fixed="right" label="鎿嶄綔" min-width="120">
+ <el-table-column prop="name" label="鍚嶇О"/>
+ <el-table-column prop="fileModifyTime" label="鍒涘缓鏃ユ湡" width="160"/>
+ <el-table-column prop="fileModifyTime" label="淇敼鏃ユ湡" width="160"/>
+ <el-table-column prop="fileSizeDisplay" label="澶у皬" width="100"/>
+ <el-table-column fixed="right" label="鎿嶄綔" min-width="110">
<template #default="scope">
<el-button link type="primary" size="small" @click="fileView(scope.row)">鏌ョ湅</el-button>
- <el-button link type="primary" size="small" @click="fileEdit(scope.row)">缂栬緫</el-button>
+ <el-button link type="primary" v-if="scope.row.dirType!='PROGRAM'" size="small" @click="fileEdit(scope.row)">缂栬緫</el-button>
+ <el-button type="primary" v-if="scope.row.dirType!='PROGRAM'" text size="small" @click.stop="viewHistory(scope.row, scope.index)">淇敼璁板綍</el-button>
+ <el-button type="primary" v-if="scope.row.dirType=='SEND'" text size="small" @click.stop="changeName(scope.row)">閲嶅懡鍚�</el-button>
</template>
</el-table-column>
</el-table>
@@ -46,12 +63,61 @@
</div>
</template>
</el-dialog>
+
+ <el-dialog title="淇敼璁板綍" width="900" append-to-body v-model="viewHisModel">
+ <avue-crud :addBtn="false" :option="optionHis" :table-loading="loadingHis" :data="dataHis" ref="crud"
+ @current-change="currentChangeHis" v-model:page="pageHis" @search-change="searchChangeHis" @size-change="sizeChangeHis" @refresh-change="refreshChangeHis" @on-load="onLoadHis">
+
+ <template #menu="scope">
+ <!--<el-button type="primary" :disabled="scope.row.processExecuted==true" text size="default" @click.stop="cancelProcess(scope.row, scope.index)">鎾ら攢</el-button> -->
+ <el-button type="primary" text size="default" @click.stop="hisCompare(scope.row, scope.index)">姣斿</el-button>
+ </template>
+
+ </avue-crud>
+ </el-dialog>
+
+ <el-drawer title="鏂囦欢瀵规瘮" append-to-body v-model="diffBox" size="100%" class="code-box">
+ <div>
+ <code-diff :old-string="this.content1" :new-string="this.content2" output-format="side-by-side" :hideStat="true" :filename="codeDiffFileName1" :newFilename="codeDiffFileName2"/>
+ </div>
+ </el-drawer>
+
+ <el-dialog title="淇敼鏂囦欢鍚�" width="400" append-to-body v-model="changeNameModel">
+ <avue-form :option="changeNameOption" v-model="changeNameForm" @submit="changeNameSubmit">
+
+ </avue-form>
+
+ </el-dialog>
</template>
<script>
+import {
+ getFileChangeList
+} from '@/api/wel/changehis';
+import { pageHeaderEmits } from 'element-plus';
+import qs from 'qs';
export default {
+ name: 'OrganizationTree',
components: {},
data() {
return {
+ keyword: '',//鏍戞煡璇㈠叧閿瓧
+ currentNodeKey: null,
+ filterData: [], // 杩囨护鍚庣殑鏁版嵁
+ activeNode: null,
+
+ changeNameModel:false,
+ changeNameForm : {},
+ changeNameOption:{
+ labelWidth:80,
+ size:'mini',
+ column:[
+ {
+ span:22,
+ label:'鏂囦欢鍚�',
+ prop:"name"
+ }
+ ]
+ },
defaultKeys: [],
fileOptionTitle: "",
fileContent: "",
@@ -69,6 +135,58 @@
treecFileData: [],
TreeNode: {},
fileRow: {},
+ loadingHis:false,
+ viewHisModel:false,
+
+ queryHis:{},
+ optionHis: {
+ addBtn: false,
+ editBtn: false,
+ delBtn: false,
+ columnBtn:false,
+ gridBtn:false,
+ refreshBtn:false,
+ labelWidth: 120,
+ emptyBtn: false,
+ searchShow: true,
+ searchEnter:true,
+ searchSpan: 4,
+ menu: true,
+ // selection: true,
+ column: [
+ {
+ label: '淇敼浜�',
+ prop: 'name',
+ search: true,
+ searchType: 'input',
+ searchSpan:6,
+ hide: false,
+ viewDisplay: true,
+ },
+ {
+ label: '淇敼鏃堕棿',
+ prop: 'createTime',
+ type: 'datetime',
+ format: 'YYYY-MM-DD HH:mm:ss',
+ valueFormat: 'YYYY-MM-DD HH:mm:ss',
+ search: true,
+ searchSpan:12,
+ searchRange: true,
+ hide: false,
+ },
+ ],
+ },
+ dataHis:[],
+ pageHis: {
+ pageSize: 10,
+ currentPage: 1,
+ total: 0,
+ },
+ diffBox: false,
+ content1: "",
+ content2: "",
+ codeDiffFileName1: "",
+ codeDiffFileName2: "",
}
},
computed: {},
@@ -76,6 +194,27 @@
},
methods: {
+ async handleInput (v) {
+ this.$refs.tree.filter(v)
+ },
+
+ filterNodeMethod (value, data, node) {
+ if (!value) {
+ return true
+ }
+ return this.getHasKeyword(value, node)
+ },
+ getHasKeyword (value, node) {
+
+ if (node.data instanceof Array) {
+ node.data = node.data.length > 0 ? node.data[0] : {}
+ }
+ if (node.data.name && node.data.name.indexOf(value) !== -1) {
+ return true
+ } else {
+ return node.parent && this.getHasKeyword(value, node.parent)
+ }
+ },
fileDialogComit() {
this.loading = true;
axios({
@@ -92,12 +231,92 @@
},
fileView(row) {
this.fileOptionTitle = "鏌ョ湅";
- this.getFileContent(row);
+ if(row.dirType != 'PROGRAM'){
+ this.getFileContent(row);
+ }else{
+ this.getProgramDirFileContent(row);
+ }
},
fileEdit(row) {
this.fileOptionTitle = "缂栬緫";
this.fileRow = {...row};
this.getFileContent(row);
+ },
+ viewHistory(row){
+ this.viewHisModel = true;
+ this.queryHis.machineFileId = row.id;
+ this.onLoadHis();
+ },
+
+ changeName(row){
+ //alert(row.id)
+ this.changeNameForm.id = row.id;
+ this.changeNameForm.name = row.name;
+ this.changeNameModel = true;
+ },
+ changeNameSubmit(form,done){
+ axios.post('/blade-mdm/gkw/node/change-file-name',qs.stringify(form)).then(res=>{
+ if (res.data.code == 200) {
+ this.$message.success('鎿嶄綔鎴愬姛!姝ｅ湪澶勭悊鏂囦欢锛岃绋嶅悗鍒锋柊鏌ョ湅銆�');
+ this.changeNameModel = false;
+ } else {
+ this.$message({ type: 'error', message: res.data.msg });
+ }
+ }).catch(error => {
+ this.$message.error(res.data.msg );
+ }).finally(() => {
+ // 涓嶇鎴愬姛杩樻槸澶辫触锛岄兘寤惰繜 1 绉掑悗鍒锋柊鍒楄〃
+ setTimeout(() => {
+ this.searchTable(this.TreeNode)
+ }, 5000); // 1000 姣 = 1 绉�
+ });;
+
+ done();
+ },
+ searchChangeHis(params, done) {
+ let data = {}
+ console.log(params)
+ this.pageHis.currentPage = 1;
+ let fileId = this.queryHis.machineFileId;
+ params.createTimeBegin = params?.createTime?.[0] || '';
+ params.createTimeEnd = params?.createTime?.[1] || '';
+ data = {
+ createTimeBegin: params.createTimeBegin || undefined,
+ createTimeEnd: params.createTimeEnd || undefined,
+ name: params.name || undefined,
+ machineFileId:fileId,
+ }
+ this.queryHis = data
+ this.onLoadHis();
+ done();
+ },
+ currentChangeHis(currentPage) {
+ this.pageHis.currentPage = currentPage;
+ this.onLoadHis();
+ },
+ sizeChangeHis(pageSize) {
+ this.pageHis.pageSize = pageSize;
+ },
+ refreshChangeHis() {
+ this.onLoadHis();
+ },
+ hisCompare(row){
+ //鏂囦欢姣斿
+ this.loading = true;
+ axios({
+ url: '/blade-mdm/gkw/node/his-compare',
+ method: 'get',
+ params: {id: row.id},
+ }).then(
+ res => {
+ this.loading = false;
+ this.content1 = res.data.data.content1;
+ this.content2 = res.data.data.content2;
+ this.codeDiffFileName1 = "淇敼鍓�";
+ this.codeDiffFileName2 = "淇敼鍚�";
+ this.diffBox = true;
+ }
+ );
},
getFileContent(row) {
this.loading = true;
@@ -113,45 +332,62 @@
}
);
},
+ getProgramDirFileContent(row) {
+ this.loading = true;
+ axios({
+ url: '/blade-mdm/ossfile/file-content',
+ method: 'get',
+ params: {ossFileName:row.ossName},
+ }).then(
+ res => {
+ this.loading = false;
+ this.fileDialogVisible = true;
+ this.fileContent = res.data.data;
+ }
+ );
+ },
onQuery() {
this.size = 10;
this.searchTable(this.TreeNode);
},
sizeChange(size) {
this.size = size;
- this.treeLoad(this.TreeNode);
+ this.searchTable(this.TreeNode);
},
currentChange(current) {
+ //console.log('curr',current)
this.current = current;
- this.treeLoad();
+ this.searchTable();
},
- handleNodeClick(TreeNode,b,c,d) {
+ handleNodeClick(data,node) {
this.fileName = "";
- this.searchTable(TreeNode);
+ this.searchTable(data);
+
+ this.activeNode = data.value
+ this.$emit('node-click', data, node)
},
searchTable(TreeNode) {
this.TreeNode = {...TreeNode};
- if(TreeNode.dirType == 'SEND' || TreeNode.dirType == 'REC' || TreeNode.dirType == 'TEMP') {
- var obj = {
- name: this.fileName,
- dirType: TreeNode.dirType,
- machineCode: TreeNode.machineCode,
- current: this.current,
- size: this.size
- }
- axios({
- url: '/blade-mdm/gkw/node/file-page',
- method: 'get',
- params: obj
- }).then(
- res => {
- this.treecFileData = res.data.data.records;
- this.fileTotal = res.data.data.total;
- }
- )
- }else {
- return;
+ var obj = {
+ name: this.fileName,
+ dirType: this.TreeNode.dirType,
+ nodeType: this.TreeNode.nodeType,
+ nodeId: this.TreeNode.nodeType!='dir'?this.TreeNode.id:undefined,
+ machineCode: this.TreeNode.machineCode,
+ current: this.current,
+ size: this.size
}
+ axios({
+ url: '/blade-mdm/gkw/node/file-page',
+ method: 'get',
+ params: obj
+ }).then(
+ res => {
+ this.treecFileData = res.data.data.records;
+ this.fileTotal = res.data.data.total;
+ }
+ )
+
},
treeLoad () {
axios({
@@ -170,10 +406,35 @@
this.defaultKeys = [res.data.data[firstIndex].id];
}
)
- }
+ },/*
+ sizeChange(size) {
+ this.sizeHis = size;
+ this.onLoad();
+ },*/
+ onLoadHis() {
+ this.loadingHis = true;
+ getFileChangeList(this.pageHis.currentPage, this.pageHis.pageSize, this.queryHis).then(res => {
+ const data = res.data.data
+
+ this.pageHis.total = data.total;
+
+ this.dataHis = data.records;
+ this.loadingHis = false;
+ }, () => {
+ this.dataHis = [];
+ this.loadingHis = false;
+ }).catch(err => {
+ //console.log(err)
+ this.dataHis = [];
+ this.loadingHis = false;
+ });
+ },
},
mounted() {
this.treeLoad();
+ },
+ created(){
+ this.searchTable({});
}
};
</script>
@@ -201,4 +462,10 @@
display: flex;
justify-content: flex-end;
}
+
+
+.has-key-word-style {
+ background-color: #d5ebfc;
+ }
+//https://juejin.cn/post/6997669587495944223
</style>
\ No newline at end of file
--
Gitblit v1.9.3