1

src/views/report/InvalidResponse/components/reasonsAndEvidence/details_1 备份.vue

@@ -0,0 +1,189 @@
+
+<template>
+    <div class="height_100">
+      <el-container>
+        <!-- <el-header>
+              <div class="head">
+                  <el-button type="primary" size="small"  @click="synchronization" class="margin-right_10">同步</el-button>
+              </div>
+          </el-header> -->
+          <el-main v-DivHeight="getDivHeight" class="Evidence_details">
+            <el-table :data="tableData" border v-loading="loading" :maxHeight="tableHeight" @cell-dblclick="cellDblclick" @cell-click="cellClick">
+                <el-table-column  v-for="item in column.filter(item=>!item.ifHidden)"
+                :render-header="$commonJS.renderHeaderMethods" :key="item.field" :prop="item.field" :label="item.label" :width="item.width || 'auto'"
+                align="center">
+                    <template slot-scope="scope">
+                        <div>
+                            <!-- @input="(value)=>getData(scope.row,item.field,value)" -->
+                            <div v-if="editField==(item.field+scope.row.id)">
+                                <el-select clearable v-if="item.field == 'invalidStatue.courtOpinions1' || item.field == 'invalidStatue.courtOpinions2'" :value="getColumnData(scope.row,item.field)" @change="(value)=>changeMessage(item.field,scope.row,value)" placeholder="请选择">
+                                    <el-option label="基于原权要维持有效"  value="基于原权要维持有效"></el-option>
+                                    <el-option label="基于修改后权要维持有效"  value="基于修改后权要维持有效"></el-option>
+                                    <el-option label="全部无效"  value="全部无效"></el-option>
+                                </el-select>
+                                <el-select clearable v-else-if="item.field == 'invalidStatue.statuteId'" :value="getColumnData(scope.row,item.field)" @change="(value)=>changeMessage(item.field,scope.row,value)" placeholder="请选择" style="width:100%">
+                                    <el-option
+                                        v-for="item in provisions"
+                                        :key="item.value"
+                                        :label="item.label"
+                                        :value="item.value"
+                                    >
+                                    </el-option>
+                                </el-select>
+                                <my-RichText v-else :autoFocus="true" :value="getColumnData(scope.row,item.field)" @blur="(value)=>changeMessage(item.field,scope.row,value)"></my-RichText>
+                            </div>
+                            
+                            <div class="text" v-else v-html="getColumnData(scope.row,item.field)"></div>
+                        </div>
+                        
+                    </template>
+                </el-table-column>
+            </el-table>
+          </el-main>
+      </el-container>
+  
+      
+    </div>
+</template>
+<script>
+import common from './common';
+const column = [
+    {
+        field:'invalidStatue.statuteId',
+        label:'法条',
+        editable:true,
+        width:100
+    },
+    {
+        field:'invalidStatue.claimText',
+        label:'权利要求',
+        editable:true,
+        width:180
+    },
+    {
+        field:'invalidReason',
+        label:'具体理由',
+        editable:true
+    },
+    {
+        field:'presentOpinions',
+        label:'权利人答复',
+        editable:true
+    },
+    {
+        field:'rbDecision',
+        label:'合议组认定',
+        editable:true,
+        width:180
+    },
+    {
+        field:'invalidStatue.courtOpinions1',
+        label:'一审',
+        editable:true,
+        width:100
+    },
+    {
+        field:'invalidStatue.courtOpinions2',
+        label:'二审',
+        editable:true,
+        width:100,
+        ifHidden:true
+    }
+]
+export default {
+  components: {},
+  mixins:[common],
+  props: {},
+  data() {
+    return {
+        // tableData:[],
+        column:column,
+        // loading:false,
+        // editField:'',
+        // editMessage:''
+        statueType:0
+    };
+  },
+  watch: {},
+  computed: {},
+  created() {},
+  mounted() {
+    // this.init()
+  },
+//   methods: {
+//     async init(){
+//         var url = './非三性表格.html'
+//         this.loading = true
+//         await fetch(url).then(res =>  res.text() ).then(data => {
+//             var html = data  
+//             const parser = new DOMParser();  
+//             // 解析包含 HTML 实体的字符串  
+//             const doc = parser.parseFromString(html, "text/html");  
+//             var trList =  doc.body.getElementsByTagName('tr')
+//             var head = trList[0]
+//             var headList = head.getElementsByTagName('td')
+
+//             var tableData = []
+//             for(var i = 1;i<trList.length;i++){
+//                 var bodyList = trList[i].getElementsByTagName('td')
+//                 var obj = {
+//                     id:i
+//                 }
+//                 for(var j = 0;j<bodyList.length;j++){
+//                     obj[headList[j].innerText] = bodyList[j].innerHTML
+//                 }
+//                 tableData.push(obj)
+//             }
+//             this.tableData = tableData
+//             this.loading = false
+//         })
+//     },
+//      //编辑
+//      async edit(item,row){
+//         if(item.field && row){
+//             if(!item.editable){
+//                 this.$message.warning('该栏位不可编辑')
+//                 return
+//             }
+//             if(this.editField){
+//                 return
+//             }
+//             this.editField = item.field + row.id
+//             this.editMessage = row[item.field]
+//             return
+//         }
+//     },
+//     changeMessage(field,row,value){
+       
+//         if(value == this.editMessage){
+//             this.editField = null
+//             this.$message('没有发生修改')
+//             return
+//         }
+//         var params = {
+//             editField:field,   
+//             fieldContent: value 
+//         }
+        
+//         // this.editField = null
+//         this.$message('修改了')
+//     },
+//   },
+};
+</script>
+<style lang="scss" scoped>
+.head{
+    width:100%;
+    display: flex;
+    flex-direction: row-reverse;
+}
+.text{
+    text-align: left;
+}
+</style>
+<style lang="scss">
+.Evidence_details .el-table .el-table__cell {  
+    vertical-align: top;  
+    /* 其他样式... */  
+}  
+</style>

src/views/report/InvalidResponse/components/reasonsAndEvidence/details_1.vue

@@ -2,11 +2,12 @@
 <template>
     <div class="height_100">
       <el-container>
-        <!-- <el-header>
+        <el-header>
               <div class="head">
-                  <el-button type="primary" size="small"  @click="synchronization" class="margin-right_10">同步</el-button>
+                  <el-button type="primary" size="small"  @click="showField" class="margin-right_10">显示栏位管理</el-button>
+                  <el-button type="primary" size="small"  @click="add" class="margin-right_10">添加</el-button>
               </div>
-          </el-header> -->
+          </el-header>
           <el-main v-DivHeight="getDivHeight" class="Evidence_details">
             <el-table :data="tableData" border v-loading="loading" :maxHeight="tableHeight" @cell-dblclick="cellDblclick" @cell-click="cellClick">
                 <el-table-column  v-for="item in column.filter(item=>!item.ifHidden)"
@@ -16,12 +17,12 @@
                         <div>
                             <!-- @input="(value)=>getData(scope.row,item.field,value)" -->
                             <div v-if="editField==(item.field+scope.row.id)">
-                                <el-select clearable v-if="item.field == 'invalidStatue.courtOpinions1' || item.field == 'invalidStatue.courtOpinions2'" :value="getColumnData(scope.row,item.field)" @change="(value)=>changeMessage(item.field,scope.row,value)" placeholder="请选择">
+                                <el-select clearable v-if="item.field == 'courtOpinions1' || item.field == 'courtOpinions2'" :value="getColumnData(scope.row,item.field)" @change="(value)=>changeMessage(item.field,scope.row,value)" placeholder="请选择">
                                     <el-option label="基于原权要维持有效"  value="基于原权要维持有效"></el-option>
                                     <el-option label="基于修改后权要维持有效"  value="基于修改后权要维持有效"></el-option>
                                     <el-option label="全部无效"  value="全部无效"></el-option>
                                 </el-select>
-                                <el-select clearable v-else-if="item.field == 'invalidStatue.statuteId'" :value="getColumnData(scope.row,item.field)" @change="(value)=>changeMessage(item.field,scope.row,value)" placeholder="请选择" style="width:100%">
+                                <el-select clearable v-else-if="item.field == 'statuteId'" :value="getColumnData(scope.row,item.field)" @change="(value)=>changeMessage(item.field,scope.row,value)" placeholder="请选择" style="width:100%">
                                     <el-option
                                         v-for="item in provisions"
                                         :key="item.value"
@@ -32,12 +33,38 @@
                                 </el-select>
                                 <my-RichText v-else :autoFocus="true" :value="getColumnData(scope.row,item.field)" @blur="(value)=>changeMessage(item.field,scope.row,value)"></my-RichText>
                             </div>
+                            <template v-else>
+                                <div class="text">
+                                    <span  v-html="getColumnData(scope.row,item.field)"></span>
+                                    <span v-if="item.field == 'statuteId' || item.field == 'claimText'">
+                                        <el-popover
+                                                popper-class="reasonAndEvidence"
+                                                placement="bottom"
+                                                width="100"
+                                                trigger="click"
+                                            >
+                                                <div class="menuList">
+                                                    <div class="menuListLi" @click="del(scope.row,item)">删除</div>
+                                                    <div class="menuListLi" @click="add(scope.row,item)">新增</div>
+                                                </div>
+                                                <i slot="reference" class="el-icon-caret-bottom"></i>
+                                            </el-popover>
+                                    </span>
+                                </div>
+                            </template>
                             
-                            <div class="text" v-else v-html="getColumnData(scope.row,item.field)"></div>
                         </div>
                         
                     </template>
                 </el-table-column>
+                <el-table-column label="操作" align="center" min-width="130px">
+                    <template slot-scope="scope">
+                        <div>
+                            <el-button type="text" size="small" @click="remove(scope.row)">删除</el-button>
+                            <el-button type="text" size="small" @click="add(scope.row)">新增</el-button>
+                        </div>
+                    </template>
+                </el-table-column>
             </el-table>
           </el-main>
       </el-container>
@@ -49,18 +76,24 @@
 import common from './common';
 const column = [
     {
-        field:'invalidStatue.statuteId',
+        field:'statuteId',
         label:'法条',
         editable:true,
         width:100
     },
     {
-        field:'invalidStatue.claimText',
+        field:'claimText',
         label:'权利要求',
         editable:true,
         width:180
     },
     {
+        field:'feature',
+        label:'特征',
+        editable:true,
+        width:180
+    },
+    {
         field:'invalidReason',
         label:'具体理由',
         editable:true
@@ -77,13 +110,13 @@ const column = [
         width:180
     },
     {
-        field:'invalidStatue.courtOpinions1',
+        field:'courtOpinions1',
         label:'一审',
         editable:true,
         width:100
     },
     {
-        field:'invalidStatue.courtOpinions2',
+        field:'courtOpinions2',
         label:'二审',
         editable:true,
         width:100,
@@ -96,11 +129,7 @@ export default {
   props: {},
   data() {
     return {
-        // tableData:[],
         column:column,
-        // loading:false,
-        // editField:'',
-        // editMessage:''
         statueType:0
     };
   },
@@ -110,67 +139,16 @@ export default {
   mounted() {
     // this.init()
   },
-//   methods: {
-//     async init(){
-//         var url = './非三性表格.html'
-//         this.loading = true
-//         await fetch(url).then(res =>  res.text() ).then(data => {
-//             var html = data  
-//             const parser = new DOMParser();  
-//             // 解析包含 HTML 实体的字符串  
-//             const doc = parser.parseFromString(html, "text/html");  
-//             var trList =  doc.body.getElementsByTagName('tr')
-//             var head = trList[0]
-//             var headList = head.getElementsByTagName('td')
 
-//             var tableData = []
-//             for(var i = 1;i<trList.length;i++){
-//                 var bodyList = trList[i].getElementsByTagName('td')
-//                 var obj = {
-//                     id:i
-//                 }
-//                 for(var j = 0;j<bodyList.length;j++){
-//                     obj[headList[j].innerText] = bodyList[j].innerHTML
-//                 }
-//                 tableData.push(obj)
-//             }
-//             this.tableData = tableData
-//             this.loading = false
-//         })
-//     },
-//      //编辑
-//      async edit(item,row){
-//         if(item.field && row){
-//             if(!item.editable){
-//                 this.$message.warning('该栏位不可编辑')
-//                 return
-//             }
-//             if(this.editField){
-//                 return
-//             }
-//             this.editField = item.field + row.id
-//             this.editMessage = row[item.field]
-//             return
-//         }
-//     },
-//     changeMessage(field,row,value){
-       
-//         if(value == this.editMessage){
-//             this.editField = null
-//             this.$message('没有发生修改')
-//             return
-//         }
-//         var params = {
-//             editField:field,   
-//             fieldContent: value 
-//         }
-        
-//         // this.editField = null
-//         this.$message('修改了')
-//     },
-//   },
+
 };
 </script>
+<style lang="scss">
+    .reasonAndEvidence {
+        min-width: 80px ;
+        border: 1px solid #ACA9A9;
+    }
+</style>
 <style lang="scss" scoped>
 .head{
     width:100%;
@@ -180,6 +158,22 @@ export default {
 .text{
     text-align: left;
 }
+.menuList :first-child{
+  padding-top: 0px;
+}
+.menuList :hover{
+  color: #5c67ff;
+}
+
+.menuListLi{
+  text-align: center;
+  border-bottom: 1px solid #e6e6e6;
+  padding: 10px 0 3px 0;
+  cursor: pointer;
+}
+.menuListLi :first-child{
+  padding-right: 5px;
+}
 </style>
 <style lang="scss">
 .Evidence_details .el-table .el-table__cell {