| | |
| | | <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> |
| | |
| | | </div> |
| | | |
| | | <el-table highlight-current-row |
| | | ref="data_table" |
| | | @current-change="tableChange" |
| | | 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="name" label="项目名称" width="120" show-overflow-tooltip> |
| | | </el-table-column> |
| | | <el-table-column prop="status" label="当前状态" :formatter="status_"> |
| | | <el-table-column prop="status" label="当前状态" width="100" align="center" :formatter="status_"> |
| | | </el-table-column> |
| | | <el-table-column prop="reseachType" label="研究类型" > |
| | | <el-table-column prop="reseachType" label="研究类型" width="130"> |
| | | </el-table-column> |
| | | <el-table-column prop="totalCnt" label="服务项目数" > |
| | | <el-table-column prop="totalCnt" label="服务项目数" width="100" align="center"> |
| | | </el-table-column> |
| | | <el-table-column prop="finishCnt" label="已完成项目" > |
| | | <el-table-column prop="finishCnt" label="已完成项目" width="100" 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" align="center" :formatter="dateFormat_"> |
| | | </el-table-column> |
| | | <el-table-column prop="endTime" label="结束时间" :formatter="dateFormat_" > |
| | | <el-table-column prop="endTime" label="结束时间" width="100" align="center" :formatter="dateFormat_" > |
| | | </el-table-column> |
| | | |
| | | <el-table-column prop="desp" label="项目描述"> |
| | | <el-table-column prop="desp" 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 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 v-if="dialog_1" @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, |
| | | prodetail |
| | | prodetail, |
| | | |
| | | pdf |
| | | }, |
| | | data() { |
| | | return { |
| | | editShow: true, |
| | | upload_url: "", |
| | | upload_type: "", |
| | | upload_headers: {}, |
| | | upload_data: {}, |
| | | |
| | | pdfUrl: "", |
| | | currentPage: 1, |
| | | pageCount: 0, |
| | | |
| | | loading_table: false, |
| | | query: "", |
| | |
| | | detailData:undefined, |
| | | dialog_1: false, |
| | | dialog_2: false, |
| | | dialog_upload: false, |
| | | dialog_pdf: false, |
| | | pagenum: 1, |
| | | pagesize: 15, |
| | | total: 0, |
| | |
| | | formInline: { |
| | | user: '', |
| | | region: '' |
| | | } |
| | | }, |
| | | } |
| | | }, |
| | | mounted() { //组件配置后,页面显示前。用于加载数据 |
| | | this.getData(); |
| | | this.userId = localStorage.getItem('userId'); |
| | | this.assign = localStorage.getItem('assign'); |
| | | //this.userId = localStorage.getItem('userId'); |
| | | //this.assign = localStorage.getItem('assign'); |
| | | |
| | | this.userId = this.$cookies.get('userId'); |
| | | this.assign = this.$cookies.get('assign'); |
| | | }, |
| | | methods: { |
| | | download() { |
| | | 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; |
| | |
| | | }, |
| | | 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; |
| | |
| | | params |
| | | }) |
| | | .then(data_ => { |
| | | console.log(data_); |
| | | this.tableData = data_.data.data.records; //给tableData赋值 |
| | | 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; //给tableData赋值 |
| | | this.total = data_.data.data.datas.total; |
| | | this.loading_table = false; |
| | | }).catch(error => { |
| | | console.log(error); |
| | | // console.log(error); |
| | | }) |
| | | }, |
| | | tableRowClassName(row, rowIndex) { |
| | |
| | | this.rowData = {}; |
| | | }, |
| | | editProject() { |
| | | if(!this.selected || this.selected.status != "edit"){ |
| | | if(!this.selected || this.selected.status == "finish"){ |
| | | |
| | | this.$message({message:'请选中一条未启动的项目', type: 'warning'}); |
| | | this.$message({message:'请选中一条未完成的项目', type: 'warning'}); |
| | | }else { |
| | | this.rowData = { |
| | | id:this.selected.id, |
| | | desp:this.selected.desp, |
| | | 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')] |
| | | } |
| | |
| | | } |
| | | |
| | | |
| | | },closeNewProject() { |
| | | }, |
| | | closeNewProject() { |
| | | this.dialog_1 = false; |
| | | query_(); |
| | | this.query_(); |
| | | }, |
| | | |
| | | } |