|  |  | 
 |  |  |             <el-row :gutter="20"> | 
 |  |  |               <el-col :span="10"> | 
 |  |  |                 <div class="home-user-task-stats"> | 
 |  |  |                   <p>{{ 11231 }}</p> | 
 |  |  |                   <p>{{ OutpatientData.rc }}</p> | 
 |  |  |                   <div class="text-color2"> | 
 |  |  |                     <p>门诊就诊量(人次)</p> | 
 |  |  |                   </div> | 
 |  |  | 
 |  |  |               </el-col> | 
 |  |  |               <el-col :span="10"> | 
 |  |  |                 <div class="home-user-task-stats"> | 
 |  |  |                   <p>{{ 9207 }}</p> | 
 |  |  |                   <p>{{ OutpatientData.rs }}</p> | 
 |  |  |                   <div class="text-color2"> | 
 |  |  |                     <p>门诊服务量(人次)</p> | 
 |  |  |                   </div> | 
 |  |  | 
 |  |  |             <el-row :gutter="20"> | 
 |  |  |               <el-col :span="10"> | 
 |  |  |                 <div class="home-user-task-stats"> | 
 |  |  |                   <p style="color: red">{{ 3453 }}</p> | 
 |  |  |                   <p style="color: red">{{ DischargeData.rc }}</p> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="text-color2"> | 
 |  |  |                   <p>出院就诊量(人次)</p> | 
 |  |  | 
 |  |  |               </el-col> | 
 |  |  |               <el-col :span="10"> | 
 |  |  |                 <div class="home-user-task-stats"> | 
 |  |  |                   <p style="color: red">{{ 4213 }}</p> | 
 |  |  |                   <p style="color: red">{{ DischargeData.rs }}</p> | 
 |  |  |                   <div class="text-color2"> | 
 |  |  |                     <p>出院服务量(人次)</p> | 
 |  |  |                   </div> | 
 |  |  | 
 |  |  |                 style="margin-left: 390px" | 
 |  |  |                 @change="changes" | 
 |  |  |               > | 
 |  |  |                 <el-radio-button label="周" @click="dyat = 7"></el-radio-button> | 
 |  |  |                 <el-radio-button | 
 |  |  |                   label="月" | 
 |  |  |                   @click="dyat = 30" | 
 |  |  |                   label="近一周" | 
 |  |  |                   @click="dyat = 7" | 
 |  |  |                 ></el-radio-button> | 
 |  |  |                 <el-radio-button | 
 |  |  |                   label="年" | 
 |  |  |                   @click="dyat = 360" | 
 |  |  |                   label="近一月" | 
 |  |  |                   @click="dyat = 31" | 
 |  |  |                 ></el-radio-button> | 
 |  |  |                 <el-radio-button | 
 |  |  |                   label="近一年" | 
 |  |  |                   @click="dyat = 365" | 
 |  |  |                 ></el-radio-button> | 
 |  |  |                 <el-radio-button label="自定义"> | 
 |  |  |                   <el-date-picker | 
 |  |  |                     v-if="radio1 === '自定义'" | 
 |  |  |                     v-model="customDateRange" | 
 |  |  |                     type="daterange" | 
 |  |  |                     range-separator="至" | 
 |  |  |                     start-placeholder="开始日期" | 
 |  |  |                     end-placeholder="结束日期" | 
 |  |  |                     value-format="yyyy-MM-dd" | 
 |  |  |                     @change="handleCustomDateChange" | 
 |  |  |                   ></el-date-picker> | 
 |  |  |                 </el-radio-button> | 
 |  |  |               </el-radio-group> | 
 |  |  |             </div> | 
 |  |  |             <!-- 中间echars --> | 
 |  |  |             <!-- 中部线性柱状图 --> | 
 |  |  |             <div class="boxEchars"> | 
 |  |  |               <div class="echars1" id="echars"></div> | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |         </el-col> | 
 |  |  |         <!-- 中间和右边 --> | 
 |  |  |         <!-- 右边列表 --> | 
 |  |  |         <el-col :span="4" class="aside"> | 
 |  |  |           <div class="grid-content bg-purple" style="margin-top: -180px"> | 
 |  |  |           <div class="grid-contentsa bg-purple" style="margin-top: -180px"> | 
 |  |  |             <div class="title"> | 
 |  |  |               科室服务量 | 
 |  |  |               <span>{{ endatd }} ~ {{ statd }}</span> | 
 |  |  |             </div> | 
 |  |  |             <div style="max-height: 690px; width: 100%; overflow: auto"> | 
 |  |  |               <el-table style="width: 100%" :data="SkuTop"> | 
 |  |  |             <div class="dept-table-container"> | 
 |  |  |               <el-table | 
 |  |  |                 v-if="SkuTop.length > 0" | 
 |  |  |                 style="width: 100%" | 
 |  |  |                 :data="SkuTop" | 
 |  |  |                 :height="tableHeight" | 
 |  |  |               > | 
 |  |  |                 <template v-for="(item, index) in SkuTop"></template> | 
 |  |  |                 <el-table-column | 
 |  |  |                   prop="order" | 
 |  |  | 
 |  |  |                   type="index" | 
 |  |  |                 ></el-table-column> | 
 |  |  |                 <el-table-column | 
 |  |  |                   prop="skuName" | 
 |  |  |                   width="88" | 
 |  |  |                   prop="deptname" | 
 |  |  |                   width="120" | 
 |  |  |                   class-name="name" | 
 |  |  |                 ></el-table-column> | 
 |  |  |  | 
 |  |  |                 <el-table-column prop="count" class-name="count"> | 
 |  |  |                   <template slot-scope="scope"> | 
 |  |  |                     {{ scope.row.count }}次 | 
 |  |  |                   </template> | 
 |  |  |                 <el-table-column prop="rc" class-name="rc"> | 
 |  |  |                   <template slot-scope="scope"> {{ scope.row.rc }}次 </template> | 
 |  |  |                 </el-table-column> | 
 |  |  |               </el-table> | 
 |  |  |               <div v-else class="empty-tip"> | 
 |  |  |                 <el-empty description="暂无科室服务数据"></el-empty> | 
 |  |  |               </div> | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |         </el-col> | 
 |  |  |       </el-row> | 
 |  |  |       <!-- 底部一个 --> | 
 |  |  |       <el-row :gutter="20" style="margin-bottom: 20px"> | 
 |  |  |         <el-col :span="24"> | 
 |  |  |         <!-- <el-col :span="24"> | 
 |  |  |           <div class="grid-content bg-purple" style="min-height: 300px"> | 
 |  |  |             <div class="title"> | 
 |  |  |               宣教统计 | 
 |  |  |               <span class="el-icon-s-unfold moreIcon"></span> | 
 |  |  |             </div> | 
 |  |  |             <div class="cooperate"> | 
 |  |  |               <!-- 合作区域 --> | 
 |  |  |               <div class="pieChart" id="pieCharts"></div> | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |         </el-col> | 
 |  |  |         </el-col> --> | 
 |  |  |         <!-- <el-col :span="9"> | 
 |  |  |           <div class="grid-content bg-purple" style="min-height: 300px"> | 
 |  |  |             <div class="title"> | 
 |  |  | 
 |  |  |   getechartsListCountdata, | 
 |  |  |   getechartsMedOuthospList, | 
 |  |  |   getechartsMedInhospList, | 
 |  |  |   getechartsandData, | 
 |  |  |   getServiceStatistics, | 
 |  |  |   getDeptRanking, | 
 |  |  | } from "@/api/AiCentre/index"; | 
 |  |  | import dayjs from "dayjs"; | 
 |  |  | 
 |  |  |       mypPieCharts: null, | 
 |  |  |       lastWidth: window.innerWidth, | 
 |  |  |       lastHeight: window.innerHeight, | 
 |  |  |       radio1: "周", | 
 |  |  |       radio1: "近一年", | 
 |  |  |       ticketStatistics: {}, | 
 |  |  |       timeTypeMap: { | 
 |  |  |         周: "day", | 
 |  |  |         月: "month", | 
 |  |  |         年: "year", | 
 |  |  |       }, | 
 |  |  |       DischargeData: { | 
 |  |  |         rs: "", | 
 |  |  |         rc: "", | 
 |  |  |       }, | 
 |  |  |       OutpatientData: { | 
 |  |  |         rs: "", | 
 |  |  |         rc: "", | 
 |  |  |       }, | 
 |  |  |       order: "", | 
 |  |  |       Count: "", | 
 |  |  |       datatni: [], | 
 |  |  | 
 |  |  |       SkuTop: [], | 
 |  |  |       cylinderSeries: [], | 
 |  |  |       cylinderXAxis: [], | 
 |  |  |       dyat: 30, | 
 |  |  |       customDateRange: [], // 自定义日期范围 | 
 |  |  |       dyat: 365, | 
 |  |  |       intervalId: null, | 
 |  |  |     }; | 
 |  |  |   }, | 
 |  |  | 
 |  |  |       return dayjs().subtract(this.dyat, "day").format("YYYY-MM-DD HH:mm:ss"); | 
 |  |  |     }, | 
 |  |  |     statd() { | 
 |  |  |       if (this.radio1 === "自定义" && this.customDateRange.length > 0) { | 
 |  |  |         return this.customDateRange[1]; | 
 |  |  |       } | 
 |  |  |       return dayjs().format("YYYY-MM-DD"); | 
 |  |  |     }, | 
 |  |  |     endatd() { | 
 |  |  |       if (this.radio1 === "自定义" && this.customDateRange.length > 0) { | 
 |  |  |         return this.customDateRange[0]; | 
 |  |  |       } | 
 |  |  |       return dayjs().subtract(this.dyat, "day").format("YYYY-MM-DD"); | 
 |  |  |     }, | 
 |  |  |     tableHeight() { | 
 |  |  |       // 根据数据量动态计算高度 | 
 |  |  |       const rowHeight = 40; // 每行大约高度 | 
 |  |  |       const headerHeight = 40; // 表头高度 | 
 |  |  |       const minHeight = 500; // 最小高度 | 
 |  |  |       const maxHeight = 600; // 最大高度 | 
 |  |  |  | 
 |  |  |       const calculatedHeight = this.SkuTop.length * rowHeight + headerHeight; | 
 |  |  |       return Math.min(Math.max(calculatedHeight, minHeight), maxHeight); | 
 |  |  |     }, | 
 |  |  |   }, | 
 |  |  |   created() { | 
 |  |  |     // this.getTopdata(); | 
 |  |  |     // this.getgraphdata(); | 
 |  |  |     this.getTopdata(); | 
 |  |  |     this.getgraphdata(); | 
 |  |  |     // this.getranking(); | 
 |  |  |     this.$nextTick(function () { | 
 |  |  |       this.getregionAmountCollect(); | 
 |  |  |       this.myEcharts2(); | 
 |  |  |       this.getnodeCollect(); | 
 |  |  |       this.getSkuTop(); | 
 |  |  |     }); | 
 |  |  | 
 |  |  |   methods: { | 
 |  |  |     // 改变时间事件 | 
 |  |  |     changes() { | 
 |  |  |       if (this.radio1 == "周") { | 
 |  |  |         this.dyat = 7; | 
 |  |  |       } else if (this.radio1 == "月") { | 
 |  |  |         this.dyat = 30; | 
 |  |  |       } else { | 
 |  |  |         this.dyat = 360; | 
 |  |  |       switch (this.radio1) { | 
 |  |  |         case "近一周": | 
 |  |  |           this.dyat = 7; | 
 |  |  |           break; | 
 |  |  |         case "近一月": | 
 |  |  |           this.dyat = 30; | 
 |  |  |           break; | 
 |  |  |         case "近一年": | 
 |  |  |           this.dyat = 365; | 
 |  |  |           break; | 
 |  |  |         case "自定义": | 
 |  |  |           // 自定义日期处理在handleCustomDateChange方法中 | 
 |  |  |           return; | 
 |  |  |       } | 
 |  |  |       this.refreshData(); | 
 |  |  |     }, | 
 |  |  |  | 
 |  |  |     // 处理自定义日期变化 | 
 |  |  |     handleCustomDateChange(range) { | 
 |  |  |       if (!range || range.length !== 2) return; | 
 |  |  |  | 
 |  |  |       this.customDateRange = range; | 
 |  |  |       this.refreshData(); | 
 |  |  |     }, | 
 |  |  |  | 
 |  |  |     // 统一刷新数据的方法 | 
 |  |  |     refreshData() { | 
 |  |  |       this.getgraphdata(); | 
 |  |  |       this.getranking(); | 
 |  |  |       // this.getranking(); | 
 |  |  |       this.getTopdata(); | 
 |  |  |       this.getregionAmountCollect(); | 
 |  |  |       this.myEcharts2(); | 
 |  |  |       this.getnodeCollect(); | 
 |  |  |       this.getSkuTop(); | 
 |  |  |     }, | 
 |  |  | 
 |  |  |     }, | 
 |  |  |     // top排行 | 
 |  |  |     async getSkuTop() { | 
 |  |  |       // const res = await getSkuTop(10, this.endatd, this.statd); | 
 |  |  |       // this.SkuTop = res.data; | 
 |  |  |       this.SkuTop = [ | 
 |  |  |         { amount: 0, count: 123, skuId: "0", skuName: "心肺科" }, | 
 |  |  |         { amount: 0, count: 122, skuId: "0", skuName: "肾脏科" }, | 
 |  |  |         { amount: 0, count: 112, skuId: "0", skuName: "泌尿科" }, | 
 |  |  |         { amount: 0, count: 111, skuId: "0", skuName: "男科" }, | 
 |  |  |         { amount: 0, count: 102, skuId: "0", skuName: "妇产科" }, | 
 |  |  |         { amount: 0, count: 98, skuId: "0", skuName: "外科" }, | 
 |  |  |         { amount: 0, count: 89, skuId: "0", skuName: "急诊" }, | 
 |  |  |         { amount: 0, count: 88, skuId: "0", skuName: "器械科" }, | 
 |  |  |         { amount: 0, count: 87, skuId: "0", skuName: "骨科" }, | 
 |  |  |         { amount: 0, count: 67, skuId: "0", skuName: "放射科" }, | 
 |  |  |         { amount: 0, count: 89, skuId: "0", skuName: "急诊" }, | 
 |  |  |         { amount: 0, count: 88, skuId: "0", skuName: "器械科" }, | 
 |  |  |         { amount: 0, count: 87, skuId: "0", skuName: "骨科" }, | 
 |  |  |         { amount: 0, count: 67, skuId: "0", skuName: "放射科1" }, | 
 |  |  |         { amount: 0, count: 67, skuId: "0", skuName: "放射科2" }, | 
 |  |  |       ]; | 
 |  |  |       let Rankingdata = { | 
 |  |  |         startDate: this.endatd, | 
 |  |  |         endDate: this.statd, | 
 |  |  |         cy: 1, | 
 |  |  |       }; | 
 |  |  |       await getDeptRanking(Rankingdata).then((res) => { | 
 |  |  |         if (res.code == 200) { | 
 |  |  |           this.SkuTop = res.rows.sort((a, b) => b.rc - a.rc); | 
 |  |  |           console.log(this.SkuTop, "this.SkuTop"); | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  |  | 
 |  |  |       // this.SkuTop = [ | 
 |  |  |       //   { amount: 0, count: 123, skuId: "0", skuName: "心肺科" }, | 
 |  |  |       //   { amount: 0, count: 122, skuId: "0", skuName: "肾脏科" }, | 
 |  |  |       //   { amount: 0, count: 112, skuId: "0", skuName: "泌尿科" }, | 
 |  |  |       //   { amount: 0, count: 111, skuId: "0", skuName: "男科" }, | 
 |  |  |       //   { amount: 0, count: 102, skuId: "0", skuName: "妇产科" }, | 
 |  |  |       //   { amount: 0, count: 98, skuId: "0", skuName: "外科" }, | 
 |  |  |       //   { amount: 0, count: 89, skuId: "0", skuName: "急诊" }, | 
 |  |  |       //   { amount: 0, count: 88, skuId: "0", skuName: "器械科" }, | 
 |  |  |       //   { amount: 0, count: 87, skuId: "0", skuName: "骨科" }, | 
 |  |  |       //   { amount: 0, count: 67, skuId: "0", skuName: "放射科" }, | 
 |  |  |       //   { amount: 0, count: 89, skuId: "0", skuName: "急诊" }, | 
 |  |  |       //   { amount: 0, count: 88, skuId: "0", skuName: "器械科" }, | 
 |  |  |       //   { amount: 0, count: 87, skuId: "0", skuName: "骨科" }, | 
 |  |  |       //   { amount: 0, count: 67, skuId: "0", skuName: "放射科1" }, | 
 |  |  |       //   { amount: 0, count: 67, skuId: "0", skuName: "放射科2" }, | 
 |  |  |       // ]; | 
 |  |  |     }, | 
 |  |  |     // 获取头部数据 | 
 |  |  |     getTopdata() { | 
 |  |  | 
 |  |  |         endDate: this.statd, | 
 |  |  |         cy: 1, | 
 |  |  |       }; | 
 |  |  |       getEChartsPatMedOuthospCount(hospCountdata).then((res) => {}); | 
 |  |  |       getechartsListCountdata(Countdata).then((res) => {}); | 
 |  |  |     }, | 
 |  |  |     // 获取就诊数量 | 
 |  |  |     getranking() { | 
 |  |  |       let Rankingdata = { | 
 |  |  |         startDate: this.endatd, | 
 |  |  |         endDate: this.statd, | 
 |  |  |         cy: 1, | 
 |  |  |       }; | 
 |  |  |       getDeptRanking(Rankingdata).then((res) => {}); | 
 |  |  |       // 查询门诊看病人次和人数 | 
 |  |  |       getEChartsPatMedOuthospCount(hospCountdata).then((res) => { | 
 |  |  |         if (res.code == 200) { | 
 |  |  |           this.OutpatientData = res.data; | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  |       // 查询出、入院看病人次和人数 | 
 |  |  |       getechartsListCountdata(Countdata).then((res) => { | 
 |  |  |         if (res.code == 200) { | 
 |  |  |           this.DischargeData = res.data; | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  |     }, | 
 |  |  |     // 获取中部线柱图数据 | 
 |  |  |     getgraphdata() { | 
 |  |  |       let Outhospdata = { | 
 |  |  |     getranking() {}, | 
 |  |  |  | 
 |  |  |     async getgraphdata() { | 
 |  |  |       let params = { | 
 |  |  |         startDate: this.endatd, | 
 |  |  |         endDate: this.statd, | 
 |  |  |         cy: 1, | 
 |  |  |         timeType: this.getTimeType(), | 
 |  |  |       }; | 
 |  |  |       let Inhospdata = { | 
 |  |  |         startDate: this.endatd, | 
 |  |  |         endDate: this.statd, | 
 |  |  |         cy: 1, | 
 |  |  |       }; | 
 |  |  |       getechartsMedOuthospList(Outhospdata).then((res) => {}); | 
 |  |  |       getechartsMedInhospList(Inhospdata).then((res) => {}); | 
 |  |  |  | 
 |  |  |       try { | 
 |  |  |         const res = await getServiceStatistics(params); | 
 |  |  |         if (res.code === 200) { | 
 |  |  |           this.processChartData(res.data); | 
 |  |  |         } | 
 |  |  |       } catch (error) { | 
 |  |  |         console.error("获取图表数据失败:", error); | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |  | 
 |  |  |     // 获取时间类型 | 
 |  |  |     getTimeType() { | 
 |  |  |       if (this.radio1 === "近一周" || this.radio1 === "近一月") { | 
 |  |  |         return "day"; | 
 |  |  |       } | 
 |  |  |  | 
 |  |  |       if (this.radio1 === "近一年") { | 
 |  |  |         return "month"; | 
 |  |  |       } | 
 |  |  |  | 
 |  |  |       // 自定义日期范围 | 
 |  |  |       if (this.radio1 === "自定义" && this.customDateRange.length === 2) { | 
 |  |  |         const start = dayjs(this.customDateRange[0]); | 
 |  |  |         const end = dayjs(this.customDateRange[1]); | 
 |  |  |         const diffDays = end.diff(start, "day"); | 
 |  |  |  | 
 |  |  |         return diffDays > 60 ? "month" : "day"; | 
 |  |  |       } | 
 |  |  |  | 
 |  |  |       return "day"; // 默认返回day类型 | 
 |  |  |     }, | 
 |  |  |     processChartData(data) { | 
 |  |  |       // 按时间排序确保数据顺序正确 | 
 |  |  |       const sortedData = [...data].sort( | 
 |  |  |         (a, b) => new Date(a.timePeriod) - new Date(b.timePeriod) | 
 |  |  |       ); | 
 |  |  |  | 
 |  |  |       const xAxisData = []; | 
 |  |  |       const dischargeFollowData = []; | 
 |  |  |       const outpatientFollowData = []; | 
 |  |  |       const pmiData = []; | 
 |  |  |       const pmoData = []; | 
 |  |  |  | 
 |  |  |       sortedData.forEach((item) => { | 
 |  |  |         // 根据时间类型格式化显示 | 
 |  |  |         const timeType = this.getTimeType(); | 
 |  |  |         const timeLabel = | 
 |  |  |           timeType === "day" | 
 |  |  |             ? dayjs(item.timePeriod).format("MM-DD") | 
 |  |  |             : dayjs(item.timePeriod).format("YYYY-MM"); | 
 |  |  |  | 
 |  |  |         xAxisData.push(timeLabel); | 
 |  |  |         dischargeFollowData.push(item.dischargeFollowCount); | 
 |  |  |         outpatientFollowData.push(item.outpatientFollowCount); | 
 |  |  |         pmiData.push(item.pmiCount); | 
 |  |  |         pmoData.push(item.pmoCount); | 
 |  |  |       }); | 
 |  |  |  | 
 |  |  |       // 更新图表 | 
 |  |  |       this.updateChart( | 
 |  |  |         xAxisData, | 
 |  |  |         dischargeFollowData, | 
 |  |  |         outpatientFollowData, | 
 |  |  |         pmiData, | 
 |  |  |         pmoData | 
 |  |  |       ); | 
 |  |  |     }, | 
 |  |  |     updateChart( | 
 |  |  |       xAxisData, | 
 |  |  |       dischargeFollowData, | 
 |  |  |       outpatientFollowData, | 
 |  |  |       pmiData, | 
 |  |  |       pmoData | 
 |  |  |     ) { | 
 |  |  |       if (!this.myChart2) { | 
 |  |  |         this.myEcharts2(); | 
 |  |  |         return; | 
 |  |  |       } | 
 |  |  |  | 
 |  |  |       // 计算随访量的最大值 | 
 |  |  |       const maxFollow = Math.max( | 
 |  |  |         ...dischargeFollowData, | 
 |  |  |         ...outpatientFollowData | 
 |  |  |       ); | 
 |  |  |       // 计算服务人次的最大值 | 
 |  |  |       const maxService = Math.max(...pmiData, ...pmoData); | 
 |  |  |  | 
 |  |  |       // 动态计算interval值 | 
 |  |  |       const followInterval = this.calculateOptimalInterval(maxFollow); | 
 |  |  |       const serviceInterval = this.calculateOptimalInterval(maxService); | 
 |  |  |  | 
 |  |  |       const option = { | 
 |  |  |         xAxis: { | 
 |  |  |           data: xAxisData, | 
 |  |  |         }, | 
 |  |  |         yAxis: [ | 
 |  |  |           { | 
 |  |  |             interval: followInterval, | 
 |  |  |             max: Math.ceil(maxFollow / followInterval) * followInterval, | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             interval: serviceInterval, | 
 |  |  |             max: Math.ceil(maxService / serviceInterval) * serviceInterval, | 
 |  |  |           }, | 
 |  |  |         ], | 
 |  |  |         series: [ | 
 |  |  |           { data: dischargeFollowData }, | 
 |  |  |           { data: outpatientFollowData }, | 
 |  |  |           { data: pmiData }, | 
 |  |  |           { data: pmoData }, | 
 |  |  |         ], | 
 |  |  |       }; | 
 |  |  |  | 
 |  |  |       this.myChart2.setOption(option); | 
 |  |  |     }, | 
 |  |  |  | 
 |  |  |     // 计算最优的interval值 | 
 |  |  |     calculateOptimalInterval(maxValue) { | 
 |  |  |       if (maxValue <= 0) return 50; // 默认值 | 
 |  |  |  | 
 |  |  |       // 根据最大值计算合适的间隔 | 
 |  |  |       const magnitude = Math.pow(10, Math.floor(Math.log10(maxValue))); | 
 |  |  |       const stepRatio = maxValue / magnitude; | 
 |  |  |  | 
 |  |  |       let interval; | 
 |  |  |       if (stepRatio > 5) { | 
 |  |  |         interval = magnitude; | 
 |  |  |       } else if (stepRatio > 2) { | 
 |  |  |         interval = magnitude / 2; | 
 |  |  |       } else { | 
 |  |  |         interval = magnitude / 5; | 
 |  |  |       } | 
 |  |  |  | 
 |  |  |       // 确保interval是整数 | 
 |  |  |       interval = Math.round(interval); | 
 |  |  |  | 
 |  |  |       // 限制最小间隔 | 
 |  |  |       return Math.max(interval, 50); | 
 |  |  |     }, | 
 |  |  |     // 获取线状图时间 | 
 |  |  |     async getregionAmountCollect() { | 
 |  |  |       //getregionAmountCollect(1, this.endatd, this.statd); | 
 |  |  | 
 |  |  |       this.series = [123, 123, 223, 212, 432, 123, 442, 234]; | 
 |  |  |       this.myEcharts2(); | 
 |  |  |     }, | 
 |  |  |     // 线性图 | 
 |  |  |     // 线性图及柱状图 | 
 |  |  |     myEcharts2() { | 
 |  |  |       var echarts = require("echarts"); | 
 |  |  |       var myChart2 = echarts.init(document.getElementById("echars")); | 
 |  |  |       this.myChart2 = myChart2; | 
 |  |  |  | 
 |  |  |       var option2 = { | 
 |  |  |         tooltip: { | 
 |  |  |           trigger: "axis", | 
 |  |  | 
 |  |  |           }, | 
 |  |  |         }, | 
 |  |  |         legend: { | 
 |  |  |           data: [ | 
 |  |  |             "出院随访量", | 
 |  |  |             "门诊随访量", | 
 |  |  |             // "在院随访量", | 
 |  |  |             // "门诊复诊通知", | 
 |  |  |             "出院服务人次", | 
 |  |  |             "门诊服务人次", | 
 |  |  |           ], | 
 |  |  |           data: ["出院服务量", "门诊服务量", "出院就诊人次", "门诊就诊人次"], | 
 |  |  |         }, | 
 |  |  |         xAxis: [ | 
 |  |  |           { | 
 |  |  |             type: "category", | 
 |  |  |             data: [ | 
 |  |  |               "一月", | 
 |  |  |               "二月", | 
 |  |  |               "三月", | 
 |  |  |               "四月", | 
 |  |  |               "五月", | 
 |  |  |               "六月", | 
 |  |  |               "七月", | 
 |  |  |               "八月", | 
 |  |  |               "九月", | 
 |  |  |               "十月", | 
 |  |  |             ], | 
 |  |  |             data: [], // 初始为空,将通过API数据填充 | 
 |  |  |             axisPointer: { | 
 |  |  |               type: "shadow", | 
 |  |  |             }, | 
 |  |  | 
 |  |  |             type: "value", | 
 |  |  |             name: "随访量", | 
 |  |  |             min: 0, | 
 |  |  |             max: 250, | 
 |  |  |             interval: 50, | 
 |  |  |             axisLabel: { | 
 |  |  |               formatter: "{value} 人", | 
 |  |  |             }, | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             type: "value", | 
 |  |  |             name: "复诊/评估次数", | 
 |  |  |             name: "服务人次", | 
 |  |  |             min: 0, | 
 |  |  |             max: 250, | 
 |  |  |             interval: 50, | 
 |  |  |             axisLabel: { | 
 |  |  |               formatter: "{value} 次", | 
 |  |  |             }, | 
 |  |  | 
 |  |  |         grid: { top: "35%" }, | 
 |  |  |         series: [ | 
 |  |  |           { | 
 |  |  |             name: "出院随访量", | 
 |  |  |             name: "出院服务量", | 
 |  |  |             type: "bar", | 
 |  |  |             tooltip: { | 
 |  |  |               valueFormatter: function (value) { | 
 |  |  |                 return value + " 人"; | 
 |  |  |               }, | 
 |  |  |             }, | 
 |  |  |             data: [120, 150, 165, 90, 140, 200, 130, 85, 175, 95, 110, 160], | 
 |  |  |             data: [], // 初始为空,将通过API数据填充 | 
 |  |  |           }, | 
 |  |  |           // { | 
 |  |  |           //   name: "影像随访量", | 
 |  |  |           //   type: "bar", | 
 |  |  |           //   tooltip: { | 
 |  |  |           //     valueFormatter: function (value) { | 
 |  |  |           //       return value + " 人"; | 
 |  |  |           //     }, | 
 |  |  |           //   }, | 
 |  |  |           //   data: [102, 190, 135, 88, 175, 160, 83, 145, 200, 110, 97, 180], | 
 |  |  |           // }, | 
 |  |  |           { | 
 |  |  |             name: "门诊随访量", | 
 |  |  |             name: "门诊服务量", | 
 |  |  |             type: "bar", | 
 |  |  |             tooltip: { | 
 |  |  |               valueFormatter: function (value) { | 
 |  |  |                 return value + " 人"; | 
 |  |  |               }, | 
 |  |  |             }, | 
 |  |  |             data: [145, 92, 178, 134, 167, 85, 199, 112, 156, 88, 120, 145], | 
 |  |  |             data: [], // 初始为空,将通过API数据填充 | 
 |  |  |           }, | 
 |  |  |  | 
 |  |  |           // { | 
 |  |  |           //   name: "出院复诊通知", | 
 |  |  |           //   type: "line", | 
 |  |  |           //   smooth: 0.3, | 
 |  |  |           //   yAxisIndex: 1, | 
 |  |  |           //   tooltip: { | 
 |  |  |           //     valueFormatter: function (value) { | 
 |  |  |           //       return value + " 次"; | 
 |  |  |           //     }, | 
 |  |  |           //   }, | 
 |  |  |           //   data: [45, 123, 78, 156, 89, 34, 199, 112, 67, 145, 88, 175], | 
 |  |  |           // }, | 
 |  |  |           { | 
 |  |  |             name: "出院服务人次", | 
 |  |  |             name: "出院就诊人次", | 
 |  |  |             type: "line", | 
 |  |  |             smooth: 0.3, | 
 |  |  |             yAxisIndex: 1, | 
 |  |  | 
 |  |  |                 return value + " 次"; | 
 |  |  |               }, | 
 |  |  |             }, | 
 |  |  |             data: [102, 190, 135, 88, 175, 160, 83, 145, 200, 110, 97, 180], | 
 |  |  |             data: [], // 初始为空,将通过API数据填充 | 
 |  |  |           }, | 
 |  |  |           { | 
 |  |  |             name: "门诊服务人次", | 
 |  |  |             name: "门诊就诊人次", | 
 |  |  |             type: "line", | 
 |  |  |             smooth: 0.3, | 
 |  |  |             yAxisIndex: 1, | 
 |  |  | 
 |  |  |                 return value + " 次"; | 
 |  |  |               }, | 
 |  |  |             }, | 
 |  |  |             data: [120, 150, 165, 90, 140, 200, 130, 85, 175, 95, 110, 160], | 
 |  |  |             data: [], // 初始为空,将通过API数据填充 | 
 |  |  |           }, | 
 |  |  |         ], | 
 |  |  |       }; | 
 |  |  |       myChart2.on("updateAxisPointer", function (event) { | 
 |  |  |         const xAxisInfo = event.axesInfo[0]; | 
 |  |  |         if (xAxisInfo) { | 
 |  |  |           const dimension = xAxisInfo.value + 1; | 
 |  |  |           myChart2.setOption({ | 
 |  |  |             series: { | 
 |  |  |               id: "pie", | 
 |  |  |               label: { | 
 |  |  |                 formatter: "{b}: {@[" + dimension + "]} ", | 
 |  |  |               }, | 
 |  |  |               encode: { | 
 |  |  |                 value: dimension, | 
 |  |  |                 tooltip: dimension, | 
 |  |  |               }, | 
 |  |  |             }, | 
 |  |  |           }); | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  |  | 
 |  |  |       myChart2.setOption(option2); | 
 |  |  |  | 
 |  |  |       // 初始加载数据 | 
 |  |  |       this.getgraphdata(); | 
 |  |  |     }, | 
 |  |  |     // 饼状图 | 
 |  |  |     myPieChart() { | 
 |  |  | 
 |  |  |   .echars1 { | 
 |  |  |     flex: 1; | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | .dept-table-container { | 
 |  |  |   flex: 1; | 
 |  |  |   display: flex; | 
 |  |  |   flex-direction: column; | 
 |  |  |   min-height: 0; /* 重要:允许内容收缩 */ | 
 |  |  | } | 
 |  |  | ::v-deep .el-table { | 
 |  |  |   td:first-child { | 
 |  |  | 
 |  |  |   padding: 0 10px; | 
 |  |  |   text-align: center; | 
 |  |  | } | 
 |  |  | .grid-contentsa { | 
 |  |  |   min-height: 600px; | 
 |  |  |   border-radius: 20px; | 
 |  |  |   padding: 0 10px; | 
 |  |  |   text-align: center; | 
 |  |  | } | 
 |  |  |  | 
 |  |  | .grid-contents { | 
 |  |  |   min-height: 36px; |