添加套餐查询

src/views/component/taocans.vue

@@ -0,0 +1,166 @@
+<template>
+      <div>
+        <!-- <div>{{ datase }}</div> -->
+     <el-button type="success" @click="firstLoadQuyu()">查询</el-button> 
+    <el-table
+        :data="datase"
+        style="width: 100%,height:100%"
+        size="max"
+        
+        :span-method="objectSpanMethod"
+      >     <el-table-column
+            prop="tao_can_ming_chen"
+            label="套餐名称"
+            key="tao_can_ming_chen"
+            align="center"
+            :width=" 120 "
+          >
+        </el-table-column>
+        <el-table-column
+            prop="xiang_mu_ming_che"
+            label="检测项目"
+            key="xiang_mu_ming_che"
+            align="center"
+            :width=" 120 "
+          > </el-table-column>
+         <el-table-column
+            prop="jian_ce_fang_fa_"
+            label="检测方法"
+            key="jian_ce_fang_fa_"
+            align="center"
+            :width=" 120 "
+          > </el-table-column>
+          <el-table-column
+            prop="xiang_mu_dan_jia_"
+            label="项目单价(元)"
+            key="xiang_mu_dan_jia_"
+            align="center"
+            :width=" 120 "
+          > </el-table-column>
+          <el-table-column
+            prop="zhe_hou_jia_ge_"
+            label="折后价格(元)"
+            key="zhe_hou_jia_ge_"
+            align="center"
+            :width=" 120 "
+          > </el-table-column>
+      </el-table> 
+    </div>
+  </template>
+  
+  <script>
+    import curdPost from "@/business/platform/form/utils/custom/joinCURD.js";
+import { set } from 'vue';
+    export default {
+      data() {
+        return {
+          tableData: [{ 
+            id: '12987122',
+            name: '王小虎',
+            amount1: '234',
+            amount2: '3.2',
+            amount3: 10
+          }, {
+            id: '12987123',
+            name: '王小虎',
+            amount1: '165',
+            amount2: '4.43',
+            amount3: 12
+          }, {
+            id: '12987124',
+            name: '王小虎',
+            amount1: '324',
+            amount2: '1.9',
+            amount3: 9
+          }, {
+            id: '12987125',
+            name: '王小虎',
+            amount1: '621',
+            amount2: '2.2',
+            amount3: 17
+          }, {
+            id: '12987126',
+            name: '王小虎',
+            amount1: '539',
+            amount2: '4.1',
+            amount3: 15
+          }],
+          datase:[],
+          tableheader:[],
+          rowNumArr: [],
+          inde: 0,
+          spanArr:[],
+            pos:0,
+        };
+      },
+      props: {
+    field: Object,
+    formData: {
+      type: Object,
+      default() {
+        return {}
+      }
+    },
+    readonly: {
+      type: Boolean,
+      default: false,
+    }
+  },
+ mounted(){   
+    let this_= this;
+ 
+    setTimeout(()=>{
+       var  aa=this_.formData
+       console.log("th",this_.formData)
+       console.log("aa",aa)
+        let sqlString =`select  tc.tao_can_ming_chen,zb.xiang_mu_ming_che,jian_ce_fang_fa_,xiang_mu_dan_jia_,zhe_hou_jia_ge_  from  t_jctc   tc join t_tczb  zb on  tc.id_=zb.parent_id_  where  he_tong_bian_hao_='${this_.formData.heTongBianHao}'`
+       
+        curdPost("sql", sqlString).then((response) => {
+            console.log("response",response)
+            this_.datase = response.variables.data;
+            this_.getSpanArr(this_.datase)
+        })
+    },2000)
+        // let sqlString = `select * from t_bjd where id_='${this.formData.id}' order by create_time_ asc`;
+       // let sqlString =`select  tc.tao_can_ming_chen,zb.xiang_mu_ming_che,jian_ce_fang_fa_,xiang_mu_dan_jia_,zhe_hou_jia_ge_  from  t_jctc   tc join t_tczb  zb on  tc.id_=zb.parent_id_  where  he_tong_bian_hao_='C2023608'`
+
+        // this.tableheader = Object.keys(Object.assign({},...this.datase))
+ },
+      methods: {        
+        getSpanArr(data) {
+            for (var i = 0; i < data.length; i++) {
+                console.log(i)
+                if (i === 0) {
+                    this.spanArr.push(1);
+                    this.pos = 0;
+                } else {
+                // 判断当前元素与上一个元素是否相同
+                //这里的groupName是第一列的属性，我用来判断是否相同。
+                console.log(data[i].tao_can_ming_chen === data[i - 1].tao_can_ming_chen)
+                if (data[i].tao_can_ming_chen === data[i - 1].tao_can_ming_chen) {
+                    this.spanArr[this.pos] += 1;
+                    this.spanArr.push(0);
+                } else {
+                    this.spanArr.push(1);
+                    this.pos = i;
+                }
+                }
+                console.log(this.pos)
+            }
+            console.log(this.spanArr)
+        },
+    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
+        if (columnIndex === 0) {
+            const _row = this.spanArr[rowIndex];
+            const _col = _row > 0 ? 1 : 0;
+            return {
+            // _row = 0，_col = 0 表示这一次不合并，不显示，
+            // _row = 2，_col = 1 表示这一次合并第一列的两行
+            rowspan: _row,
+            colspan: _col,
+            };
+        }
+    },
+    }
+}
+  </script>