<!--
|
* @Author: 李喆(开发组) lzhe@yxqiche.com
|
* @Date: 2025-08-11 09:25:36
|
* @LastEditors: 李喆(开发组) lzhe@yxqiche.com
|
* @LastEditTime: 2025-08-12 17:43:58
|
* @FilePath: /mdmweb/src/views/wel/gongkong.vue
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
-->
|
<template>
|
<div class="gongkongMain">
|
<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>
|
<el-col :span="6" style="margin-right: 12px;">
|
<el-input v-model="fileName" clearable placeholder="文件名称"/>
|
</el-col>
|
<el-col :span="12">
|
<el-button type="primary" @click="onQuery">查询</el-button>
|
</el-col>
|
</el-row>
|
<el-table :data="treecFileData" style="width: 100%">
|
<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" 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>
|
<div class="paginationTree">
|
<el-pagination layout="prev, pager, next" :total="fileTotal" @size-change="sizeChange" @current-change="currentChange" />
|
</div>
|
</div>
|
</div>
|
<el-dialog v-model="fileDialogVisible" :title="fileOptionTitle" width="800">
|
<div><el-input v-model="fileContent" :rows="15" type="textarea" :disabled="fileOptionTitle == '查看'"/></div>
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button @click="fileDialogVisible = false">关闭</el-button>
|
<el-button type="primary" @click="fileDialogComit" v-if="fileOptionTitle != '查看'">提交</el-button>
|
</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: "",
|
fileDialogVisible: false,
|
fileName: "",
|
treeData: [],
|
defaultProps: {
|
children: 'children',
|
label: 'name',
|
isLeaf: (data) => !data.hasChildren
|
},
|
current: 1,
|
size: 10,
|
fileTotal: 0,
|
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: {},
|
watch: {
|
|
},
|
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({
|
url: '/blade-mdm/gkw/node/file-save',
|
method: 'post',
|
params: {id:this.fileRow.id,content: this.fileContent},
|
}).then(
|
res => {
|
this.loading = false;
|
this.fileDialogVisible = false;
|
this.$message.success("操作成功");
|
}
|
);
|
},
|
fileView(row) {
|
this.fileOptionTitle = "查看";
|
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;
|
axios({
|
url: '/blade-mdm/gkw/node/file-content',
|
method: 'get',
|
params: {id:row.id},
|
}).then(
|
res => {
|
this.loading = false;
|
this.fileDialogVisible = true;
|
this.fileContent = res.data.data;
|
}
|
);
|
},
|
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.searchTable(this.TreeNode);
|
},
|
currentChange(current) {
|
//console.log('curr',current)
|
this.current = current;
|
this.searchTable();
|
},
|
handleNodeClick(data,node) {
|
this.fileName = "";
|
this.searchTable(data);
|
|
this.activeNode = data.value
|
this.$emit('node-click', data, node)
|
},
|
searchTable(TreeNode) {
|
this.TreeNode = {...TreeNode};
|
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({
|
url: '/blade-mdm/gkw/node/load-tree',
|
method: 'get',
|
}).then(
|
res => {
|
this.treeData = res.data.data;
|
var firstIndex = 0;
|
res.data.data.forEach((item,index)=> {
|
if(item.children.length != 0) {
|
firstIndex = index;
|
}
|
})
|
//defaultKeys.push(item.id);
|
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>
|
|
<style lang="scss">
|
.gongkongMain {
|
display: flex;
|
padding: 0px;
|
margin: 0px 7px 10px 7px;
|
background-color: #fff;
|
border-top: 1px solid #ccc;
|
> div {
|
padding: 12px;
|
}
|
}
|
.gongkongMain > div:nth-child(1) {
|
width:25%;
|
border-right: 1px solid #ccc;
|
}
|
.gongkongMain div:nth-child(2) {
|
flex: 1;
|
}
|
.paginationTree {
|
margin-top: 12px;
|
display: flex;
|
justify-content: flex-end;
|
}
|
|
|
.has-key-word-style {
|
background-color: #d5ebfc;
|
}
|
//https://juejin.cn/post/6997669587495944223
|
</style>
|
