| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355 |
- <template>
- <div class="doc-page" v-loading="loading">
- <h3 class="page-title" style="margin: 24px 0 16px;">科德集团</h3>
- <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.tbsj" value-format="yyyy-MM-dd" /></span>
- </div>
- </div>
- <table style="margin-top: 20px;">
- <tbody>
- <tr>
- <td class="doc-label">研发项目名称</td>
- <td class="doc-input">
- <project-select
- v-model="currProjectId"
- @change="handleProjectChange"
- ></project-select>
- </td>
- <td class="doc-label">项目申请单位</td>
- <td class="doc-input">{{ selProject.xmsqdw }}</td>
- </tr>
- <tr>
- <td class="doc-label">项目负责人</td>
- <td class="doc-input">{{ selProject.xmfzrxm }} </td>
- <td class="doc-label">研究类型</td>
- <td class="doc-input">{{ selProject.yjlx }}</td>
- </tr>
- <tr>
- <td class="doc-label">研发开始时间</td>
- <td class="doc-input">{{ selProject.xmkssj }} </td>
- <td class="doc-label">研发结束时间</td>
- <td class="doc-input">{{ selProject.xmjssj }}</td>
- </tr>
- <tr>
- <td class="doc-label">项目来源</td>
- <td class="doc-input">{{ selProject.xmly }} </td>
- <td class="doc-label">项目开展形式</td>
- <td class="doc-input">{{ selProject.xmkzxs }}</td>
- </tr>
- <tr>
- <td class="doc-label">预期成果形式</td>
- <td class="doc-input">{{ selProject.yqcgxs }} </td>
- <td class="doc-label">项目技术经济目标</td>
- <td class="doc-input">{{ selProject.xmjsjjmb }}</td>
- </tr>
- </tbody>
- </table>
- <avue-form v-model="formData" :option="option" style="margin-top: 30px; padding: 0;">
- <template slot="ysbgLabel">
- <label>验收报告</label>
- <el-link type="primary" style="position: absolute; left: 220px; z-index: 1;">下载模板</el-link>
- </template>
- <template slot="jsbgLabel">
- <label>技术报告</label>
- <el-link type="primary" style="position: absolute; left: 220px; z-index: 1;">下载模板</el-link>
- </template>
- <template slot="cgbgLabel">
- <label>成果报告</label>
- <el-link type="primary" style="position: absolute; left: 220px; z-index: 1;">下载模板</el-link>
- </template>
- <template slot="xybgLabel">
- <label>效益报告</label>
- <el-link type="primary" style="position: absolute; left: 220px; z-index: 1;">下载模板</el-link>
- </template>
- <template slot="yspwLabel">
- <label>验收批文</label>
- <el-link type="primary" style="position: absolute; left: 220px; 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>
- </div>
- </template>
- <script>
- import projectSelect from "@/components/project-select";
- import { save, getDetail } from "@/api/projectManage/accept";
- import moment from "moment";
- export default {
- components: {
- projectSelect
- },
- props: {
- projectId: [String, Number]
- },
- data() {
- return {
- formData: {},
- loading: false,
- projectList: [],
- selProject: {},
- currProjectId: '',
- loading: false
- };
- },
- 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日')
- return `${xmkssj}至${xmjssj}`;
- }
- return `年 月 日至 年 月 日`;
- },
- option() {
- return {
- menuBtn: false,
- labelWidth: 75,
- column: [
- {
- label: "验收报告",
- prop: "ysbg",
- type: "upload",
- multiple: true,
- span: 24,
- dataType: "object",
- propsHttp: {
- url: "link",
- name: "originalName",
- res: "data",
- },
- action: '/api/kd-resource/oss/endpoint/put-file',
- uploadPreview: (file, column, done) => {
- window.open(file.url, "_blank");
- return;
- },
- disabled: !this.currProjectId
- },
- {
- label: "技术报告",
- prop: "jsbg",
- type: "upload",
- multiple: true,
- span: 24,
- dataType: "object",
- propsHttp: {
- url: "link",
- name: "originalName",
- res: "data",
- },
- action: '/api/kd-resource/oss/endpoint/put-file',
- uploadPreview: (file, column, done) => {
- window.open(file.url, "_blank");
- return;
- },
- disabled: !this.currProjectId
- },
- {
- label: "成果报告",
- prop: "cgbg",
- type: "upload",
- multiple: true,
- span: 24,
- dataType: "object",
- propsHttp: {
- url: "link",
- name: "originalName",
- res: "data",
- },
- action: '/api/kd-resource/oss/endpoint/put-file',
- uploadPreview: (file, column, done) => {
- window.open(file.url, "_blank");
- return;
- },
- disabled: !this.currProjectId
- },
- {
- label: "效益报告",
- prop: "xybg",
- type: "upload",
- multiple: true,
- span: 24,
- dataType: "object",
- propsHttp: {
- url: "link",
- name: "originalName",
- res: "data",
- },
- action: '/api/kd-resource/oss/endpoint/put-file',
- uploadPreview: (file, column, done) => {
- window.open(file.url, "_blank");
- return;
- },
- disabled: !this.currProjectId
- },
- {
- label: "验收批文",
- prop: "yspw",
- type: "upload",
- multiple: true,
- span: 24,
- dataType: "object",
- action: '/api/kd-resource/oss/endpoint/put-file',
- uploadPreview: (file, column, done) => {
- window.open(file.url, "_blank");
- return;
- },
- propsHttp: {
- url: "link",
- name: "originalName",
- res: "data",
- },
- disabled: !this.currProjectId
- },
- ],
- }
- }
- },
- watch: {
- currProjectId() {
- this.getImplementDetail();
- }
- },
- mounted() {
- this.currProjectId = this.projectId || '';
- },
- methods: {
- getImplementDetail() {
- this.loading = true;
- getDetail({ xmId: this.currProjectId, yearAndMonth: this.yearAndMonth }).then(({ data }) => {
- this.loading = false;
- if (data.code == 200 && data.data && Object.keys(data.data).length) {
- this.formData = {
- id: data.data.id,
- xmId: data.data.xmId,
- tbsj: data.data.tbsj,
- ysbg: data.data.ysbg ? JSON.parse(data.data.ysbg) : [],
- jsbg: data.data.jsbg ? JSON.parse(data.data.jsbg) : [],
- cgbg: data.data.cgbg ? JSON.parse(data.data.cgbg) : [],
- xybg: data.data.xybg ? JSON.parse(data.data.xybg) : [],
- yspw: data.data.yspw ? JSON.parse(data.data.yspw) : [],
- };
- } else {
- this.formData = {
- tbsj: '',
- ysbg: [],
- jsbg: [],
- cgbg: [],
- xybg: [],
- yspw: [],
- };
- }
- }).catch(() => {
- this.loading = false;
- });
- },
- handleProjectChange(data) {
- this.selProject = data;
- },
- validForm() {
- let errorText = '';
- if (!this.formData.tbsj) {
- errorText = '请选择填报时间';
- } else if (!this.currProjectId) {
- errorText = '请选择填报的项目';
- }
- return errorText;
- },
- handleSaveBtn() {
- let errorText = this.validForm();
- if (errorText) {
- this.$message.error(errorText+'!');
- return;
- }
- const params = { ...this.formData, xmId: this.currProjectId };
- params.ysbg = JSON.stringify(params.ysbg);
- params.jsbg = JSON.stringify(params.jsbg);
- params.cgbg = JSON.stringify(params.cgbg);
- params.xybg = JSON.stringify(params.xybg);
- params.yspw = JSON.stringify(params.yspw);
- this.saveData(params);
- },
- saveData(params) {
- save(params).then(({ data }) => {
- if (data.code == 200) {
- this.$message.success('保存成功!');
- }
- });
- }
- },
- };
- </script>
- <style lang="scss" scoped>
- .page-title {
- text-align: center;
- font-size: 24px;
- }
- .project-basic-info .info-row {
- line-height: 26px;
- color: #666;
- }
- .doc-page {
- width: 800px;
- margin: 30px auto;
- }
- table {
- width: 100%;
- border: 1px solid #333;
- }
- .doc-label {
- text-align: center;
- padding: 6px;
- color: #777;
- font-size: 14px;
- width: 15%;
- }
- .doc-input {
- text-align: center;
- color: #333;
- width: 35%;
- }
- .el-input__inner {
- border: none;
- }
- tr td {
- border: 1px solid #333;
- }
- .tip {
- position: relative;
- top: 0;
- color: red;
- padding-left: 75px;
- margin-top: 0;
- font-size: 12px;
- }
- </style>
|