From 84326b11401f217cd483d13bc72cec4ffd5da7ce Mon Sep 17 00:00:00 2001 From: bob <bob.zhang@highdatas.com> Date: 星期三, 25 十一月 2020 10:02:22 +0800 Subject: [PATCH] 2020-11-13 --- src/views/list.vue | 346 +++++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 297 insertions(+), 49 deletions(-) diff --git a/src/views/list.vue b/src/views/list.vue index 3c89d4c..5b7a84c 100644 --- a/src/views/list.vue +++ b/src/views/list.vue @@ -1,25 +1,30 @@ <template> + <!-- 宸插畬鎴愮殑涓嶄慨鏀归渶灏� finish1 鏀规垚 finish --> <div> <div align="left"> - <div class="btn-line"> - <el-button type="primary" @click="addProject">鏂板缓椤圭洰</el-button> - <el-button type="primary" @click="editProject">缂栬緫椤圭洰</el-button> - <el-button type="primary" @click="onSubmit">鏌ョ湅璇︽儏</el-button> + <!-- <el-button type="primary" @click="addProject">鏂板缓椤圭洰</el-button> --> + <el-button type="primary" v-if="editShow" @click="editProject">缂栬緫椤圭洰</el-button> + <el-button type="primary" @click="showDetail">鏌ョ湅璇︽儏</el-button> + <el-button type="primary" @click="download">瀵煎嚭timeline</el-button> </div> - + <div style="width: 0px; height: 0px;"> + <iframe ref="frame_export" style="width: 0px; height: 0px; border: 0px;"></iframe> + </div> <el-form label-width="80px" :inline="true" :label-position="labelPosition" :model="formInline" class="form-inline"> <el-form-item label="椤圭洰鍚嶇О"> <el-input v-model="formInline.name" placeholder="椤圭洰鍚嶇О"></el-input> </el-form-item> - <el-form-item label="鐮旂┒鐩殑"> - <el-select v-model="formInline.type" placeholder="鐮旂┒鐩殑"> - <el-option label="骞查鎬х郴缁熻瘎浠�" value="骞查鎬х郴缁熻瘎浠�"></el-option> - <el-option label="璇婃柇鎬х郴缁熻瘎浠�" value="璇婃柇鎬х郴缁熻瘎浠�"></el-option> - <el-option label="棰勫悗鎬х郴缁熻瘎浠�" value="棰勫悗鎬х郴缁熻瘎浠�"></el-option> - <el-option label="鐩稿叧鎬х郴缁熻瘎浠�" value="鐩稿叧鎬х郴缁熻瘎浠�"></el-option> + <el-form-item label="鐮旂┒绫诲瀷鍒嗙被" label-width="100px"> + <el-select v-model="formInline.type" placeholder="鐮旂┒绫诲瀷鍒嗙被"> + <el-option + v-for="(item,k) in options_type" + :key="k" + :label="item" + :value="item" + ></el-option> </el-select> </el-form-item> @@ -44,77 +49,295 @@ </div> <el-table highlight-current-row + ref="data_table" @current-change="tableChange" + @sort-change="sortChange" v-loading="loading_table" - align="center" - max-height="280" - :data="tableData" style="width: 100%; " :row-class-name="tableRowClassName"> - <el-table-column prop="name" label="椤圭洰鍚嶇О" > + size="small" + :data="tableData" + :header-cell-style="{'width': '100%', 'text-align': 'center'}" + :row-class-name="tableRowClassName"> + <el-table-column type="index" width="50"> </el-table-column> + <el-table-column prop="code" label="椤圭洰鍙�" width="130" sortable="custom"> </el-table-column> - <el-table-column prop="status" label="褰撳墠鐘舵��" :formatter="status_"> + <el-table-column prop="name" label="椤圭洰鍚嶇О" width="120" sortable="custom" show-overflow-tooltip> </el-table-column> - <el-table-column prop="reseachType" label="鐮旂┒绫诲瀷" > + <el-table-column prop="status" label="褰撳墠鐘舵��" width="100" sortable="custom" align="center" :formatter="status_"> </el-table-column> - <el-table-column prop="totalCnt" label="鏈嶅姟椤圭洰鏁�" > + <el-table-column prop="totalCnt" label="鏈嶅姟椤圭洰鏁�" width="120" align="center"> </el-table-column> - <el-table-column prop="finishCnt" label="宸插畬鎴愰」鐩�" > + <el-table-column prop="finishCnt" label="宸插畬鎴愰」鐩�" width="120" align="center"> </el-table-column> - <el-table-column prop="delayCnt" label="寤舵湡椤圭洰" > + <el-table-column prop="delayCnt" label="寤舵湡椤圭洰" width="100" align="center"> </el-table-column> - <el-table-column prop="startTime" label="寮�濮嬫椂闂�" :formatter="dateFormat_"> + <el-table-column prop="startTime" label="寮�濮嬫椂闂�" width="100" sortable="custom" align="center" :formatter="dateFormat_"> </el-table-column> - <el-table-column prop="endTime" label="缁撴潫鏃堕棿" :formatter="dateFormat_" > + <el-table-column prop="endTime" label="缁撴潫鏃堕棿" width="100" sortable="custom" align="center" :formatter="dateFormat_" > </el-table-column> - - <el-table-column prop="desp" label="椤圭洰鎻忚堪"> + <el-table-column prop="desc" label="椤圭洰鎻忚堪" show-overflow-tooltip></el-table-column> + <el-table-column label="鎿嶄綔" align="center" width="300"> + <template v-slot="{row}"> + <el-row> + <el-tooltip class="item" effect="dark" content="棰勮" placement="top"> + <el-button :disabled="!row.attachment" type="primary" icon=" el-icon-view" circle @click="viewHT(row)"></el-button> + </el-tooltip> + <el-tooltip class="item" effect="dark" content="涓婁紶鎶ヤ环鍚堝悓" placement="top"> + <el-button type="success" icon="el-icon-upload2" circle @click="uploadHT(row)"></el-button> + </el-tooltip> + </el-row> + </template> </el-table-column> + </el-table> - <el-pagination - @current-change="handleCurrentChange" - background :current-page="pagenum" :page-sizes="[15]" :page-size="pagesize" layout="total, sizes, prev, pager, next, jumper" - :total="total"> - </el-pagination> + <div style="text-align: right; background-color: #fff;"> + <el-pagination + @current-change="handleCurrentChange" + background :current-page="pagenum" :page-sizes="[15]" :page-size="pagesize" layout="total, sizes, prev, pager, next, jumper" + :total="total"> + </el-pagination> + </div> - <el-dialog @close="Cancel" width="70%" top="50px" :visible.sync="dialog_1" append-to-body> + <el-dialog v-if="dialog_1" @close="Cancel" width="70%" top="50px" :visible.sync="dialog_1" append-to-body> <newProject @closeNewProject="closeNewProject" v-bind:rowData="rowData" ref="newProject_"></newProject> </el-dialog> + <el-dialog v-if="dialog_2" @close="Cancel2" width="70%" top="50px" :visible.sync="dialog_2" append-to-body> + <prodetail @closeNewProject="closeDetail" v-bind:rowData="detailData" ref="newProject2_"></prodetail> + </el-dialog> + + <el-dialog custom-class="z_master_dialog" title="鏂囦欢涓婁紶" v-if="dialog_upload" :visible.sync="dialog_upload" width="500px" append-to-body> + <div style="width: 100%; padding-top: 24px; height: 300px; text-align: center;"> + <el-upload + :show-file-list='true' + class="upload-demo" + ref="upload" + :action="upload_url" + :headers= "upload_headers" + :data="upload_data" + :on-preview="handlePreview" + :on-success="uploadSuccess" + :on-remove="handleRemove" + :before-upload="beforeAvatarUpload" + :auto-upload="false"> + <el-button slot="trigger" size="small" type="primary">閫夊彇鏂囦欢</el-button> + <el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">涓婁紶鍒版湇鍔″櫒</el-button> + <div slot="tip" class="el-upload__tip">鍙兘涓婁紶PDF鏂囦欢</div> + </el-upload> + + </div> + </el-dialog> + + <el-dialog v-if="dialog_pdf" :visible.sync="dialog_pdf" top="10px" width="80%"> + <div style="height: 500px; width: 100%; overflow: overlay;"> + <pdf :src="pdfUrl" :page="currentPage" + @num-pages="pageCount=$event" + @page-loaded="currentPage=$event" + @loaded="loadPdfHandler" + ref="wrapper" class="pdf"></pdf> + </div> + + <div style=""> + <el-button size="small" @click="changePdfPage(0)">涓婁竴椤�</el-button> + <el-button size="small" @click="changePdfPage(1)">涓嬩竴椤�</el-button> + </div> + + </el-dialog> + </div> </template> <script> import newProject from '../components/popup/newProject.vue' + import prodetail from '../components/popup/prodetail.vue' + import pdf from 'vue-pdf' export default { components: { - newProject + newProject, + prodetail, + + pdf }, data() { return { - rowData:undefined, + editShow: true, + upload_url: "", + upload_type: "", + upload_headers: {}, + upload_data: {}, + + pdfUrl: "", + currentPage: 1, + pageCount: 0, + loading_table: false, query: "", + rowData:undefined, + detailData:undefined, dialog_1: false, + dialog_2: false, + dialog_upload: false, + dialog_pdf: false, pagenum: 1, pagesize: 15, total: 0, selected: undefined, labelPosition: "left", tableData: [], - formInline: { - user: '', - region: '' - } + userId:"", + assign:null, + formInline: {}, + options_type:[ + "Health technology assessment (HTA)", + "Clinical practice guideline (CPG)", + "Evidence mapping", + "Overview of review", + "Scoping review", + "Rapid review", + "Systematic review", + "Rapid review", + "Randomised controlled trial (RCT)", + "Other" + ], + + orderBy: "", } }, mounted() { //缁勪欢閰嶇疆鍚庯紝椤甸潰鏄剧ず鍓嶃�傜敤浜庡姞杞芥暟鎹� + //this.userId = localStorage.getItem('userId'); + //this.assign = localStorage.getItem('assign'); + + this.userId = this.$cookies.get('userId'); + this.assign = this.$cookies.get('assign'); + this.getData(); }, methods: { + sortChange(column, prop, order) { + this.orderBy = ""; + if (column.prop && column.order) { + this.orderBy = this.toLine(column.prop); + if (column.order == "descending") { + this.orderBy += " desc"; + } + } + + this.query_(); + }, + + // 涓嬪垝绾胯浆鎹㈤┘宄� + toHump(name) { + return name.replace(/\_(\w)/g, function(all, letter){ + return letter.toUpperCase(); + }); + }, + // 椹煎嘲杞崲涓嬪垝绾� + toLine(name) { + return name.replace(/([A-Z])/g,"_$1").toLowerCase(); + }, + + download() { + if (!this.selected) { + this.$message({message:'璇烽�夋嫨涓嬭浇鏉$洰', type: 'warning'}); + return; + } + + if(!this.selected.id || this.selected.status == "edit"){ + this.$message({message:'銆愭湭寮�濮嬨�戠姸鎬佷笉鑳戒笅杞�', type: 'warning'}); + return; + } + this.$refs.frame_export.src = "/api/api/file/timeline/" + this.selected.id; + }, + viewHT(row) { + this.pdfUrl = "/api/api/file/downloadPath?path=" + row.attachment; + this.dialog_pdf = true; + /* let url = "/api/file/downloadPath"; + let params = { + path: row.attachment + }; + this.$axios.get(url, { + params + }).then(data_ => { + + }).catch(error => { + + }) */ + }, + loadPdfHandler (e) { + this.currentPage = 1 // 鍔犺浇鐨勬椂鍊欏厛鍔犺浇绗竴椤� + }, + changePdfPage(val) { + if(val === 0 && this.currentPage > 1) { + this.currentPage--; + } + if(val === 1 && this.currentPage < this.pageCount) { + this.currentPage++; + } + }, + + uploadHT(row) { + /* this.upload_data = { + id: row.id + }; */ + this.upload_url = "/api/api/file/schemeUpload/" + row.id; + this.dialog_upload = true; + }, + submitUpload() { + this.$refs.upload.submit(); + }, + beforeAvatarUpload(file) { + let FileName = file.name; + let index1=FileName.lastIndexOf("."); + let index2=FileName.length; + let suffix=FileName.substring(index1, index2);//鍚庣紑鍚� + const isSQL = suffix === '.pdf'; + + if (!isSQL) { + this.$message.error('鍙兘涓婁紶.pdf鏂囦欢'); + } + return isSQL; + }, + handleRemove(file, fileList) { + window.console.log(file, fileList); + }, + handlePreview(file) { + window.console.log(file); + }, + uploadSuccess() { + this.dialog_upload = false; + this.query_(); + }, + Cancel() { - this.$refs.newProject_.Cancel(); + this.dialog_1 = false; + this.query_(); + }, + Cancel2() { + this.dialog_2 = false; + this.closeDetail(); + }, + closeDetail() { + this.detailData = undefined; + }, + showDetail() { + if(!this.selected){ + this.$message({message:'璇烽�変腑涓�鏉℃湭鍚姩鐨勯」鐩�', type: 'warning'}); + return; + } + this.dialog_2 = true; }, tableChange(val) { + if (!val) { + val = {}; + } this.selected = val; + this.detailData = val; + // this.editShow = true; + if (this.selected.userId == this.userId) { + this.editShow = true; + }else { + this.editShow = false; + } + }, handleCurrentChange(pageno) { this.pagenum = pageno; @@ -131,25 +354,44 @@ this.loading_table = true; let pageno = this.pagenum; let url = "/api/scheme/page/" + pageno; + let params = { pageSize: this.pagesize }; + if(this.assign == "true") { + params.userId = this.userId; + } - if(query){ + if (query && query.name) { params.name = query.name; + } + if (query && query.status) { params.status = query.status; + } + if (query && query.type) { params.type = query.type; } + + if(this.orderBy) { + params.orderBy = this.orderBy; + } + this.$axios.get(url, { params }) .then(data_ => { - console.log(data_); - this.tableData = data_.data.data.records; //缁檛ableData璧嬪�� - this.total = data_.data.data.total; + window.console.log(data_); + let clientHeight = document.documentElement.clientHeight; + let tableHeight_ = clientHeight - 60 - 20 - 60 - 62 - 48 - 48 - 20; + this.$refs.data_table.$el.getElementsByClassName('el-table__body-wrapper')[0].style['height'] = tableHeight_ - 10 + "px";// - header_height + this.$refs.data_table.$el.getElementsByClassName('el-table__body-wrapper')[0].style['min-height'] = tableHeight_ - 10 + "px"; + this.$refs.data_table.$el.getElementsByClassName('el-table__body-wrapper')[0].style['overflow'] = "overlay"; + + this.tableData = data_.data.data.datas.records; //缁檛ableData璧嬪�� + this.total = data_.data.data.datas.total; this.loading_table = false; }).catch(error => { - console.log(error); + // console.log(error); }) }, tableRowClassName(row, rowIndex) { @@ -165,6 +407,7 @@ }, dateFormat_(row, colum, val ,index) { return this.$moment(val).format('YYYY-MM-DD'); + }, status_(row, colum, val ,index) { if(val == "working") { @@ -186,17 +429,20 @@ }, addProject() { this.dialog_1 = true; - + this.rowData = {}; }, editProject() { - if(!this.selected || this.selected.status != "edit"){ - - this.$message({message:'璇烽�変腑涓�鏉℃湭鍚姩鐨勯」鐩�', type: 'warning'}); + //宸插畬鎴愮殑涓嶄慨鏀归渶灏� finish1 鏀规垚 finish + // if(!this.selected || this.selected.status == "finish"){ + if(!this.selected || this.selected.status == "finish1"){ + this.$message({message:'璇烽�変腑涓�鏉℃湭瀹屾垚鐨勯」鐩�', type: 'warning'}); }else { this.rowData = { id:this.selected.id, - desp:this.selected.desp, + desc:this.selected.desc, name: this.selected.name, + beginDate: this.selected.beginDate, + endDate: this.selected.endDate, objective:this.selected.reseachType, items:[this.$moment(this.selected.startTime).format('YYYY-MM-DD'),this.$moment(this.selected.endTime).format('YYYY-MM-DD')] } @@ -204,8 +450,10 @@ } - },closeNewProject() { - this.dialog_1 = false + }, + closeNewProject() { + this.dialog_1 = false; + this.query_(); }, } -- Gitblit v1.8.0