<template>
|
<div style="height: 100%;">
|
<el-tabs ref="tabs" type="border-card" v-model="activeName" style="height: 100%;" @tab-click="fileHandleClick" @contextmenu.prevent.native="">
|
<el-tab-pane name="first" label="文档属性">
|
<el-row id="nodeInfoTable" :style="tabStyle">
|
<table class="el-table one_list">
|
<tr>
|
<td>文档名称：</td>
|
<td colspan="3">{{nodeList.list.docName}}</td>
|
</tr>
|
<tr>
|
<td>代码版本：</td>
|
<td>{{nodeList.list.docAlias}}</td>
|
</tr>
|
<tr>
|
<td>设备编号：</td>
|
<td>{{nodeList.list.docCode}}</td>
|
</tr>
|
<tr>
|
<td>文档后缀：</td>
|
<td>{{nodeList.list.docSuffix}}</td>
|
</tr>
|
<tr>
|
<td>文档状态：</td>
|
<td>{{productStatusMap[nodeList.list.docStatus]}}</td>
|
</tr>
|
<tr>
|
<td>系统指定版本：</td>
|
<td>{{nodeList.list.publishVersion}}</td>
|
</tr>
|
<tr>
|
<td>出库状态：</td>
|
<td>{{pullStatusMap[nodeList.list.pullStatus]}}</td>
|
</tr>
|
<tr>
|
<td>出库人：</td>
|
<td>{{nodeList.list.pullUser}}</td>
|
</tr>
|
<tr>
|
<td>描述：</td>
|
<td>{{nodeList.list.description}}</td>
|
</tr>
|
</table>
|
</el-row>
|
</el-tab-pane>
|
<el-tab-pane id="docPreview" name="second" label="预览">
|
<el-row :style="tabStyle">
|
<div v-if="ncDocSuffix ==='pdf'" class="pdf">
|
<iframe :src="pdfUrl" frameborder="0" style="width: 100%;height: calc(100% - 5px)"></iframe>
|
</div>
|
<div v-else-if="ncDocSuffix !='pdf'" style="height: calc(100% - 10px)">
|
<textarea id = "ncFileInfo" style="width:99%; height: 100%; margin: auto" readonly></textarea>
|
</div>
|
</el-row>
|
</el-tab-pane>
|
<el-tab-pane name="third" label="文档版本" >
|
<el-table
|
id="docEdition"
|
:data="fileList"
|
border
|
class="show_table"
|
:row-class-name="current_class"
|
highlight-current-row
|
v-loading="listLoading"
|
@row-contextmenu="fileRigClick"
|
:style="conheight"
|
:height="conheight.height"
|
style="width: 100%">
|
<el-table-column
|
type="index"
|
label="序号"
|
width="50" align="center">
|
</el-table-column>
|
<el-table-column prop="fileName" label="文件名称" class-name="left">
|
<template slot-scope="scope" >
|
{{scope.row.fileName}} {{scope.row.docVersion==fileList_current?'(当前版本)':''}}
|
</template>
|
</el-table-column>
|
<el-table-column prop="docVersion" label="版本号" align="center">
|
</el-table-column>
|
<el-table-column prop="fileSize" label="文件大小" class-name="right">
|
<template slot-scope="scope">{{(scope.row.fileSize/1024).toFixed(2)}}KB </template>
|
</el-table-column>
|
</el-table>
|
</el-tab-pane>
|
<el-tab-pane id="usedLog" name="fourth" label="使用设备">
|
<el-table
|
:data="deviceList"
|
class="show_table"
|
border
|
v-loading="listLoading"
|
style="width: 100%;height: 100%;">
|
<el-table-column
|
type="index"
|
width="50" label="序号" align="center">
|
</el-table-column>
|
<el-table-column prop="deviceName" label="设备名称" class-name="left">
|
</el-table-column>
|
<el-table-column prop="deviceNo" label="设备编号" class-name="left">
|
</el-table-column>
|
<el-table-column prop="deviceModel" label="设备型号" class-name="left">
|
</el-table-column>
|
<el-table-column prop="departName" label="所属部门" class-name="left">
|
</el-table-column>
|
<el-table-column prop="groupName" label="设备分组" class-name="left">
|
</el-table-column>
|
<el-table-column prop="controlSystem" label="控制系统" class-name="left">
|
</el-table-column>
|
</el-table>
|
</el-tab-pane>
|
<el-tab-pane id="auditingLog" name="fifth" label="审批记录">
|
<el-table
|
:data="activitList"
|
class="show_table"
|
border
|
v-loading="listLoading"
|
:height="actHeight"
|
style="width: 100%;">
|
<el-table-column
|
type="index"
|
width="50" label="序号" align="center">
|
</el-table-column>
|
<el-table-column prop="deviceName" label="指派设备" class-name="left">
|
</el-table-column>
|
<el-table-column prop="applyUser" label="申请人" class-name="left">
|
</el-table-column>
|
<el-table-column prop="applyReason" label="申请原因" class-name="left">
|
</el-table-column>
|
<el-table-column prop="applyTime" label="申请时间" >
|
</el-table-column>
|
<el-table-column prop="approveUser" label="审批人" class-name="left">
|
</el-table-column>
|
<el-table-column prop="approveContent" label="审批意见" class-name="left">
|
</el-table-column>
|
<el-table-column prop="approveTime" label="审批时间" align="center">
|
</el-table-column>
|
<el-table-column prop="status" label="审批结果" align="center">
|
<template slot-scope="scope">
|
{{scope.row.status == '2' ? '通过':'驳回'}}
|
</template>
|
</el-table-column>
|
</el-table>
|
<el-pagination
|
@size-change="handleSizeChange"
|
@current-change="handlePageChange"
|
:current-page="pageData.page"
|
:page-sizes="pageData.pageSizeArr"
|
:page-size="pageData.size"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="pageData.total">
|
</el-pagination>
|
</el-tab-pane>
|
|
</el-tabs>
|
<div class="otherFileRightMenu">
|
<FileContextMenu
|
@showRelativeDialog="showRelativeDialog"
|
@fileAssignVersion="fileAssignVersion"
|
ref="FileContextMenu"
|
></FileContextMenu>
|
</div>
|
<el-dialog :visible.sync="relativeVisible" title="文件版本比对" :close-on-click-modal="false" @close="relativeDialogClose" width="680px">
|
<el-table
|
:data="fileList"
|
border
|
ref="multipleTable"
|
@select="fileSelect"
|
@select-all="selectAll"
|
highlight-current-row
|
v-loading="listLoading"
|
height="400px"
|
style="width: 100%">
|
<el-table-column
|
type="selection"
|
width="55">
|
</el-table-column>
|
<el-table-column
|
type="index"
|
label="序号"
|
width="50" align="center">
|
</el-table-column>
|
<el-table-column prop="fileName" label="文件名称" class-name="left">
|
<template slot-scope="scope" >
|
{{scope.row.fileName}} {{scope.row.docVersion==fileList_current?'(当前版本)':''}}
|
</template>
|
</el-table-column>
|
<el-table-column prop="docVersion" label="版本号" align="center">
|
</el-table-column>
|
</el-table>
|
<div slot="footer" class="dialog-footer">
|
<el-button @click.native="queryFileComparison" :loading="buttonLoading" type="primary" class="btn-custom">
|
<span>确 定</span>
|
</el-button>
|
<el-button @click="relativeDialogClose" class="btn-custom">
|
<span>取 消</span>
|
</el-button>
|
</div>
|
</el-dialog>
|
<el-dialog :visible.sync="relativeDivVisible" title="文件版本比对" :close-on-click-modal="false" @close="relativeDialogClose" width="100%">
|
<el-row v-if="fileSelections.length === 2">
|
<el-col v-if="fileSelections[0].docVersion" style="color: #077ca9" :span="12">版本号：{{fileSelections[0].docVersion}}</el-col>
|
<el-col v-if="fileSelections[1].docVersion" style="color: #077ca9" :span="12">版本号：{{fileSelections[1].docVersion}}</el-col>
|
</el-row>
|
<el-row :style="dialogStyle">
|
<div>
|
<code-diff :old-string="oldVal" :new-string="newVal" :outputFormat="outputFormat" style="height:100%; overflow:auto" />
|
</div>
|
</el-row>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import FileContextMenu from '@/module/productManager/components/fileContextMenu.vue'
|
import Bus from './bus.js'
|
import CodeDiff from 'vue-code-diff'
|
import * as productApi from '../api/product'
|
import utilApi from '@/common/utils'
|
import * as systemApi from '../../../base/api/system'
|
export default {
|
name: "file_attribute_info",
|
props:['nodeList'],
|
components:{
|
FileContextMenu,
|
Bus,
|
CodeDiff
|
},
|
computed:{
|
pullStatusMap: function() {
|
let localeMap = JSON.parse(localStorage.getItem('pullStatusMap'));
|
if(!localeMap) {
|
return {};
|
}else {
|
return localeMap;
|
}
|
},
|
productStatusMap:function() {
|
let localeMap = JSON.parse(localStorage.getItem('productStatusMap'));
|
if(!localeMap) {
|
return {};
|
}else {
|
return localeMap;
|
}
|
},
|
},
|
data(){
|
return {
|
buttonLoading:false,
|
relativeVisible:false,
|
relativeDivVisible:false,
|
listLoading:false,
|
filelist_reload:true,
|
activeName: 'first',
|
ncDocSuffix:'',
|
user_name:'',
|
fileList:[],
|
pdfUrl:'',
|
user_list:'',
|
activitList:[],
|
deviceList:[],
|
rightClickRow:'',
|
conheight:{
|
height:'',
|
overflow:'auto'
|
},
|
actHeight:'',
|
devHeight:'',
|
tabStyle:{
|
height:'calc(100% - 100px)',
|
overflow:'auto',
|
},
|
dialogStyle:{
|
height:'',
|
overflow: 'auto'
|
},
|
textareaStyle:{
|
height:''
|
},
|
frameHeight:'',
|
pageData : {
|
page:1,
|
size : 10,
|
total:0,
|
pageSizeArr:[10, 20, 40]
|
},
|
fileQueryParam:{
|
docId:''
|
},
|
contextQueryParams:{
|
flag:2, //查询按钮的范围 1 菜单 2 对象
|
param:'file', //查询参数，按类型而不同 1 菜单路径 2 对象权限码
|
objectId:null, //flag 为2时需要传递该参数 该参数与param对应数据id
|
relativeObjectId:null, //param 为process,document,file 时需要传该参数 该参数为关联树节点的id
|
relativeParam:null, //param 为process,document,file 时需要传该参数 该参数为关联树节点的对象权限码
|
},
|
fileList_current:'',
|
fileSelections:[],
|
oldVal: '',
|
newVal: '',
|
context: 10,
|
outputFormat: 'side-by-side'
|
}
|
},
|
methods:{
|
showRelativeDialog(){
|
this.relativeVisible = true;
|
},
|
current_class({row, rowIndex}){
|
if(row.docVersion==this.fileList_current){
|
return 'iscurrent_version'
|
}
|
},
|
fileSelect(selection, row) {
|
// 选择项大于2时
|
this.fileSelections = selection;
|
if (selection.length > 2) {
|
let del_row = selection.shift();
|
this.fileSelections = selection;
|
this.$refs.multipleTable.toggleRowSelection(del_row, false); // 用于多选表格，切换某一行的选中状态，如果使用了第二个参数，则是设置这一行选中与否（selected 为 true 则选中）
|
}
|
},
|
|
selectAll(selection) {
|
// 选择项大于2时
|
|
if (selection.length > 2) {
|
|
selection.length = 2;
|
|
}
|
|
},
|
fileHandleClick(tab, event){
|
if (tab.name == 'second') {
|
this.ncDocSuffix = this.nodeList.list.docSuffix;
|
this.previewNCFileInfo();
|
this.getTabHeight();
|
}
|
},
|
handleSizeChange(val) {
|
this.pageData.size = val;
|
this.queryActivitList();
|
},
|
handlePageChange(val){
|
this.pageData.page = val;
|
this.queryActivitList();
|
},
|
queryFileList(){
|
this.fileQueryParam.docId = this.nodeList.list.docId;
|
productApi.query_file_list( this.fileQueryParam).then((res)=>{
|
if (res.success) {
|
this.fileList = res.list;
|
this.fileList_current=this.nodeList.list.publishVersion;
|
}
|
})
|
},
|
queryActivitList(){
|
productApi.getActivitList(this.pageData.page, this.pageData.size, this.nodeList.list.docId).then((res) => {
|
if (res.success) {
|
this.pageData.total = res.page.total;
|
this.activitList = res.page.records;
|
}
|
});
|
},
|
queryRelativeDevice(){
|
productApi.relative_device(this.nodeList.list.docId).then((res) => {
|
if (res.success) {
|
this.deviceList = res.list;
|
}
|
});
|
},
|
queryFileComparison(){
|
if (this.fileSelections.length < 2) {
|
this.$message({
|
message: "请勾选两个版本比对",
|
type: 'warning'
|
});
|
}else {
|
this.$confirm('确认提交吗？', '提示', {}).then(() => {
|
this.relativeDivVisible = true;
|
this.buttonLoading = true;
|
let firstFileId = this.fileSelections[0].fileId;
|
let secondFileId = this.fileSelections[1].fileId;
|
productApi.file_comparison(firstFileId,secondFileId).then((res) => {
|
if (res.success) {
|
this.buttonLoading = false;
|
this.$message({
|
message: res.message,
|
type: 'success'
|
});
|
let oldValue = '';
|
res.data.first.forEach((val,k) =>{
|
oldValue += val;
|
if (k != res.data.first.length - 1) {
|
oldValue += '\n';
|
}
|
});
|
let newValue = '';
|
res.data.second.forEach((val,k) =>{
|
newValue += val;
|
if (k != res.data.second.length - 1) {
|
newValue += '\n';
|
}
|
});
|
this.oldVal = oldValue;
|
this.newVal = newValue;
|
} else if (res.message) {
|
this.buttonLoading = false;
|
this.$message({
|
message: res.message,
|
type:'error'
|
});
|
}
|
});
|
});
|
}
|
},
|
getHeight(){
|
this.conheight.height=window.innerHeight-515+'px';
|
this.dialogStyle.height = window.innerHeight *0.65 + 'px';
|
this.actHeight=window.innerHeight-520;
|
//this.devHeight = window.innerHeight-500;
|
},
|
getTabHeight(){
|
let h = document.getElementById('attributeTab').offsetHeight;
|
this.tabStyle.height = h-100+'px';
|
/*this.frameHeight = h-105;
|
this.textareaStyle.height = h-110+'px';*/
|
},
|
fileRigClick(row, column, event){
|
if (row != undefined) {
|
this.rightClickRow = row;
|
this.contextQueryParams.objectId = this.nodeList.nodeObjId;
|
this.contextQueryParams.relativeObjectId = this.nodeList.nodeObjId;
|
if (this.nodeList.nodeObjType == 1) {
|
this.contextQueryParams.relativeParam ='product';
|
}else if (this.nodeList.nodeObjType== 2) {
|
this.contextQueryParams.relativeParam ='component';
|
}else if (this.nodeList.nodeObjType == 3) {
|
this.contextQueryParams.relativeParam ='parts';
|
}
|
this.$refs.FileContextMenu.fileRightClick(row, column, event,this.contextQueryParams)
|
}
|
},
|
fileAssignVersion(){
|
let fileId = this.rightClickRow.fileId;
|
productApi.file_version(fileId).then((res) =>{
|
if(res.success){
|
this.$message({
|
message: res.message,
|
type: 'success'
|
});
|
this.fileList_current=this.rightClickRow.docVersion;
|
Bus.$emit('queryNCDoc');
|
this.queryActivitList();
|
}else{
|
this.$message({
|
message: res.message,
|
type: 'error'
|
});
|
}
|
})
|
},
|
previewNCFileInfo(){
|
let docSuffix = this.nodeList.list.docSuffix;
|
this.ncDocSuffix = docSuffix;
|
let fileId = this.nodeList.list.docId;
|
if (docSuffix === 'pdf') {
|
this.getPdfFileInfo(fileId);
|
}else {
|
this.getNCFileInfo(fileId);
|
}
|
},
|
getNCFileInfo(fileId){
|
productApi.file_preview(fileId).then((res) =>{
|
document.getElementById('ncFileInfo').innerHTML = '';
|
if (res.success && res.list) {
|
let str = '';
|
res.list.forEach((val,k) =>{
|
str += val;
|
if (k != res.list.length - 1) {
|
str += '\n';
|
}
|
});
|
document.getElementById('ncFileInfo').innerHTML = str;
|
}else{
|
this.$message({
|
message: res.message,
|
type: 'error'
|
});
|
/*if (docSuffix == 'txt') {
|
let url = window.URL.createObjectURL(new Blob([res]));
|
document.getElementById('ncFileInfo').innerHTML = '读取中...';
|
let xmlHttpReq = null;
|
if(window.ActiveXObject){
|
xmlHttpReq = new ActiveXObject('Microsoft.XMLHTTP');
|
}else if(window.XMLHttpRequest){
|
xmlHttpReq = new XMLHttpRequest();
|
}
|
xmlHttpReq.open('GET',url,true);
|
xmlHttpReq.overrideMimeType("text/html;charset= gb2312");//设定以gb2312编码识别数据
|
xmlHttpReq.onreadystatechange = RequestCallBack;
|
xmlHttpReq.send();
|
function RequestCallBack() {
|
if(xmlHttpReq.readyState ===4){
|
if(xmlHttpReq.status === 200){
|
document.getElementById('ncFileInfo').innerHTML = xmlHttpReq.responseText;
|
}
|
}
|
}
|
}*/
|
}
|
})
|
},
|
getPdfFileInfo(fileId){
|
productApi.file_preview_pdf(fileId).then((res) =>{
|
let url = window.URL.createObjectURL(new Blob([res],{type:"application/zip"}));
|
this.pdfUrl = './static/pdf/web/viewer.html?file='+encodeURIComponent(url);
|
})
|
},
|
relativeDialogClose(){
|
this.relativeVisible = false;
|
this.relativeDivVisible = false;
|
this.queryFileList();
|
},
|
//是否启用审批记录
|
getEnableFlag(){
|
productApi.enable_flag().then((res) =>{
|
if (res.success) {
|
if (!res.data) {
|
this.$nextTick(function () {
|
this.$refs.tabs.$children[0].$refs.tabs[4].style.display = 'none';
|
})
|
}
|
}
|
})
|
}
|
},
|
created(){
|
this.getEnableFlag();
|
window.addEventListener('resize', this.getHeight);
|
this.getHeight();
|
window.addEventListener('resize', this.getTabHeight);
|
//this.getTabHeight();
|
Bus.$off('queryFileList');
|
Bus.$on("queryFileList",()=>{
|
this.queryFileList()
|
});
|
Bus.$off('queryActivitList');
|
Bus.$on("queryActivitList",()=>{
|
this.queryActivitList()
|
});
|
},
|
//监听
|
watch:{
|
nodeList:{
|
deep: true, // 深度监听
|
handler:function(newValue, oldValue) {
|
this.queryFileList();
|
this.queryActivitList();
|
this.queryRelativeDevice();
|
this.activeName = 'first';
|
// this.user_name=this.user_info(newValue.list.pullUser);
|
},
|
},
|
fileList:{
|
deep: true, // 深度监听
|
handler:function(newValue, oldValue) {
|
if (newValue.length-oldValue.length==1&&oldValue.length>0) {
|
if(newValue[0].docId==oldValue[0].docId){
|
this.fileList_current=newValue[0].docVersion
|
}
|
}
|
}
|
},
|
},
|
mounted() {
|
//默认查询页面
|
this.queryFileList();
|
this.queryActivitList();
|
this.queryRelativeDevice();
|
// this.user_name=this.user_info(this.nodeList.list.pullUser);
|
}
|
}
|
</script>
|
|
<style>
|
.el-tabs__content{
|
overflow: inherit;
|
}
|
.otherFileRightMenu{
|
position: absolute;
|
top: 0;
|
height: 100%;
|
}
|
|
/* .el-tabs--border-card>.el-tabs__content {
|
padding-bottom:0 ;
|
overflow: auto;
|
} */
|
|
</style>
|
