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 | 443 ++++++++++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 400 insertions(+), 43 deletions(-)
diff --git a/src/views/list.vue b/src/views/list.vue
index 2709822..5b7a84c 100644
--- a/src/views/list.vue
+++ b/src/views/list.vue
@@ -1,111 +1,461 @@
<template>
+ <!-- 宸插畬鎴愮殑涓嶄慨鏀归渶灏� finish1 鏀规垚 finish -->
<div>
<div align="left">
-
<div class="btn-line">
- <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.user" placeholder="瀹℃壒浜�"></el-input>
+ <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.region" placeholder="娲诲姩鍖哄煙">
- <el-option label="鍖哄煙涓�" value="shanghai"></el-option>
- <el-option label="鍖哄煙浜�" value="beijing"></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>
+
+
+ <el-form-item label="椤圭洰鐘舵��">
+ <el-select v-model="formInline.status" placeholder="椤圭洰鐘舵��">
+ <el-option label="鏈紑濮�" value="edit"></el-option>
+ <el-option label="杩涜涓�" value="working"></el-option>
+ <el-option label="宸插欢鏈�" value="delay"></el-option>
+ <el-option label="宸茬粨鏉�" value="finish"></el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item >
+ <el-button type="primary" @click="query_">鏌ヨ</el-button>
+ <el-button type="info" @click="empty_">閲嶇疆</el-button>
</el-form-item>
</el-form>
<div class="btn-line">
- <el-button type="primary" @click="onSubmit">鏌ヨ</el-button>
- <el-button type="info" @click="onSubmit">閲嶇疆</el-button>
+
</div>
</div>
- <el-table :data="tableData" style="width: 100%" :row-class-name="tableRowClassName">
- <el-table-column prop="name" label="椤圭洰鍚嶇О" width="180">
+ <el-table highlight-current-row
+ ref="data_table"
+ @current-change="tableChange"
+ @sort-change="sortChange"
+ v-loading="loading_table"
+ 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="reseachType" label="鐮旂┒绫诲瀷" width="180">
+ <el-table-column prop="name" label="椤圭洰鍚嶇О" width="120" sortable="custom" show-overflow-tooltip>
</el-table-column>
- <el-table-column prop="detailCnt" label="鏈嶅姟椤圭洰鏁�" width="180">
+ <el-table-column prop="status" label="褰撳墠鐘舵��" width="100" sortable="custom" align="center" :formatter="status_">
</el-table-column>
- <el-table-column prop="finishCnt" label="宸插畬鎴愰」鐩�" width="180">
+ <el-table-column prop="totalCnt" label="鏈嶅姟椤圭洰鏁�" width="120" align="center">
</el-table-column>
- <el-table-column prop="delayCnt" label="寤舵湡椤圭洰" width="180">
+ <el-table-column prop="finishCnt" label="宸插畬鎴愰」鐩�" width="120" align="center">
</el-table-column>
- <el-table-column prop="startTime" label="寮�濮嬫椂闂�" width="180">
+ <el-table-column prop="delayCnt" label="寤舵湡椤圭洰" width="100" align="center">
</el-table-column>
- <el-table-column prop="endTime" label="缁撴潫鏃堕棿" width="180">
+ <el-table-column prop="startTime" label="寮�濮嬫椂闂�" width="100" sortable="custom" align="center" :formatter="dateFormat_">
</el-table-column>
- <el-table-column prop="finish" label="鏄惁缁撴潫" width="180">
+ <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 background :current-page="pagenum" :page-sizes="[10, 15, 20]" :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 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,
+ prodetail,
+
+ pdf
+ },
data() {
return {
+ 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.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;
+ this.query_();
+ },
empty_() {
this.formInline = {};
this.query_();
},
- query_() {},
- getData() {
+ query_() {
+ this.getData(this.formInline);
+ },
+ getData(query) {
this.loading_table = true;
let pageno = this.pagenum;
let url = "/api/scheme/page/" + pageno;
- this.axios.get(url, {
- params: {
- pageSize: this.pagesize
- },
+
+ let params = {
+ pageSize: this.pagesize
+ };
+ if(this.assign == "true") {
+ params.userId = this.userId;
+ }
+
+ 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) {
- if (rowIndex === 1) {
- return 'warning-row';
- } else if (rowIndex === 3) {
+ if (row.finish) {
return 'success-row';
+ } else if(row.delay){
+ return 'warning-row';
}
return '';
},
onSubmit() {
- console.log('submit!');
- }
+ query_();
+ },
+ dateFormat_(row, colum, val ,index) {
+ return this.$moment(val).format('YYYY-MM-DD');
+
+ },
+ status_(row, colum, val ,index) {
+ if(val == "working") {
+ return "杩涜涓�";
+ }else if(val == "edit") {
+ return "鏈紑濮�";
+ }else if(val == "delay") {
+ return "宸插欢鏈�";
+ }else if(val == "finish") {
+ return "宸茬粨鏉�";
+ }
+ },
+ finishFotmat(row, colum, val ,index) {
+ if(val) {
+ return "宸茬粨鏉�";
+ }else {
+ return "杩涜涓�";
+ }
+ },
+ addProject() {
+ this.dialog_1 = true;
+ this.rowData = {};
+ },
+ editProject() {
+ //宸插畬鎴愮殑涓嶄慨鏀归渶灏� 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,
+ 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')]
+ }
+ this.dialog_1 = true;
+ }
+
+
+ },
+ closeNewProject() {
+ this.dialog_1 = false;
+ this.query_();
+ },
+
}
}
</script>
@@ -114,4 +464,11 @@
.btn-line {
margin-bottom: 20px;
}
+ .el-table .warning-row {
+ background: oldlace;
+ }
+
+ .el-table .success-row {
+ background: #f0f9eb;
+ }
</style>
--
Gitblit v1.8.0