<template>
|
<div class="uploads_box">
|
<My-bread :list="[
|
`${$t('dataManage.dataManage')}`,
|
`${$t('dataManage.uploadManage')}`,
|
]"></My-bread>
|
<el-divider />
|
<!-- tabs切换 -->
|
<div class="tabs_box">
|
<div
|
class="tabs_pane"
|
@click="setTabsChange()"
|
>
|
<div :class="{ changetabs : active == 'first'}">
|
{{$t('dataManage.uploadObj.dataRelease')}}
|
</div>
|
</div>
|
<div
|
class="tabs_pane"
|
@click="setTabsChange()"
|
>
|
<div :class="{ changetabs : active == 'second'}">
|
{{$t('dataManage.uploadObj.releaseList')}}
|
</div>
|
</div>
|
</div>
|
<div class="content_box">
|
<el-form
|
:inline="true"
|
:model="formInline"
|
class="demo-form-inline"
|
>
|
<!-- 单位 -->
|
<el-form-item>
|
<el-select
|
size="small"
|
v-model="formInline.depid"
|
>
|
<el-option
|
:value="formInline.depid"
|
:label="formInline.depName"
|
style="height: auto"
|
>
|
<el-tree
|
ref="tree"
|
:data="depOption"
|
node-key="id"
|
:props="defaultProps"
|
@node-click="handleDepChange"
|
/>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<!-- 目录 -->
|
<el-form-item>
|
<el-select
|
size="small"
|
v-model="formInline.dirid"
|
>
|
<el-option
|
:value="formInline.dirid"
|
:label="formInline.dirName"
|
style="height: auto"
|
>
|
<el-tree
|
ref="tree"
|
:data="dirOption"
|
node-key="id"
|
:props="defaultProps"
|
@node-click="handleDirChange"
|
/>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<!-- 版本 -->
|
<el-form-item>
|
<el-select
|
size="small"
|
v-model="formInline.verid"
|
@change="handleVerChange"
|
> <el-option
|
v-for="item in verOption"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<!-- 类型 -->
|
<el-form-item>
|
<el-select
|
size="small"
|
v-model="formInline.type"
|
@change="handleTypeChange"
|
>
|
<el-option
|
v-for="item in typeOption"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value"
|
>
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-input
|
size="small"
|
:title="$t('dataManage.vmobj.keyword')"
|
> <i
|
@click="getTableData"
|
:title="$t('common.iquery')"
|
slot="suffix"
|
class="el-icon-search"
|
style="padding-right: 8px"
|
></i></el-input>
|
</el-form-item>
|
<el-form-item style="float:right">
|
<el-button
|
type="info"
|
size="small"
|
@click="setPageStart"
|
icon="el-icon-refresh"
|
>{{$t('common.reset')}}</el-button>
|
</el-form-item>
|
</el-form>
|
|
<div class="dividing-line"></div>
|
<div class="table_box content_Table">
|
<el-table
|
:data="tableData"
|
style="width: 100%"
|
border
|
@selection-change="handleSelectionChange"
|
height="calc(100% - 1px)"
|
>
|
<el-table-column
|
type="selection"
|
width="55"
|
/>
|
<el-table-column
|
:label="$t('dataManage.dictionaryManageObj.number')"
|
type="index"
|
width="50"
|
align="center"
|
>
|
</el-table-column>
|
<el-table-column
|
prop="type"
|
:label="$t('dataManage.vmobj.name')"
|
align="center"
|
/>
|
<el-table-column
|
prop="type"
|
:label="$t('dataManage.vmobj.format')"
|
align="center"
|
/>
|
<el-table-column
|
prop="sizes"
|
:label="$t('dataManage.vmobj.size')"
|
:formatter="stateFormatSizes"
|
align="center"
|
/>
|
<el-table-column
|
prop="depName"
|
:label="$t('dataManage.vmobj.depName')"
|
align="center"
|
/>
|
<el-table-column
|
prop="dirName"
|
:label="$t('dataManage.vmobj.dirName')"
|
width="200"
|
align="center"
|
/>
|
<el-table-column
|
prop="verName"
|
:label="$t('dataManage.vmobj.versionNumber')"
|
align="center"
|
/>
|
<el-table-column
|
prop="uname"
|
:label="$t('dataManage.vmobj.createonuser')"
|
align="center"
|
/>
|
<el-table-column
|
prop="createTime"
|
:label="$t('dataManage.vmobj.createontime')"
|
:formatter="formatData"
|
align="center"
|
/>
|
</el-table>
|
</div>
|
<div
|
class="pagination_box"
|
style="margin-top: 10px"
|
>
|
<el-pagination
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:current-page="listData.pageIndex"
|
:page-sizes="[10, 20, 50, 100]"
|
:page-size="listData.pageSize"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="listData.count"
|
>
|
</el-pagination>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
|
import MyBread from "../../components/MyBread.vue"
|
import { selectdepTab, selectdirTab, meta_selectVerByDirid } from '../../api/api.js'
|
export default {
|
components: { MyBread },
|
data() {
|
return {
|
active: 'first',
|
formInline: {
|
dirid: null,
|
dirName: null,
|
depid: null,
|
verid: null,
|
depName: null,
|
name: "",
|
type: ""
|
},
|
listData: {
|
pageIndex: 1,
|
pageSize: 10,
|
count: 0
|
},
|
depOption: [],
|
dirOption: [],
|
verOption: [],
|
typeOption: [{
|
value: 't1',
|
label: '全部'
|
}, {
|
value: 't2',
|
label: '影像数据(.tif, .img)'
|
}, {
|
value: 't3',
|
label: '场景数据(.mpt)'
|
}, {
|
value: 't4',
|
label: '三维模型(.3dml)'
|
}, {
|
value: 't5',
|
label: '三维模型(.fbx, .ifc, .rvt)'
|
}],
|
defaultProps: {
|
label: "name",
|
value: "id",
|
children: "children",
|
checkStrictly: true,
|
emitPath: false,
|
},
|
}
|
},
|
methods: {
|
|
//单位转换
|
stateFormatSizes(row, column) {
|
if (row.sizes >= 1024) {
|
const val = parseFloat(row.sizes / 1024).toFixed(3)
|
return val + " GB"
|
} else {
|
return row.sizes + " MB"
|
}
|
},
|
//格式化时间
|
formatData(row, column) {
|
let data = row[column.property]
|
if (data == null) {
|
return data
|
}
|
return this.format(data)
|
},
|
//分页切换
|
handleCurrentChange(val) {
|
this.listData.pageIndex = val;
|
this.getTableData();
|
},
|
//每页显示数量
|
handleSizeChange(val) {
|
this.listData.pageSize = val;
|
this.listData.pageIndex = 1;
|
this.getTableData();
|
},
|
//tabs切換
|
setTabsChange() {
|
switch (this.active) {
|
case 'first':
|
this.active = 'second';
|
this.setPageStart();
|
break;
|
case 'second':
|
this.active = 'first';
|
this.setPageStart();
|
break;
|
|
}
|
},
|
//页面初始化
|
setPageStart() {
|
this.formInline = {
|
dirid: null,
|
dirName: null,
|
depid: null,
|
verid: null,
|
depName: null,
|
name: "",
|
type: ""
|
}
|
this.listData = {
|
pageIndex: 1,
|
pageSize: 10,
|
count: 0
|
}
|
this.formInline.type = this.typeOption[0].value;
|
this.getDepTreeList();
|
this.getDirTreeList();
|
},
|
//获取目录列表
|
async getDirTreeList() {
|
const data = await selectdirTab();
|
if (data.code != 200) {
|
this.$message.error("单位列表获取失败")
|
return
|
}
|
this.dirOption = this.treeData(data.result);
|
this.formInline.dirid = this.dirOption[0].id;
|
this.formInline.dirName = this.dirOption[0].name;
|
this.getVerList()
|
},
|
//获取版本列表
|
async getVerList() {
|
const data = await meta_selectVerByDirid({ dirid: this.formInline.dirid })
|
if (data.code != 200) {
|
this.$message.error("版本列表获取失败")
|
return
|
}
|
this.verOption = data.result
|
this.formInline.verid = data.result[0].id;
|
this.getTableData();
|
},
|
//版本列表切换
|
handleVerChange(value) {
|
this.formInline.verid = value;
|
this.getTableData();
|
},
|
//服务类型列表切换
|
handleTypeChange(value) {
|
this.formInline.type = value;
|
this.getTableData();
|
},
|
//单位列表切换
|
handleDepChange(data, node, nodeData) {
|
this.formInline.depid = data.id
|
this.formInline.depName = data.name
|
this.getTableData();
|
},
|
//单位列表切换
|
handleDirChange(data, node, nodeData) {
|
this.formInline.dirid = data.id
|
this.formInline.dirName = data.name
|
this.getVerList()
|
},
|
//获取Table表格数据
|
getTableData() {
|
|
},
|
//获取单位列表
|
async getDepTreeList() {
|
const data = await selectdepTab();
|
if (data.code != 200) {
|
this.$message.error("单位列表获取失败")
|
return
|
}
|
this.depOption = this.treeData(data.result);
|
this.formInline.depid = this.depOption[0].id
|
this.formInline.depName = this.depOption[0].name
|
},
|
//树列表生成
|
treeData(source) {
|
let cloneData = JSON.parse(JSON.stringify(source)) // 对源数据深度克隆
|
return cloneData.filter(father => {
|
// 循环所有项
|
let branchArr = cloneData.filter(child => father.id == child.pid) // 对比ID，分别上下级菜单，并返回数据
|
branchArr.length > 0 ? (father.children = branchArr) : "" // 给父级添加一个children属性，并赋值
|
return father.pid == 0 // 返回一级菜单
|
})
|
},
|
},
|
mounted() {
|
this.active = 'first';
|
this.setPageStart();
|
}
|
}
|
</script>
|
|
<style lang="less" scoped>
|
.uploads_box {
|
width: calc(100% - 20px);
|
height: calc(100% - 20px);
|
padding: 10px;
|
.tabs_box {
|
width: 100%;
|
border-bottom: 2px solid #e4e7ed;
|
margin-bottom: 10px;
|
}
|
.tabs_pane {
|
padding: 0 10px;
|
height: 40px;
|
box-sizing: border-box;
|
line-height: 40px;
|
display: inline-block;
|
list-style: none;
|
font-size: 14px;
|
font-weight: 500;
|
color: #303133;
|
}
|
.tabs_pane:hover {
|
color: #409eff;
|
}
|
.changetabs {
|
color: #409eff;
|
|
border-bottom: 2px solid #409eff;
|
}
|
.tabs_nav {
|
width: 100%;
|
height: 2px;
|
background: #e4e7ed;
|
}
|
.content_box {
|
width: 100%;
|
height: calc(100% - 90px);
|
/deep/.el-form-item {
|
margin-bottom: 15px;
|
}
|
.content_Table {
|
height: calc(100% - 110px);
|
}
|
}
|
}
|
</style>
|
