|
|
@@ -2,22 +2,12 @@
|
|
|
<section >
|
|
|
<div :style="'background:#f7f7f7;padding:10px 50px;height:'+tableHeight+'px;'">
|
|
|
<!--工具条-->
|
|
|
- <!-- <el-col :span="24" class="toolbar" style="padding-bottom: 0px;background:#fff;border-bottom:1px solid #f7f7f7;">
|
|
|
- <el-form :inline="true">
|
|
|
- <el-form-item label="文件库">
|
|
|
- </el-form-item>
|
|
|
- <el-form-item style="float:right;">
|
|
|
- <el-link type="primary" :underline="false" @click="createFolder()"><i class="el-icon-folder-add"></i><span style="margin-left:5px;">创建文件夹</span></el-link>
|
|
|
- <el-upload ref="upload" action="#" :http-request="uploadFile" :show-file-list="false" :limit="1" style="display:inline-block;">
|
|
|
- <el-link type="primary" :underline="false" style="margin-left:10px;"><i class="iconfont firerock-iconshangchuan"></i><span style="margin-left:5px;">文件上传</span></el-link>
|
|
|
- </el-upload>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </el-col> -->
|
|
|
<div style="padding: 20px;background:#fff;border-bottom:1px solid #ddd;font-weight:500;font-size:15px;">
|
|
|
<span @click="viewFolder(null)" style="color: #409EFF;cursor: pointer;">{{ $t('library') }}</span>
|
|
|
<span v-for="path in pathList" :key="path.id" @click="viewFolder(path)" class="mianbaoxie"> <i class="el-icon-arrow-right jianto"></i> {{path.documentName}}</span>
|
|
|
<span style="float:right;">
|
|
|
+ <el-link type="primary" :underline="false" v-if="list.length
|
|
|
+ > 0"><i class="el-icon-setting"></i><span style="margin-right:5px;" @click="templatedialingClick('设为模板')">设为模板</span></el-link>
|
|
|
<el-link type="primary" :underline="false" @click="createFolder"><i class="el-icon-folder-add"></i><span style="margin-left:5px;">{{ $t('createafolder') }}</span></el-link>
|
|
|
<el-upload ref="upload" action="#" :http-request="uploadFile" :show-file-list="false" :limit="1" style="display:inline-block;">
|
|
|
<el-link type="primary" :underline="false" style="margin-left:10px;"><i class="iconfont firerock-iconshangchuan"></i><span style="margin-left:5px;">{{ $t('fileupload') }}</span></el-link>
|
|
|
@@ -107,7 +97,7 @@
|
|
|
</el-dialog>
|
|
|
|
|
|
<!-- 文件夹弹出框 -->
|
|
|
- <el-dialog :title="$t('modifyingFolder')" v-if="addFolderDialog" :visible.sync="addFolderDialog" :close-on-click-modal="false" customClass="customWidth" width="300px">
|
|
|
+ <!-- <el-dialog :title="$t('modifyingFolder')" v-if="addFolderDialog" :visible.sync="addFolderDialog" :close-on-click-modal="false" customClass="customWidth" width="300px">
|
|
|
<el-form ref="form2" :model="folderForm" :rules="rules" >
|
|
|
<el-form-item prop="documentName">
|
|
|
<el-input v-model="folderForm.documentName" :placeholder="$t('pleaseenterfoldername')" maxlength="25"
|
|
|
@@ -117,6 +107,105 @@
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button type="primary" @click="addFolder" style="width:100%;" >{{ $t('save') }}</el-button>
|
|
|
</div>
|
|
|
+ </el-dialog> -->
|
|
|
+
|
|
|
+ <el-dialog :title="$t('modifyingFolder')" v-if="addFolderDialog" :visible.sync="addFolderDialog" :close-on-click-modal="false" customClass="customWidth" width="500px">
|
|
|
+ <div class="titleBox">
|
|
|
+ <el-tabs v-model="activeName" @tab-click="handleClick" v-if="!addFolderDialogTwo">
|
|
|
+ <el-tab-pane label="新建/修改文件夹" name="one">
|
|
|
+ <el-form ref="form2" :model="folderForm" :rules="rules" style="margin-top: 10px">
|
|
|
+ <el-form-item prop="documentName">
|
|
|
+ <el-input v-model="folderForm.documentName" :placeholder="$t('pleaseenterfoldername')" maxlength="25"
|
|
|
+ show-word-limit clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane label="从模板中创建" name="two">
|
|
|
+ <div v-for="(item,index) in templateList" :key="index" @click="cardClick(index)">
|
|
|
+ <el-card :class="`box-card ${templateIndex == index ? 'cardOn' : ''}`">
|
|
|
+ <div class="text item">
|
|
|
+ <div>{{ item.name }}</div>
|
|
|
+ <div>
|
|
|
+ <el-link :underline="false" @click="editTemplate(item)"><i class="el-icon-edit"></i></el-link>
|
|
|
+ <el-link :underline="false" @click="removeTemplate(item)"><i class="el-icon-delete" style="margin-left: 10px"></i></el-link>
|
|
|
+ <div class="cardIcon">
|
|
|
+ <i class="el-icon-check" v-if="templateIndex == index"></i>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+
|
|
|
+ <el-form ref="form2" :model="folderForm" :rules="rules" v-if="addFolderDialogTwo">
|
|
|
+ <el-form-item prop="documentName">
|
|
|
+ <el-input v-model="folderForm.documentName" :placeholder="$t('pleaseenterfoldername')" maxlength="25"
|
|
|
+ show-word-limit clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button v-if="activeName == 'one'" type="primary" @click="addFolder" style="width:100%;" >{{ $t('save') }}</el-button>
|
|
|
+ <el-button v-if="activeName == 'two'" type="primary" @click="addFolderTemplate" style="width:100%;" >{{ $t('save') }}</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 设为模板 -->
|
|
|
+ <el-dialog :title="'编辑模板'" v-if="templatedialing" :visible.sync="templatedialing" :close-on-click-modal="false" customClass="customWidth" width="500px">
|
|
|
+ <div>
|
|
|
+ <el-form :model="templateForm" ref="templateForm" label-width="80px">
|
|
|
+ <el-form-item label="模板名称" prop="name" :rules="[
|
|
|
+ { required: true, message: '请输入模板名称'}
|
|
|
+ ]">
|
|
|
+ <el-input v-model="templateForm.name" :placeholder="'请输入模板名称'" maxlength="25" show-word-limit clearable ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-checkbox v-model="templateForm.creWithPro">随项目自动创建</el-checkbox>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <div class="fileCenter">文件中心结构</div>
|
|
|
+ <div class="filrTree">
|
|
|
+ <el-tree
|
|
|
+ :data="templateDataTree"
|
|
|
+ node-key="id"
|
|
|
+ default-expand-all
|
|
|
+ :expand-on-click-node="false">
|
|
|
+ <span class="custom-tree-node tree_node" slot-scope="{ node, data }">
|
|
|
+ <span>{{ node.label }}</span>
|
|
|
+ <span class="tree_node_btn">
|
|
|
+ <i class="el-icon-circle-plus-outline" @click="addtemplateNodeDailoing = true, excessiveNodeData = data, nodeForm.name = ''"></i>
|
|
|
+ <i class="el-icon-delete" style="margin-left: 20px" @click="removeNode(node, data)"></i>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </el-tree>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <!-- <el-button v-if="templateFlg" type="primary" style="width:100%;" :loading="templateDataTreeDaylong" @click="addTemplate('templateForm')">{{ $t('save') }}</el-button>
|
|
|
+ <el-button v-if="!templateFlg" type="primary" style="width:100%;" :loading="templateDataTreeDaylong" @click="uploadTemplate('templateForm')">{{ $t('save') }}</el-button> -->
|
|
|
+ <el-button type="primary" style="width:100%;" :loading="templateDataTreeDaylong" @click="addTemplate('templateForm')">{{ $t('save') }}</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ <!-- 添加子节点 -->
|
|
|
+ <el-dialog :title="'新增节点'" v-if="addtemplateNodeDailoing" :visible.sync="addtemplateNodeDailoing" :close-on-click-modal="false" customClass="customWidth" width="500px">
|
|
|
+ <div>
|
|
|
+ <el-form :model="nodeForm" ref="nodeForm" label-width="100px" class="demo-ruleForm">
|
|
|
+ <el-form-item label="节点名称" prop="name"
|
|
|
+ :rules="[
|
|
|
+ { required: true, message: '请输入节点名称'}
|
|
|
+ ]"
|
|
|
+ >
|
|
|
+ <el-input v-model="nodeForm.name"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" style="width:100%;" @click="addtemplateNode('nodeForm')">确定</el-button>
|
|
|
+ </div>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</section>
|
|
|
@@ -135,6 +224,63 @@
|
|
|
.mianbaoxie:hover .jianto {
|
|
|
color: #909399;
|
|
|
}
|
|
|
+.custom-tree-node {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 14px;
|
|
|
+ padding-right: 8px;
|
|
|
+}
|
|
|
+.fileCenter {
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+.filrTree {
|
|
|
+ width: 100%;
|
|
|
+ max-height: 280px;
|
|
|
+ overflow: auto;
|
|
|
+ margin-bottom: 10px;
|
|
|
+}
|
|
|
+.titleBox {
|
|
|
+ width: 100%;
|
|
|
+ max-height: 340px;
|
|
|
+ overflow: auto;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ padding: 0 10px;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+.text {
|
|
|
+ font-size: 14px;
|
|
|
+}
|
|
|
+.item {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+.clearfix:before,
|
|
|
+.clearfix:after {
|
|
|
+ display: table;
|
|
|
+ content: "";
|
|
|
+}
|
|
|
+.clearfix:after {
|
|
|
+ clear: both
|
|
|
+}
|
|
|
+.box-card {
|
|
|
+ width: 100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin: 10px 0;
|
|
|
+}
|
|
|
+.cardOn {
|
|
|
+ border: 1px solid #409EFF;
|
|
|
+}
|
|
|
+.cardIcon {
|
|
|
+ display: inline-block;
|
|
|
+ margin-left: 10px;
|
|
|
+ width: 20px;
|
|
|
+ color: #409EFF;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
</style>
|
|
|
<script>
|
|
|
import util from "../../common/js/util";
|
|
|
@@ -166,9 +312,216 @@
|
|
|
addForm: {
|
|
|
|
|
|
},
|
|
|
+ templateTitle: '',
|
|
|
+ templatedialing: false,
|
|
|
+ templateForm: {
|
|
|
+ name: ''
|
|
|
+ },
|
|
|
+ templateDataTree: [],
|
|
|
+ addtemplateNodeDailoing: false,
|
|
|
+ nodeForm: {
|
|
|
+ name: ''
|
|
|
+ },
|
|
|
+ excessiveNodeData: null,
|
|
|
+ templateDataTreeDaylong: false,
|
|
|
+ activeName: 'one',
|
|
|
+ templateList: [],
|
|
|
+ templateFlg: false,
|
|
|
+ templateIndex: '0',
|
|
|
+ addFolderDialogTwo: false
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
+ addFolderTemplate() {
|
|
|
+ let obj = {
|
|
|
+ templateId: this.templateList[this.templateIndex].id,
|
|
|
+ projectId: this.curProjectId,
|
|
|
+ }
|
|
|
+ this.parentFid ? obj.parentFid = this.parentFid : ''
|
|
|
+ console.log('obj', obj)
|
|
|
+ // return
|
|
|
+ this.http.post('/document/buildWithTemplate', obj,
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.addFolderDialog = false
|
|
|
+ this.getList()
|
|
|
+ } else {
|
|
|
+ this.$message({message: res.msg,type: 'error'});
|
|
|
+ }
|
|
|
+ }, error => {
|
|
|
+ this.$message({message: error,type: 'error'});
|
|
|
+ })
|
|
|
+ },
|
|
|
+ cardClick(index) {
|
|
|
+ this.templateIndex = index
|
|
|
+ },
|
|
|
+ editTemplate(data) {
|
|
|
+ this.templateForm.name = data.name
|
|
|
+ this.templateForm.creWithPro = data.creWithPro ? true : false
|
|
|
+ this.templateForm.id = data.id
|
|
|
+ this.templateDataTree = data.proDocumentTemDetailList
|
|
|
+ this.templateFlg = false
|
|
|
+ this.templatedialing = true
|
|
|
+ },
|
|
|
+ removeTemplate(data) {
|
|
|
+ this.$confirm(`确定删除【${data.name}】模板吗？`, '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.http.post('/project-document-template/delete', {id: data.id},
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.$message({
|
|
|
+ message: `删除成功`,
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ this.getTemplateList()
|
|
|
+ } else {
|
|
|
+ this.$message({message: res.msg,type: 'error'});
|
|
|
+ }
|
|
|
+ }, error => {
|
|
|
+ this.$message({message: error,type: 'error'});
|
|
|
+ })
|
|
|
+ }).catch(() => {});
|
|
|
+ },
|
|
|
+ uploadTemplate(formName) {
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ this.templateDataTreeDaylong = true
|
|
|
+ this.http.post('/project-document-template/update', {
|
|
|
+ proDocumentTemDetailList: JSON.stringify(this.templateDataTree),
|
|
|
+ name: this.templateForm.name,
|
|
|
+ creWithPro: this.templateForm.creWithPro ? '1' : '0',
|
|
|
+ id: this.templateForm.id,
|
|
|
+ companyId: this.user.companyId
|
|
|
+ },
|
|
|
+ res => {
|
|
|
+ this.templateDataTreeDaylong = false
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.$message({
|
|
|
+ message: `操作成功`,
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ } else {this.$message({message: res.msg,type: 'error'});}
|
|
|
+ }, error => {
|
|
|
+ this.templateDataTreeDaylong = false
|
|
|
+ this.$message({message: error,type: 'error'});
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ console.log('error submit!!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ addTemplate(formName) {
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ let obj = {}
|
|
|
+ if(this.templateFlg) {
|
|
|
+ obj = {
|
|
|
+ documentString: JSON.stringify(this.templateDataTree),
|
|
|
+ name: this.templateForm.name,
|
|
|
+ creWithPro: this.templateForm.creWithPro ? '1' : '0',
|
|
|
+ companyId: this.user.companyId
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ obj = {
|
|
|
+ documentString: JSON.stringify(this.templateDataTree),
|
|
|
+ name: this.templateForm.name,
|
|
|
+ creWithPro: this.templateForm.creWithPro ? '1' : '0',
|
|
|
+ id: this.templateForm.id,
|
|
|
+ companyId: this.user.companyId
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.templateDataTreeDaylong = true
|
|
|
+ // this.http.post('/project-document-template/addTemplate', {
|
|
|
+ this.http.post('/project-document-template/addTemplate', obj,
|
|
|
+ res => {
|
|
|
+ this.templateDataTreeDaylong = false
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.$message({
|
|
|
+ message: `(${this.templateForm.name}) 模板添加成功，可在创建文件夹中查看`,
|
|
|
+ type: 'success'
|
|
|
+ });
|
|
|
+ this.templatedialing = false
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: res.msg,
|
|
|
+ type: 'error'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }, error => {
|
|
|
+ this.templateDataTreeDaylong = false
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: 'error'
|
|
|
+ });
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ console.log('error submit!!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ addtemplateNode(formName) {
|
|
|
+ this.$refs[formName].validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ console.log('excessiveNodeData',this.excessiveNodeData)
|
|
|
+ let data = this.excessiveNodeData
|
|
|
+ const newChild = { label: this.nodeForm.name, children: [], folderId: this.excessiveNodeData.id || ''};
|
|
|
+ if (!data.children) {
|
|
|
+ this.$set(data, 'children', []);
|
|
|
+ }
|
|
|
+ data.children.push(newChild);
|
|
|
+ this.addtemplateNodeDailoing = false
|
|
|
+ } else {
|
|
|
+ console.log('error submit!!');
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ removeNode(node, data) {
|
|
|
+ this.$confirm(`确定删除（${data.label}）节点？`, '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ const parent = node.parent;
|
|
|
+ const children = parent.data.children || parent.data;
|
|
|
+ const index = children.findIndex(d => d.id === data.id);
|
|
|
+ children.splice(index, 1);
|
|
|
+ }).catch(() => {});
|
|
|
+ },
|
|
|
+ templatedialingClick(title) {
|
|
|
+ this.templateTitle = title
|
|
|
+ this.templateForm = {name: ''}
|
|
|
+ this.templatedialing = true
|
|
|
+ this.templateFlg = true
|
|
|
+ this.getTemplateDataTree()
|
|
|
+ },
|
|
|
+ getTemplateDataTree() {
|
|
|
+ this.http.post('/document/getSubList', {
|
|
|
+ projectId: this.curProjectId,
|
|
|
+ parentFid: this.parentFid
|
|
|
+ },
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.templateDataTree = []
|
|
|
+ this.templateDataTree = res.data
|
|
|
+ } else {
|
|
|
+ this.$message({
|
|
|
+ message: res.msg,
|
|
|
+ type: 'error'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }, error => {
|
|
|
+ this.$message({
|
|
|
+ message: error,
|
|
|
+ type: 'error'
|
|
|
+ });
|
|
|
+ })
|
|
|
+ },
|
|
|
cursorOver(row, column, cell, event) {
|
|
|
this.currentDataId = row.id;
|
|
|
},
|
|
|
@@ -285,11 +638,27 @@
|
|
|
},
|
|
|
showEditName(row) {
|
|
|
this.addFolderDialog = true;
|
|
|
+ this.addFolderDialogTwo = true
|
|
|
this.folderForm = JSON.parse(JSON.stringify(row));
|
|
|
},
|
|
|
createFolder(){
|
|
|
this.addFolderDialog = true;
|
|
|
+ this.addFolderDialogTwo = false
|
|
|
this.folderForm = {projectId: this.curProjectId, folderId: this.parentFid,isFolder: 1};
|
|
|
+ this.activeName = 'one'
|
|
|
+ this.getTemplateList()
|
|
|
+ },
|
|
|
+ getTemplateList() {
|
|
|
+ this.http.post('/project-document-template/list ', {},
|
|
|
+ res => {
|
|
|
+ if (res.code == "ok") {
|
|
|
+ this.templateList = res.data
|
|
|
+ } else {
|
|
|
+ this.$message({message: res.msg,type: 'error'});
|
|
|
+ }
|
|
|
+ }, error => {
|
|
|
+ this.$message({message: error,type: 'error'});
|
|
|
+ })
|
|
|
},
|
|
|
|
|
|
openWin(url) {
|
Lijy