<template>
|
<div class="verSionBox ">
|
<My-bread :list="[
|
`${$t('dataManage.dataManage')}`,
|
`${$t('dataManage.projectManage')}`,
|
]"></My-bread>
|
<el-divider />
|
<div class="verSionContent">
|
<div
|
class="verSion_leftTree subpage_Div"
|
style="border: 1px solid #dcdfe6;"
|
>
|
<el-form
|
:inline="true"
|
class="demo-form-inline"
|
>
|
<el-form-item>
|
<el-input
|
size="small"
|
v-model="filterInput"
|
style="width: 200px"
|
:placeholder="$t('shuJuGuanLi.shuJuJianSuo.valueone')"
|
suffix-icon="el-icon-search"
|
></el-input>
|
</el-form-item>
|
<el-form-item>
|
<el-button
|
v-if="btnStatus.insert"
|
icon="el-icon-plus"
|
@click="insertProject"
|
:disabled="count1 != 0 ? true : false"
|
type="success"
|
size="small"
|
>{{ $t("common.increase") }}</el-button>
|
</el-form-item>
|
|
</el-form>
|
<el-tree
|
ref="tree"
|
:props="defaultProps"
|
node-key="id"
|
:data="dirList"
|
:expand-on-click-node="false"
|
:default-expand-all="false"
|
draggable
|
@node-click="handleNodeClick"
|
:filter-node-method="filterNode"
|
>
|
</el-tree>
|
</div>
|
<div class="verSion_rightContent subpage_Div">
|
<!--
|
<!-- <el-divider class="eldivider" /> -->
|
<!-- <div class="dividing-line"></div> -->
|
<div
|
class="table_box"
|
style="height:100%"
|
>
|
<el-table
|
ref="filterTable"
|
:data="dbTableData"
|
height="100%"
|
border
|
style="width: 100%"
|
>
|
<el-table-column
|
width="60"
|
type="index"
|
:label="$t('common.index')"
|
/>
|
<el-table-column
|
prop="projname"
|
:label="$t('dataManage.projectObj.projname')"
|
/>
|
<el-table-column
|
prop="projtype"
|
:label="$t('dataManage.projectObj.projtype')"
|
/>
|
<el-table-column
|
prop="geom"
|
:label="$t('dataManage.projectObj.location')"
|
/>
|
|
<el-table-column
|
min-width="120"
|
prop="corpname"
|
:label="$t('dataManage.projectObj.corpname')"
|
/>
|
<el-table-column
|
prop="country"
|
:label="$t('dataManage.projectObj.country')"
|
/>
|
<el-table-column
|
prop="province"
|
:label="$t('dataManage.projectObj.province')"
|
/>
|
<el-table-column
|
prop="location"
|
:label="$t('dataManage.projectObj.county')"
|
/>
|
<el-table-column
|
prop="department"
|
:label="$t('dataManage.projectObj.department')"
|
/>
|
<el-table-column
|
prop="conperiod"
|
:label="$t('dataManage.projectObj.conperiod')"
|
/>
|
<el-table-column
|
prop="contents"
|
:label="$t('dataManage.projectObj.contents')"
|
/>
|
<el-table-column
|
prop="projstate"
|
:label="$t('dataManage.projectObj.projstate')"
|
/>
|
<el-table-column
|
prop="remarks"
|
:label="$t('dataManage.projectObj.remarks')"
|
/>
|
<el-table-column
|
label="操作"
|
width="200"
|
>
|
<template slot-scope="scope">
|
<el-button
|
v-if="btnStatus.delete"
|
@click="deleteProject(scope.row)"
|
size="small"
|
plain
|
type="danger"
|
>{{ $t("common.delete") }}</el-button>
|
<el-button
|
v-if="btnStatus.update"
|
@click="EditProject(scope.row)"
|
type="warning"
|
plain
|
size="small"
|
>{{ $t("common.update") }}</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<!-- <div class="pagination_box"></div> -->
|
</div>
|
</div>
|
</div>
|
<el-dialog
|
top="2vh"
|
:title="
|
behavior == '新增项目'
|
? `${$t('dataManage.projectObj.lable1')}`
|
: `${$t('dataManage.projectObj.lable1')}`
|
"
|
:visible.sync="outerVisible"
|
:before-close="outerClose"
|
>
|
<el-dialog
|
width="60%"
|
:title="$t('dataManage.projectObj.location')"
|
:visible.sync="innerVisible"
|
:modal="false"
|
:before-close="innerClose"
|
>
|
<div style="height: 540px">
|
<project-ol v-if="showMap"></project-ol>
|
</div>
|
</el-dialog>
|
<div style="height: 500px; overflow: auto">
|
<el-form
|
class="editFrom1"
|
ref="form"
|
:model="editFrom"
|
label-position="top"
|
>
|
<el-form-item :label="$t('dataManage.projectObj.projname')">
|
<el-input
|
v-model="editFrom.projname"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.projtype')">
|
<el-input
|
v-model="editFrom.projtype"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.location')">
|
<div class="BoxFlex">
|
<div class="BoxFlexinput">
|
<el-input
|
:disabled="true"
|
v-model="editFrom.geom"
|
style="width: 100%"
|
></el-input>
|
</div>
|
<div>
|
<el-button
|
@click="ShowInner"
|
style="margin-left: 6px"
|
icon="el-icon-plus"
|
type="primary"
|
size="small"
|
>
|
</el-button>
|
</div>
|
</div>
|
</el-form-item>
|
|
<el-form-item :label="$t('dataManage.projectObj.country')">
|
<el-input
|
v-model="editFrom.country"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.province')">
|
<el-input
|
v-model="editFrom.province"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.county')">
|
<el-input
|
v-model="editFrom.location"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.corpname')">
|
<el-input
|
v-model="editFrom.corpname"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.department')">
|
<el-input
|
v-model="editFrom.department"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.conperiod')">
|
<el-input
|
v-model="editFrom.conperiod"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.contents')">
|
<el-input
|
v-model="editFrom.contents"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.projstate')">
|
<el-input
|
v-model="editFrom.projstate"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
<el-form-item :label="$t('dataManage.projectObj.remarks')">
|
<el-input
|
v-model="editFrom.remarks"
|
style="width: 85%"
|
></el-input>
|
</el-form-item>
|
</el-form>
|
</div>
|
<div
|
slot="footer"
|
class="dialog-footer"
|
>
|
<el-button
|
type="info"
|
size="small"
|
:disabled="behavior != '新增项目' ? true : false"
|
@click="setRestEditFrom"
|
>{{ $t("common.reset") }}</el-button>
|
<el-button
|
size="small"
|
type="primary"
|
@click="insertEditFrom"
|
>{{
|
$t("common.confirm")
|
}}</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import {
|
project_selectDirAll,
|
project_selectByDirid,
|
project_insert,
|
project_delete,
|
project_update,
|
project_selectLocation,
|
} from "../../api/api";
|
import ProjectOl from "../../components/ProjectOl.vue";
|
import MyBread from "../../components/MyBread.vue";
|
import moment from "moment";
|
|
export default {
|
name: "versionManage",
|
components: { MyBread, ProjectOl },
|
data() {
|
return {
|
filterInput: "",
|
behavior: null,
|
outerVisible: false,
|
innerVisible: false,
|
showMap: false,
|
count: null,
|
projectFrom: {},
|
editFrom: { geom: " " },
|
dirId: null,
|
elProject: [],
|
dirList: [], //el树数据
|
defaultProps: {
|
children: "children",
|
label: "name",
|
},
|
dbTableData: [],
|
btnStatus: {
|
select: false,
|
delete: false,
|
upload: false,
|
download: false,
|
insert: false,
|
update: false,
|
},
|
listLoader: {
|
dirid: null,
|
pageIndex: 1,
|
pageSize: 10,
|
},
|
count1: 0,
|
};
|
},
|
created() {
|
this.showPermsBtn();
|
this.getSelectdirTab();
|
},
|
computed: {},
|
|
methods: {
|
filterNode(value, data) {
|
if (!value) return true;
|
|
return data.name.indexOf(value) !== -1;
|
},
|
showPermsBtn() {
|
let currentPerms = this.$store.state.currentPerms;
|
let permsEntity = this.$store.state.permsEntity;
|
permsEntity
|
.filter((item) => item.perms == currentPerms)
|
.map((item) => (this.btnStatus[item.tag.substr(1)] = true));
|
},
|
ShowInner() {
|
this.innerVisible = true;
|
this.showMap = true;
|
},
|
outerClose(done) {
|
this.$confirm("确认关闭？")
|
.then((_) => {
|
this.setRestEditFrom();
|
this.getSelectProject();
|
done();
|
})
|
.catch((_) => { });
|
},
|
async innerClose() {
|
this.showMap = false;
|
this.innerVisible = false;
|
|
var wkt = this.$wkt.parse(this.$store.state.projeOl);
|
|
const data = await project_selectLocation({
|
x: wkt.coordinates[0],
|
y: wkt.coordinates[1],
|
});
|
|
if (data.code == 200) {
|
for (var i in data.result) {
|
var key = data.result[i].key;
|
var val = data.result[i].value;
|
if (key == "国") {
|
this.editFrom.country = val;
|
} else if (key == "省") {
|
this.editFrom.province = val;
|
} else if (key == "市") {
|
this.editFrom.location = val;
|
}
|
}
|
}
|
this.editFrom.geom = this.$store.state.projeOl;
|
},
|
async insertEditFrom() {
|
if (this.behavior == "新增项目") {
|
this.editFrom.dirid = this.dirId;
|
const data = await project_insert(this.editFrom);
|
if (data.code != 200) {
|
this.$message.error("项目新增失败");
|
return;
|
}
|
this.outerVisible = false;
|
} else {
|
const data = await project_update(this.editFrom);
|
if (data.code != 200) {
|
this.$message.error("项目修改失败");
|
return;
|
}
|
this.outerVisible = false;
|
}
|
|
this.getSelectProject();
|
this.setRestEditFrom();
|
},
|
setRestEditFrom() {
|
this.editFrom = { geom: " " };
|
this.$store.state.projeOl = null;
|
},
|
|
//删除项目
|
async deleteProject(row) {
|
this.$confirm("此操作将永久删除该项目, 是否继续?", "提示", {
|
confirmButtonText: "确定",
|
cancelButtonText: "取消",
|
type: "warning",
|
})
|
.then(async () => {
|
const data = await project_delete({ gid: row.gid });
|
if (data.code == 200) {
|
this.$message({
|
message: "删除成功！",
|
type: "success",
|
});
|
this.getRoleTabelData();
|
} else {
|
this.$message({
|
message: "删除失败！",
|
type: "warning",
|
});
|
}
|
})
|
.catch(() => {
|
this.$message({
|
type: "info",
|
message: "已取消删除",
|
});
|
});
|
},
|
//修改项目
|
EditProject(row) {
|
this.behavior = "修改项目";
|
this.outerVisible = true;
|
this.editFrom = row;
|
this.$store.state.projeOl = row.geom;
|
},
|
//新增项目
|
insertProject() {
|
if (this.dirId == null) {
|
this.$message.error("请选择需要添加的项目");
|
return;
|
}
|
this.behavior = "新增项目";
|
this.outerVisible = true;
|
},
|
//目录树点击事件
|
handleNodeClick(data) {
|
//获取目录ID
|
// this.dirId = data.id;
|
this.dirId = data.code;
|
this.getSelectProject();
|
},
|
|
//列表数据获取
|
async getSelectProject() {
|
this.listLoader.dirid = this.dirId;
|
const data = await project_selectByDirid(this.listLoader);
|
if (data.code != 200) {
|
this.$message.error("列表获取失败");
|
return;
|
}
|
|
// this.count = data.result;
|
this.count1 = data.count;
|
this.dbTableData = data.result;
|
// if (this.count == null) {
|
// this.projectFrom = {};
|
// } else {
|
// this.projectFrom = data.result;
|
// }
|
},
|
//目录列表获取
|
async getSelectdirTab() {
|
const res = await project_selectDirAll();
|
if (res.code != 200) {
|
this.$message.error("目录列表获取失败");
|
return;
|
}
|
this.dirList = this.treeData(res.result);
|
},
|
|
//树列表生成
|
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; // 返回一级菜单
|
});
|
},
|
},
|
watch: {
|
|
filterInput(val) {
|
this.$refs.tree.filter(val);
|
},
|
},
|
};
|
</script>
|
<style lang="less" scoped>
|
//@import url(); 引入公共css类
|
.verSionBox {
|
height: 98%;
|
width: 98%;
|
padding: 1%;
|
.verSionContent {
|
padding-top: 10px;
|
width: 100%;
|
height: calc(100% - 75px);
|
display: flex;
|
justify-content: space-around;
|
.verSion_leftTree {
|
width: calc(23% - 0px);
|
height: 100%;
|
padding: 10px;
|
border-radius: 5px;
|
box-sizing: border-box;
|
overflow-y: auto;
|
}
|
.verSion_rightContent {
|
width: 75%;
|
height: 100%;
|
border-radius: 5px;
|
padding: 10px;
|
// padding-bottom: 0;
|
box-sizing: border-box;
|
border: 1px solid #dcdfe6;
|
}
|
}
|
}
|
.demo-form-inline {
|
//padding: 8px;
|
// margin-top: 10px;
|
border-radius: 5px;
|
//border: 1px solid #dcdfe6;
|
//margin-bottom: 20px;
|
// text-align: right;
|
.el-form-item {
|
margin: 5px;
|
}
|
}
|
</style>
|
