<template>
  <div class="dahua">
    <div class="reportTitle">
        查新检索报告
    </div>
    <div class="basicMessage">
        <table>
            <tr>
                <td>提案编号：</td>
                <td @dblclick="edit('baseMessage','customCaseNumber')">
                    <div v-if="isEdit('baseMessage','customCaseNumber')">
                        <myRichText v-model="reportData.baseMessage.customCaseNumber" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                    </div>
                    <div v-else v-html="getColumnData('baseMessage','customCaseNumber',dataObj.baseMessage.customCaseNumber)"></div>
                </td>
            </tr>
            <tr>
                <td>提案名称：</td>
                <td @dblclick="edit('baseMessage','caseName')">
                    <div v-if="isEdit('baseMessage','caseName')">
                        <myRichText v-model="reportData.baseMessage.caseName" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                    </div>
                    <div v-else v-html="getColumnData('baseMessage','caseName',dataObj.baseMessage.caseName)"></div>
                </td>
            </tr>
            <tr>
                <td>技术接口人：</td>
                <td @dblclick="edit('baseMessage','technicalContact')">
                    <div v-if="isEdit('baseMessage','technicalContact')">
                        <myRichText v-model="reportData.baseMessage.technicalContact" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                    </div>
                    <div v-else v-html="getColumnData('baseMessage','technicalContact',dataObj.baseMessage.technicalContact )"></div>
                </td>
            </tr>
            <tr>
                <td>检索机构/检索员：</td>
                <td @dblclick="edit('baseMessage','searchUnit')">
                    <div v-if="isEdit('baseMessage','searchUnit')">
                        <myRichText v-model="reportData.baseMessage.searchUnit" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                    </div>
                    <div v-else v-html="getColumnData('baseMessage','searchUnit',dataObj.baseMessage.searchUnit )"></div>
                </td>
            </tr>
            <tr>
                <td>检索员联系方式：</td>
                <td @dblclick="edit('baseMessage','searchUnitContact')">
                    <div v-if="isEdit('baseMessage','searchUnitContact')">
                        <myRichText v-model="reportData.baseMessage.searchUnitContact" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                    </div>
                    <div v-else v-html="getColumnData('baseMessage','searchUnitContact',dataObj.baseMessage.searchUnitContact )"></div>
                </td>
            </tr>
            <tr>
                <td>检索日期：</td>
                <td @dblclick="edit('baseMessage','searchTime')">
                    <div v-if="isEdit('baseMessage','searchTime')">
                        <myRichText v-model="reportData.baseMessage.searchTime" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                    </div>
                    <div v-else v-html="getColumnData('baseMessage','searchTime')"></div>
                </td>
            </tr>
        </table>
    </div>
    <div class="mainContent">
        <div class="title">一、技术方案的分析</div>
        <div>
            <div class="title2">1、方案概述</div>
            <div class="content" @dblclick="edit('technicalCase','remark')">
                <div v-if="isEdit('technicalCase','remark')">
                    <myRichText v-model="reportData.technicalCase.remark" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                </div>
                <div v-else v-html="getColumnData('technicalCase','remark',dataObj.technicalCase.remark)"></div>
            </div>
        </div>
        <div>
            <div class="title2">2、主要附图（如有必要）</div>
            <div class="content" style="display:flex;">
                <div style="width:150px;height:180px;margin-right:10px" v-for="(item,index) in getColumnData('technicalCase','picture',dataObj.technicalCase.systemFileList || [])" :key="index">
                    <div style="height:30px;line-height:30px;display:flex;justify-content:flex-end;">
                        <el-button type="text" size="small" @click="delImage(reportData.technicalCase.picture,item,index)">删除</el-button>
                    </div>
                    <div style="width:150px;height:148px;border:1px dashed #c0ccda;border-radius: 6px;">
                        <el-image style="width:100%;height:100%" :src="$commonJS.checkViewer(item.guid)" :preview-src-list="[$commonJS.checkViewer(form.guid)]" fit="contain"></el-image>
                    </div>
                </div>
                <el-upload style="margin-right:10px;margin-top: 30px;" ref="upload" action="#" :auto-upload="false" multiple :on-change="(file, fileList)=>handleChange(reportData.technicalCase.picture,file, fileList)" list-type="picture-card" :show-file-list="false">
                    <span>
                        <i class="el-icon-plus avatar-uploader-icon"></i>
                    </span>
                </el-upload>
            </div>
        </div>
        <div>
            <div class="title2">3、主要发明点</div>
            <div class="content" @dblclick="edit('technicalCase','inventionPoint')">
                <div v-if="isEdit('technicalCase','inventionPoint')">
                    <myRichText v-model="reportData.technicalCase.inventionPoint" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                </div>
                <div v-else v-html="getColumnData('technicalCase','inventionPoint',dataObj.technicalCase.inventionPoint)"></div>
            </div>
        </div>
    </div>
    <div class="mainContent">
        <div class="title">二、检索关键词及检索式</div>
        <div>
            <div class="title2">1、检索关键词</div>
            <div class="content"></div>
        </div>
        <div>
            <div class="title2">2、检索式(需包括命中数量)</div>
            <div class="content"></div>
        </div>
        <div>
            <div class="title2">3、检索数据库</div>
            <div class="content"></div>
        </div>
    </div>
    <div class="mainContent">
        <div class="title">三、新颖性和/或创造性评述</div>
        <div>
            <div class="title2">1、检索结果</div>
            <div class="content"></div>
        </div>
        <div>
            <div class="title2">2、检索结果分析</div>
            <div class="content"></div>
        </div>
    </div>
    <div class="mainContent">
        <div class="title">三、结论及建议</div>
        <div>
            <div class="title2">1、分析结论：</div>
            <div class="content" @dblclick="edit('baseMessage','preliminaryConclusions')">
                <div v-if="isEdit('baseMessage','preliminaryConclusions')">
                    <myRichText v-model="reportData.baseMessage.preliminaryConclusions" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                </div>
                <div v-else v-html="getColumnData('baseMessage','preliminaryConclusions',dataObj.baseMessage.preliminaryConclusions)"></div>
            </div>
        </div>
        <div>
            <div class="title2">2、建议：</div>
            <div class="content" @dblclick="edit('baseMessage','applicationAdvice')">
                <div v-if="isEdit('baseMessage','applicationAdvice')">
                    <myRichText v-model="reportData.baseMessage.applicationAdvice" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                </div>
                <div v-else v-html="getColumnData('baseMessage','applicationAdvice',dataObj.baseMessage.applicationAdvice)"></div>
            </div>
        </div>
        <div>
            <div class="title2">3、撰写要点建议</div>
            <div class="content" @dblclick="edit('baseMessage','writeAdvice')">
                <div v-if="isEdit('baseMessage','writeAdvice')">
                    <myRichText v-model="reportData.baseMessage.writeAdvice" customStyle="border:none" :autoFocus="true" @blur="saveMessage"></myRichText>
                </div>
                <div v-else v-html="getColumnData('baseMessage','writeAdvice',dataObj.baseMessage.writeAdvice)"></div>
            </div>
        </div>
    </div>
  </div>
</template>

<script>
import mixins from '@/views/noveltySearch/components/exportReport/components/mixins';
export default {
  components: {},
  mixins:[mixins],
  props: {},
  data() {
    return {
    };
  },
  watch: {},
  computed: {},
  created() {},
  mounted() {},
  methods: {},
};  
</script>
<style lang="scss" scoped>
.dahua{
    width: 800px;
    margin: 0 auto;
    padding: 20px 0;
    .reportTitle{
    font-size: 48px;
    text-align: center;
}
.basicMessage{
    margin-top: 40px;
    table{
        width: 100%;
        td{
            padding: 8px;
        }
        tr>td:first-child{
            width: 200px;
        }
    }
    table, th, td {
        border: 1px solid black;
        border-collapse: collapse; /* 移除单元格之间的间隔 */
    }
}
.mainContent{
    margin-top: 50px;
    .title{
        font-size: 24px;
        font-weight: bolder;
    }
    .title2{
        margin-top: 20px;
        padding: 8px 0;
        font-weight: bold;
    }
    .content{
        min-height: 50px;
    }
}
}

</style>