<template>
|
<Popup ref="pop"
|
:title="title"
|
@close="close(true)"
|
width="400px"
|
@cancel="close(false)"
|
top="0vh"
|
left="30vh">
|
<el-tabs v-model="activeName"
|
@tab-click="handleClick">
|
<el-tab-pane label="属性"
|
name="first">
|
<el-form ref="form"
|
:model="formInline"
|
label-width="80px">
|
<el-form-item :label="$t('common.name')">
|
{{formInline.name}}
|
</el-form-item>
|
<el-form-item :label="$t('common.type')">
|
|
{{formInline.type}}
|
</el-form-item>
|
|
<el-form-item :label="$t('common.bak')">
|
|
{{formInline.bak}}
|
</el-form-item>
|
|
</el-form>
|
|
</el-tab-pane>
|
<el-tab-pane label="附件"
|
name="second">
|
|
<el-table :data="tableData"
|
ref="filterTable"
|
height="calc(100% - 130px)"
|
border
|
style="width: 100%"
|
@selection-change="handleAttatchChange">
|
<el-table-column type="selection"
|
width="70" />
|
<el-table-column width="60"
|
type="index"
|
:label="$t('common.index')" />
|
<el-table-column prop="name"
|
:label="$t('common.name')" />
|
|
<el-table-column prop="sizes"
|
:label="$t('common.size')"
|
:formatter="statSizeChange" />
|
<el-table-column align="center"
|
:label="$t('common.operate')"
|
min-width="100">
|
<template slot-scope="scope">
|
<el-link v-if="matchState(scope, /[]/)"
|
@click="setAttatchDetail(scope.$index, scope.row)"
|
class="elLink">{{ $t('common.see') }}</el-link>
|
|
</template>
|
</el-table-column>
|
</el-table>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
<el-dialog title="预览"
|
:append-to-body="false"
|
:visible.sync="dialog.dialogVisible"
|
width="70%"
|
:modal="false"
|
:close-on-click-modal="false">
|
<div v-if="dialog.isPdf"
|
class="pdfClass">
|
<iframe :src="dialog.src"
|
type="application/x-google-chrome-pdf"
|
width="100%"
|
height="100%">
|
</iframe>
|
</div>
|
<div v-if="dialog.isJpg"
|
class="pdfClass">
|
|
<el-image style="width:100%; height:100%"
|
:src="dialog.src"
|
:preview-src-list="[dialog.src]">
|
</el-image>
|
|
</div>
|
</el-dialog>
|
</Popup>
|
</template>
|
|
<script>
|
|
import Popup from "./Popup";
|
import { comprehensive_selectFiles,comprehensive_selectModelByGuid,meta_selectConvertToDwg } from '../../api/api.js'
|
import { getToken } from "@/utils/auth";
|
|
export default {
|
name: "ModelProperty",
|
components: {
|
Popup,
|
},
|
mixins: [],
|
data () {
|
return {
|
title: "在线地图",
|
left: undefined,
|
tokne: "",
|
data: {
|
|
},
|
mapCollection: undefined,
|
formInline: {
|
title: '',
|
file: '',
|
name: '',
|
type: '',
|
info: '',
|
icon: '',
|
bak: ''
|
},
|
activeName: 'first',
|
tableData: [],
|
dialog: {
|
dialogVisible: false,
|
isPdf: false,
|
isJpg: false,
|
src: ''
|
},
|
attacgSelection: []
|
};
|
},
|
computed: {
|
|
},
|
methods: {
|
|
// 关闭弹窗
|
close (isCloseBtn,removeLayer=true) {
|
// removeLayer && this.removeImageLayer();
|
|
// 重置data值
|
Object.assign(this.$data,this.$options.data());
|
!isCloseBtn&&this.$refs.pop.close();
|
},
|
// 打开弹窗
|
async open () {
|
|
this.close(true);
|
|
this.$refs.pop.open();
|
this.title=this.$store.state.catModelInfo.name;
|
|
this.formInline=this.$store.state.catModelInfo;
|
|
},
|
|
// changeToken(token) {
|
// this.mapCollection.tokne = token;
|
// },
|
// 附件=>表格选择
|
handleAttatchChange (val) {
|
this.attacgSelection=val;
|
},
|
statSizeChange (row,column) {
|
return this.stateFormatSizes(row.sizes)
|
},
|
stateFormatSizes (res) {
|
if(res>=1024) {
|
const val=parseFloat(res/1024).toFixed(3);
|
return val+' GB';
|
} else {
|
return res+' MB';
|
}
|
},
|
matchState (state="",reg) {
|
var row=state.row;
|
var name=row.name;
|
if(
|
name.indexOf('.pdf')!=-1
|
||name.indexOf('.jpg')!=-1
|
||name.indexOf('.gif')!=-1
|
||name.indexOf('.png')!=-1
|
||name.indexOf('.jpeg')!=-1
|
||name.indexOf('.PDF')!=-1
|
||name.indexOf('.JPG')!=-1
|
||name.indexOf('.GIF')!=-1
|
||name.indexOf('.PNG')!=-1
|
||name.indexOf('.JPEG')!=-1
|
||name.indexOf('.BMP')!=-1
|
||name.indexOf('.bmp')!=-1
|
||name.indexOf('.dwg')!=-1
|
) {
|
return true;
|
}
|
return false;
|
},
|
handleClick (tab,event) {
|
if(tab.name=="second") {
|
this.getAttacthFlieList();
|
}
|
},
|
|
//附件列表查询
|
async getAttacthFlieList () {
|
var obj={
|
eventid: this.$store.state.catModelInfo.id,
|
tabName: "lf.sys_style"
|
};
|
const res=await comprehensive_selectFiles(obj);
|
if(res.code!=200) {
|
this.$message.error('列表调用失败');
|
return
|
}
|
this.tableData=res.result;
|
},
|
|
//附件查看
|
setAttatchDetail (index,row) {
|
this.refreshAttatchDetail()
|
var name=row.name;
|
if(name.indexOf('.pdf')!=-1||name.indexOf('.PDF')!=-1) {
|
this.dialog.dialogVisible=true;
|
this.dialog.isPdf=true;
|
var url=BASE_URL+"/comprehensive/downloadForView?guid="+row.guid+"&token="+getToken();
|
this.dialog.src=url
|
} else if(
|
name.indexOf('.jpg')!=-1
|
||name.indexOf('.gif')!=-1
|
||name.indexOf('.png')!=-1
|
||name.indexOf('.jpeg')!=-1
|
||name.indexOf('.JPG')!=-1
|
||name.indexOf('.GIF')!=-1
|
||name.indexOf('.PNG')!=-1
|
||name.indexOf('.JPEG')!=-1
|
||name.indexOf('.BMP')!=-1
|
||name.indexOf('.bmp')!=-1
|
||name.indexOf('.BMP')!=-1) {
|
this.dialog.dialogVisible=true;
|
this.dialog.isJpg=true;
|
var url=BASE_URL+"/comprehensive/downloadForView?guid="+row.guid+"&token="+getToken();
|
this.dialog.src=url
|
} else if(name.indexOf('.dwg')!=-1) {
|
this.handleCAD(row)
|
}
|
},
|
async handleCAD (row) {
|
const data=await meta_selectConvertToDwg({ id: row.id,type: true });
|
if(data.result) {
|
var url=iisHost+"/dwg/cad/browse/?file=data/"+data.result;
|
window.open(url)
|
} else {
|
return this.$message("数据转换失败,无法预览");
|
}
|
|
},
|
refreshAttatchDetail () {
|
this.dialog.src="";
|
this.dialog.dialogVisible=false;
|
this.dialog.isPdf=false;
|
this.dialog.isJpg=false;
|
},
|
},
|
mounted () {
|
|
}
|
};
|
</script>
|
|
<style scoped lang="less">
|
.pdfClass {
|
height: 63vh;
|
width: 100%;
|
}
|
</style>
|