井史简介

vue/src/components/basic/chart/chart-prod-dynamics.vue

@@ -99,7 +99,7 @@
     },
     mounted(){
       console.log("mounted" , this.id);
-      this.readerChart();
+      this.onFinish();
     },
     methods:{
       onFinish: async function (){

vue/src/views/wellinfo/detail.vue

@@ -40,9 +40,7 @@
                             :style="cardSettings.buttonStyle"/>
       </template>
       <div v-if="cardSettings.cardChat.expand">
-        <p>Card content</p>
-        <p>Card content</p>
-        <p>Card content</p>
+        <ChartProdDynmics :wellId="dataModel.well_id"></ChartProdDynmics>
       </div>
     </a-card>
     <a-card title="基本信息" :bordered="false" :headStyle="cardSettings.cardHeadStyle" class="card-detail">
@@ -230,10 +228,11 @@ import dayjs from "dayjs";
 import {useRoute} from "vue-router";
 import router from "@/router";
 import * as columns from './columns';
+import ChartProdDynmics from '@/components/basic/chart/chart-prod-dynamics.vue'
 
 export default defineComponent({
   name: 'wellinfoDetail',
-  components: {},
+  components: {ChartProdDynmics},
   setup() {
     const tabsViewStore = useTabsViewStore();
     const route = useRoute();

vue/src/views/wellinfo/index.vue

@@ -123,6 +123,16 @@
                    :row-key="record=>record.tempId" :pagination="false"
                    bordered>
             <template #bodyCell="{ column,record }">
+              <template v-if="column.dataIndex === 'oil'">
+                <div style="height:25px">
+                  <ChartCell :timeType="('month')" :dataType="('oil')" :wellId="record.well_id"></ChartCell>
+                </div>
+              </template>
+              <template v-if="column.dataIndex === 'gas'">
+                <div style="height:25px">
+                  <ChartCell :timeType="('month')" :dataType="('gas')" :wellId="record.well_id"></ChartCell>
+                </div>
+              </template>
               <template v-if="column.key === 'well_id'">
                 <a-button type="link" size="small" @click="detail(record.well_id)">{{ record.well_id }}</a-button>
               </template>
@@ -163,7 +173,11 @@
                   <tr>
                     <th>月产油量：</th>
                     <td>{{ item.oil_prod_mon }}t</td>
-                    <td colspan="2" rowspan="2"></td>
+                    <td colspan="2" rowspan="2">
+                      <div style="height:25px">
+                        <ChartCell :timeType="('month')" :dataType="('oil')" :wellId="item.well_id"></ChartCell>
+                      </div>
+                    </td>
                   </tr>
                   <tr>
                     <th>累产油量：</th>
@@ -172,7 +186,11 @@
                   <tr>
                     <th>月产气量：</th>
                     <td>{{ item.gas_prod_mon }}m³</td>
-                    <td colspan="2" rowspan="2"></td>
+                    <td colspan="2" rowspan="2">
+                      <div style="height:25px">
+                        <ChartCell :timeType="('month')" :dataType="('gas')" :wellId="item.well_id"></ChartCell>
+                      </div>
+                    </td>
                   </tr>
                   <tr>
                     <th>累产气量：</th>
@@ -224,10 +242,11 @@ import dayjs from "dayjs";
 import {getPaginationTotalTitle} from "@/utils/common";
 import type {TableProps} from "ant-design-vue";
 import {useTabsViewStore} from "@/store/modules/tabsView";
+import ChartCell from '@/components/basic/chart/chart-cell.vue'
 
 export default defineComponent({
   name: 'wellinfoindex',
-  components: {},
+  components: {ChartCell},
   setup() {
     const route = useRoute();
     const expand = ref(false);
@@ -316,10 +335,10 @@ export default defineComponent({
       },
       {title: '月产油量(t)', dataIndex: 'oil_prod_mon', key: 'oil_prod_mon', width: 120},
       {title: '累产油量(t)', dataIndex: 'oil_prod_year', key: 'oil_prod_year', width: 120},
-      {title: '累产油量趋势', dataIndex: 'tempNo', key: 'tempNo', width: 150},
+      {title: '累产油量趋势', dataIndex: 'oil', key: 'oil', width: 150},
       {title: '月产气量(m³)', dataIndex: 'gas_prod_mon', key: 'gas_prod_mon', width: 120},
       {title: '累产气量(m³)', dataIndex: 'gas_prod_year', key: 'gas_prod_year', width: 120},
-      {title: '累产油量趋势', dataIndex: 'tempNo', key: 'tempNo', width: 150},
+      {title: '累产气量趋势', dataIndex: 'gas', key: 'gas', width: 150},
       {title: '操作列', dataIndex: 'operation', key: 'operation', align: 'center', width: 120}
     ];
     const getTdColor = (water_cut) => {