v1.1.0 需求 coding...

src/modules/analysis/marker-statistics/index.vue

@@ -81,10 +81,11 @@
                 <span>{{ query.markerName }}</span>
               </div> -->
               <div class="flex items-center justify-between detail-info-table-header">
-                <div class="choose-score-info">
-                  <span class="txt">{{}}分段</span>
-                  <span class="close">&times;</span>
+                <div v-if="tableModel.score !== ''" class="choose-score-info">
+                  <span class="txt">{{ tableModel.score }}分段</span>
+                  <span class="close" @click="tableModel.score = ''">&times;</span>
                 </div>
+                <div v-else></div>
                 <btn-pagination v-model="currentPage" :pagination="pagination"></btn-pagination>
                 <!-- <el-button custom-1 size="small" class="detail-info-label">
                   <span class="">总数:</span>
@@ -221,6 +222,7 @@ const {
 const onRefresh = () => {
   fetchTable()
 }
+
 /** 预览试卷 */
 const onPreview = () => {
   previewModalVisible.value = true
@@ -233,6 +235,7 @@ const tableModel = reactive<any>({
   subjectCode: query.subjectCode as string,
   mainNumber: query.questionMainNumber as string,
 })
+;(window as any)._tableModel = tableModel
 const { pagination, currentPage, data, fetchTable } = useTable('getPersonalMarkDetail', tableModel)
 const {
   tableRef,
@@ -277,9 +280,14 @@ const imgOption = computed<SetImgBgOption>(() => {
 })
 const { drawing, dataUrl } = useSetImgBg(imgOption, frontColor, setFrontColor)
 onRefresh()
-
+watch(
+  () => tableModel.score,
+  () => {
+    fetchTable()
+  }
+)
 const model = reactive({
-  type: 'total',
+  type: 'today',
 })
 
 const formItems: EpFormItem[] = [
@@ -392,6 +400,7 @@ const columns: EpTableColumn<any>[] = [
 ]
 
 const onSearch = () => {
+  fetchTable()
   if (query.markerId) {
     const startTime = model.type === 'today' ? dayjs().startOf('day').format('YYYYMMDDHHmmss') : ''
     getStatisticObjectiveByMarker({
@@ -441,10 +450,7 @@ const markerSubjectiveChartsOption = computed<EChartsOption>(() => {
     tooltip: {
       trigger: 'axis',
       triggerOn: 'click',
-      // appendToBody:true,
-      // confine: true,
       enterable: true,
-      // extraCssText: 'max-width:70%;max-height:96%;overflow:auto',
       axisPointer: {
         type: 'line',
         crossStyle: {
@@ -454,55 +460,27 @@ const markerSubjectiveChartsOption = computed<EChartsOption>(() => {
           type: 'dashed',
         },
       },
-      // formatter: '{a0} {b0}: {c0}<br />{b1}: {c1}',
-      // formatter: function (params) {
-      //   let res = '';
-      //   for (let i = 0; i < params.length; i++) {
-      //     // console.log(params[i].name, params[i].seriesName, params[i].value)
-      //     const {seriesIndex} = params[i];
-      //     let groupNum = Object.keys(groupDataListMap).length;
-      //     let asIndexIndex = parseInt(seriesIndex/groupNum);
-      //     let fieldId = chooseIndexes[asIndexIndex].id;
-      //     let obj = (chartBindDatasetFields.length?chartBindDatasetFields:chooseIndexes).find(x=>x.id==fieldId);
-      //     let {dataFormatCode} = obj;
-      //     let func = floatFormatConfig.find(v => v.value == dataFormatCode).format;
-      //     var data = '<p>' + params[i].name + '</p>';
-      //     res += '<p class="padding:15px 0;">' + params[i].marker + params[i].seriesName + '<span style="font-weight:900;float:right;padding-left:15px;">' + (params[i].value?func(params[i].value):'-') + '</span>' + '</p>';
-      //   }
-      //   return data + res;
-      // }
       formatter: function (params: any) {
-        console.log('ppp', params)
         let html = `
-        <div style="margin: 0px 0 0;line-height:1;">
-            <div style="margin: 0px 0 0;line-height:1;">
-              <div style="font-size:14px;color:#666;font-weight:400;line-height:1;">${params[0].axisValue}</div>
-              <div style="margin: 10px 0 0;line-height:1;">
+            <div>
+              <div style="font-size:14px;color:#0091ff;font-weight:bold;text-decoration:underline;cursor:pointer;margin-bottom:8px" onclick="window._tableModel.score=${params[0].axisValue}">${params[0].axisValue}分段</div>
+              <div>
         `
         for (let i = 0; i < params.length; i++) {
           let item = params[i]
           html += `
-
-                <div style="margin: 0px 0 0;line-height:1;">
-                  <div style="margin: 0px 0 0;line-height:1;">
+                <div style="margin: 0px 0 0">
                     ${item.marker}
                     <span style="font-size:14px;color:#666;font-weight:400;margin-left:2px">${item.seriesName}</span>
                     <span style="float:right;margin-left:20px;font-size:14px;color:#666;font-weight:900">${item.data}</span>
                     <div style="clear:both"></div>
                   </div>
-                  <div style="clear:both"></div>
                 </div>
-
-
           `
         }
         html += `
-        <div style="clear:both"></div>
               </div>
-              <div style="clear:both"></div>
             </div>
-            <div style="clear:both"></div>
-          </div>
         `
         return html
       },
@@ -574,10 +552,7 @@ const markerObjectiveChartsOption = computed<EChartsOption>(() => {
     tooltip: {
       trigger: 'axis',
       triggerOn: 'click',
-      // appendToBody:true,
-      // confine: true,
       enterable: true,
-      // extraCssText: 'max-width:70%;max-height:96%;overflow:auto',
       axisPointer: {
         type: 'line',
         crossStyle: {
@@ -587,6 +562,30 @@ const markerObjectiveChartsOption = computed<EChartsOption>(() => {
           type: 'dashed',
         },
       },
+      // formatter: function (params: any) {
+      //   let html = `
+      //       <div>
+      //         <div style="font-size:14px;color:#0091ff;font-weight:bold;text-decoration:underline;cursor:pointer;margin-bottom:8px">${params[0].axisValue}分段</div>
+      //         <div>
+      //   `
+      //   for (let i = 0; i < params.length; i++) {
+      //     let item = params[i]
+      //     html += `
+      //           <div style="margin: 0px 0 0">
+      //               ${item.marker}
+      //               <span style="font-size:14px;color:#666;font-weight:400;margin-left:2px">${item.seriesName}</span>
+      //               <span style="float:right;margin-left:20px;font-size:14px;color:#666;font-weight:900">${item.data}</span>
+      //               <div style="clear:both"></div>
+      //             </div>
+      //           </div>
+      //     `
+      //   }
+      //   html += `
+      //         </div>
+      //       </div>
+      //   `
+      //   return html
+      // },
     },
     xAxis: {
       axisLine: { show: false },