|
|
@@ -1,125 +1,144 @@
|
|
|
<template>
|
|
|
- <div class="doc-page" v-loading="loading">
|
|
|
- <h3 class="page-title" style="margin: 24px 0 16px;">研发项目阶段性报告</h3>
|
|
|
+ <div>
|
|
|
+ <div class="tool-btn">
|
|
|
+ <el-button type="primary" v-print="'#printWrap'">打印</el-button>
|
|
|
+ </div>
|
|
|
+ <div id="printWrap" class="doc-page" v-loading="loading">
|
|
|
+ <h3 class="page-title" style="margin: 24px 0 16px;">研发项目阶段性报告</h3>
|
|
|
|
|
|
- <div class="project-basic-info">
|
|
|
- <div class="info-row">{{ `研发项目名称:${ selProject.xmmc || '' }` }}</div>
|
|
|
- <div class="info-row">{{ `项目负责人:${ selProject.xmfzrxm || '' }` }}</div>
|
|
|
- <div class="info-row">{{ `项目申请单位:${ selProject.xmsqdw || '' }` }}</div>
|
|
|
- <div class="info-row">{{ `项目执行期:${ getXmDateRange || '' }` }}</div>
|
|
|
- <div class="info-row">
|
|
|
- <span>填报时间:</span>
|
|
|
- <span><el-date-picker v-model="formData.fillDate" value-format="yyyy-MM-dd" @change="handleFillDateChange" :disabled="disabled" /></span>
|
|
|
+ <div class="project-basic-info">
|
|
|
+ <div class="info-row">
|
|
|
+ <span v-if="!disabled">{{ `研发项目名称:${ selProject.xmmc || '' }` }}</span>
|
|
|
+ <span v-else>{{ `研发项目名称:${ formData.xmEntity.xmmc || '' }` }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="info-row">
|
|
|
+ <span v-if="!disabled">{{ `项目负责人:${ selProject.xmmc || '' }` }}</span>
|
|
|
+ <span v-else>{{ `项目负责人:${ formData.xmEntity.xmfzrxm || '' }` }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="info-row">
|
|
|
+ <span v-if="!disabled">{{ `项目申请单位:${ selProject.xmsqdw || '' }` }}</span>
|
|
|
+ <span v-else>{{ `项目申请单位:${ formData.xmEntity.xmsqdw || '' }` }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="info-row">{{ `项目执行期:${ getXmDateRange || '' }` }}</div>
|
|
|
+ <div class="info-row">
|
|
|
+ <span>填报时间:</span>
|
|
|
+ <span><el-date-picker v-model="formData.fillDate" value-format="yyyy-MM-dd" @change="handleFillDateChange" :disabled="disabled" /></span>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
|
|
|
- <table style="margin-top: 20px;">
|
|
|
- <tbody>
|
|
|
- <tr>
|
|
|
- <td class="doc-label"><span style="color: red; margin-right: 3px;">*</span>研发项目名称</td>
|
|
|
- <td class="doc-input">
|
|
|
- <project-select
|
|
|
- v-if="!disabled"
|
|
|
- ref="proSelect"
|
|
|
- v-model="currProjectId"
|
|
|
- :disabled="!formData.fillDate || disabled"
|
|
|
- @change="handleProjectChange"
|
|
|
- :params="{ yearAndMonth: fillDateYearAndMonth }"
|
|
|
- ></project-select>
|
|
|
- <span v-else>{{ formData.xmEntity.xmmc }}</span>
|
|
|
- </td>
|
|
|
- <td class="doc-label">项目申请单位</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.xmsqdw }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.xmsqdw }}</span>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
+ <!-- 打印强制分页 -->
|
|
|
+ <div style="page-break-after: always;"></div>
|
|
|
+
|
|
|
+ <table style="margin-top: 20px;">
|
|
|
+ <tbody>
|
|
|
+ <tr>
|
|
|
+ <td class="doc-label"><span style="color: red; margin-right: 3px;">*</span>研发项目名称</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <project-select
|
|
|
+ v-if="!disabled"
|
|
|
+ ref="proSelect"
|
|
|
+ v-model="currProjectId"
|
|
|
+ :disabled="!formData.fillDate || disabled"
|
|
|
+ @change="handleProjectChange"
|
|
|
+ :params="{ yearAndMonth: fillDateYearAndMonth }"
|
|
|
+ ></project-select>
|
|
|
+ <span v-else>{{ formData.xmEntity.xmmc }}</span>
|
|
|
+ </td>
|
|
|
+ <td class="doc-label">项目申请单位</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.xmsqdw }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.xmsqdw }}</span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
|
|
|
- <tr>
|
|
|
- <td class="doc-label">项目编号</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.xmbh }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.xmbh }}</span>
|
|
|
- </td>
|
|
|
- <td class="doc-label"><span style="color: red; margin-right: 3px;">*</span>项目实施类型</td>
|
|
|
- <td class="doc-input">
|
|
|
- <avue-select
|
|
|
- v-model="formData.type"
|
|
|
- placeholder="请选择"
|
|
|
- :dic="typeList"
|
|
|
- style="width: 100%"
|
|
|
- :disabled="disabled"
|
|
|
- ></avue-select>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="doc-label">项目编号</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.xmbh }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.xmbh }}</span>
|
|
|
+ </td>
|
|
|
+ <td class="doc-label"><span style="color: red; margin-right: 3px;">*</span>项目实施类型</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <avue-select
|
|
|
+ v-model="formData.type"
|
|
|
+ placeholder="请选择"
|
|
|
+ :dic="typeList"
|
|
|
+ style="width: 100%"
|
|
|
+ :disabled="disabled"
|
|
|
+ ></avue-select>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
|
|
|
- <tr>
|
|
|
- <td class="doc-label">项目负责人</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.xmfzrxm }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.xmfzrxm }}</span>
|
|
|
- </td>
|
|
|
- <td class="doc-label">研究类型</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.yjlx }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.yjlx }}</span>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="doc-label">项目负责人</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.xmfzrxm }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.xmfzrxm }}</span>
|
|
|
+ </td>
|
|
|
+ <td class="doc-label">研究类型</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.yjlx }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.yjlx }}</span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
|
|
|
- <tr>
|
|
|
- <td class="doc-label">研发开始时间</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.xmkssj }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.xmkssj }}</span>
|
|
|
- </td>
|
|
|
- <td class="doc-label">研发结束时间</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.xmkssj }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.xmjssj }}</span>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="doc-label">研发开始时间</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.xmkssj }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.xmkssj }}</span>
|
|
|
+ </td>
|
|
|
+ <td class="doc-label">研发结束时间</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.xmkssj }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.xmjssj }}</span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
|
|
|
- <tr>
|
|
|
- <td class="doc-label">项目来源</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.xmly }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.xmly }}</span>
|
|
|
- </td>
|
|
|
- <td class="doc-label">项目开展形式</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.xmkzxs }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.xmkzxs }}</span>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="doc-label">项目来源</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.xmly }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.xmly }}</span>
|
|
|
+ </td>
|
|
|
+ <td class="doc-label">项目开展形式</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.xmkzxs }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.xmkzxs }}</span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
|
|
|
- <tr>
|
|
|
- <td class="doc-label">预期成果形式</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.yqcgxs }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.yqcgxs }}</span>
|
|
|
- </td>
|
|
|
- <td class="doc-label">项目技术经济目标</td>
|
|
|
- <td class="doc-input">
|
|
|
- <span v-if="!disabled">{{ selProject.xmjsjjmb }}</span>
|
|
|
- <span v-else>{{ formData.xmEntity.xmjsjjmb }}</span>
|
|
|
- </td>
|
|
|
- </tr>
|
|
|
+ <tr>
|
|
|
+ <td class="doc-label">预期成果形式</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.yqcgxs }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.yqcgxs }}</span>
|
|
|
+ </td>
|
|
|
+ <td class="doc-label">项目技术经济目标</td>
|
|
|
+ <td class="doc-input">
|
|
|
+ <span v-if="!disabled">{{ selProject.xmjsjjmb }}</span>
|
|
|
+ <span v-else>{{ formData.xmEntity.xmjsjjmb }}</span>
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
|
|
|
- <avue-form v-model="formData" :option="option" style="margin-top: 30px; padding: 0;">
|
|
|
- <template slot="attachmentLabel">
|
|
|
- <label>附件信息</label>
|
|
|
- <el-link type="primary" style="position: absolute; left: 290px; z-index: 1;">下载模板</el-link>
|
|
|
- </template>
|
|
|
- </avue-form>
|
|
|
- <p class="tip">注:可一次上传多个相关文件(文档、表格、图片等)。 支持格式:DOC, PDF, Excel, PNG, JPG, PPT 等。 请确保文件内容清晰有效。</p>
|
|
|
+ <avue-form v-model="formData" :option="option" style="margin-top: 30px; padding: 0;">
|
|
|
+ <template slot="attachmentLabel">
|
|
|
+ <label>附件信息</label>
|
|
|
+ <el-link type="primary" style="position: absolute; left: 290px; z-index: 1;">下载模板</el-link>
|
|
|
+ </template>
|
|
|
+ </avue-form>
|
|
|
+ <p class="tip">注:可一次上传多个相关文件(文档、表格、图片等)。 支持格式:DOC, PDF, Excel, PNG, JPG, PPT 等。 请确保文件内容清晰有效。</p>
|
|
|
|
|
|
- <div class="btn-wrap" style="text-align: center; margin-top: 30px;">
|
|
|
- <el-button type="primary" style="width: 160px;" @click="handleSaveBtn">保存</el-button>
|
|
|
+ <div v-if="!disabled" class="btn-wrap printHide" style="text-align: center; margin-top: 30px;">
|
|
|
+ <el-button type="primary" style="width: 160px;" @click="handleSaveBtn">保存</el-button>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
+
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
@@ -153,12 +172,15 @@ export default {
|
|
|
},
|
|
|
computed: {
|
|
|
getXmDateRange() {
|
|
|
- if (this.selProject.xmkssj && this.selProject.xmjssj) {
|
|
|
- let xmkssj = moment(this.selProject.xmkssj).format('yyyy年MM月DD日');
|
|
|
- let xmjssj = moment(this.selProject.xmjssj).format('yyyy年MM月DD日')
|
|
|
+ if (this.disabled) {
|
|
|
+ let xmkssj = this.formData.xmEntity.xmkssj ? moment(this.formData.xmEntity.xmkssj).format('yyyy年MM月DD日') : '';
|
|
|
+ let xmjssj = this.formData.xmEntity.xmjssj ? moment(this.formData.xmEntity.xmjssj).format('yyyy年MM月DD日') : '';
|
|
|
return `${xmkssj}至${xmjssj}`;
|
|
|
- }
|
|
|
- return `年 月 日至 年 月 日`;
|
|
|
+ } else {
|
|
|
+ let xmkssj = this.selProject.xmkssj ? moment(this.selProject.xmkssj).format('yyyy年MM月DD日') : '';
|
|
|
+ let xmjssj = this.selProject.xmjssj ? moment(this.selProject.xmjssj).format('yyyy年MM月DD日') : '';
|
|
|
+ return `${xmkssj}至${xmjssj}`;
|
|
|
+ }
|
|
|
},
|
|
|
fillDateYearAndMonth() {
|
|
|
return this.formData.fillDate ? moment(this.formData.fillDate).format('yyyyMM') : ''
|
|
|
@@ -285,6 +307,12 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+.tool-btn {
|
|
|
+ width: 800px;
|
|
|
+ text-align: right;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
.page-title {
|
|
|
text-align: center;
|
|
|
font-size: 24px;
|