合并冲突

src/api/hzyb/chart.js

@@ -6,8 +6,8 @@ import {get,post} from './http'
  * 图表详情
  * @param ChartInfoId 图表ID
  * @param DateType 时段筛选：1-00年至今; 2-10年至今; 3-15年至今; 4-21年至今; 5-指定区间; 6-指定年月至今; 7-18年至今; 8-19年至今; 9-20年至今
- * @param startDate 自定义开始日期
- * @param endDate 自定义结束日期
+ * @param StartDate 自定义开始日期
+ * @param EndDate 自定义结束日期
  * @param SeasonStartDate 季节性图表-开始日期
  * @param SeasonEndDate 季节性图表-结束日期
  * @param EdbInfoId 指标ID，多个用英文逗号隔开

src/api/hzyb/http.js

@@ -14,7 +14,7 @@ let LOADING;
 console.log(import.meta.env.VITE_APP_HZYB_BASEAPIURL);
 let config = {
   baseURL: import.meta.env.VITE_APP_HZYB_BASEAPIURL,
-  timeout: 60 * 1000, // Timeout
+  timeout: 10*60 * 1000, // Timeout
   // withCredentials: true, // Check cross-site Access-Control
 };
 
@@ -53,12 +53,12 @@ _axios.interceptors.response.use(
       LOADING.clear();
     }
 
-    let data=response.data
-    // if(import.meta.env.MODE==='product'){
-    //   const data=JSON.parse(CryptoJS.Des3Decrypt(response.data));//解密
-    // }else{
-    //   data=response.data
-    // }
+    let data
+    if(import.meta.env.MODE==='product'){
+      data=JSON.parse(CryptoJS.Des3Decrypt(response.data));//解密
+    }else{
+      data=response.data
+    }
     if(data.code!==200){
       setTimeout(() => {
         Toast(data.msg)

src/style/common.scss

@@ -14,4 +14,7 @@ p,span {
 }
 a {
     text-decoration: none;
+}
+input{
+    -webkit-appearance: none;
 }

src/views/hzyb/chart/Detail.vue

@@ -18,7 +18,7 @@ let canSave=ref(false)//是否有保存功能
 const getUserInfo=async ()=>{
     const res=await apiUserInfo({Authorization:route.query.token})
     if(res.code===200){
-        if(res.data.company_name==='弘则研究'){
+        if(res.data.is_inner){
             canSave.value=true
         }
     }
@@ -36,25 +36,39 @@ const makeTimeData=(type)=>{
     let yearArr=[]
     let monthArr=[]
     for (let i = 2010; i <= curYear; i++) {
-        yearArr.push(i)
+        yearArr.push(i.toString())
     }
     for (let i = 1; i < 13; i++) {
-        monthArr.push(i<10?'0'+i:i)
+        monthArr.push(i<10?'0'+i:i.toString())
     }
     if(type==1){
-        return [{values:yearArr},{values:monthArr},{values:yearArr},{values:monthArr}]
+        let index1=yearArr.indexOf(startDate.value.split('-')[0])
+        let index2=monthArr.indexOf(startDate.value.split('-')[1])
+        let index3=yearArr.indexOf(endDate.value.split('-')[0])
+        let index4=monthArr.indexOf(endDate.value.split('-')[1])
+        return [
+            {values:yearArr,defaultIndex: index1>-1?index1:yearArr.length-1},
+            {values:monthArr,defaultIndex: index2>-1?index2:monthArr.length-1},
+            {values:yearArr,defaultIndex: index3>-1?index3:yearArr.length-1},
+            {values:monthArr,defaultIndex: index4>-1?index4:monthArr.length-1}
+        ]
     }else{
-        return [{values:yearArr},{values:yearArr}]
+        let index1=yearArr.indexOf(startDate.value)
+        let index2=yearArr.indexOf(endDate.value)
+        return [
+            {values:yearArr,defaultIndex: index1>-1?index1:yearArr.length-1},
+            {values:yearArr,defaultIndex: index2>-1?index2:yearArr.length-1}
+        ]
     }
 }
 const handleShowDate=()=>{
-    if(columns.value.length===0){
+    // if(columns.value.length===0){
         if(resData.value.ChartInfo.ChartType===1){//曲线图
             columns.value=makeTimeData(1)
         }else if(resData.value.ChartInfo.ChartType===2){//季节性图表
             columns.value=makeTimeData(2)
         }
-    }
+    // }
     showDate.value=true
 }
 // 确定选择时间
@@ -67,10 +81,10 @@ const handleConfirmDate=(e)=>{
         start=e[0]
         end=e[1]
     }
-    if(new Date(end)>new Date(start)){
+    if(new Date(end)>=new Date(start)){
         startDate.value=start
         endDate.value=end
-        dataType.value=5
+        dateType.value=5
         getChartInfo()
         showDate.value=false
     }else{
@@ -105,7 +119,7 @@ let dateTypeList=ref([
 		value: 0,
 	},
 ])
-let dateType=ref(3)
+let dateType=ref(null)
 const dateTypeClick=(item)=>{
     startDate.value=''
     endDate.value=''
@@ -117,7 +131,7 @@ let calendarType=ref('公历')//季节图 公历/农历
 // 公历/农历切换
 const calendarTypeChange=(val)=>{
     calendarType.value=val
-    getChartInfo()
+    getChartInfo('init')
 }
 
 
@@ -130,36 +144,56 @@ let chartData=ref({
 
 })// 图表配置数据
 let resData=ref(null)//接口详情数据
-const getChartInfo=async ()=>{
+let loading=ref(false)
+// 如果type：init 则是初始化获取数据 
+const getChartInfo=async (type)=>{
+    // resData.value=null
+    loading.value=true
     const res=await apiChartInfo({
         ChartInfoId:ChartInfoId,
         DateType:dateType.value,
-        startDate:startDate.value&&resData.value.ChartInfo.ChartType===1?startDate.value:'',
-        endDate:endDate.value&&resData.value.ChartInfo.ChartType===1?endDate.value:'',
+        StartDate:startDate.value&&resData.value.ChartInfo.ChartType===1?startDate.value:'',
+        EndDate:endDate.value&&resData.value.ChartInfo.ChartType===1?endDate.value:'',
         SeasonStartDate:startDate.value&&resData.value.ChartInfo.ChartType===2?startDate.value:'',
         SeasonEndDate:endDate.value&&resData.value.ChartInfo.ChartType===2?endDate.value:'',
         Calendar:calendarType.value,
         Authorization:route.query.token
     })
+    loading.value=false
     if(res.code===200){
         resData.value=res.data
         document.title=res.data.ChartInfo.ChartName
+        
         // 设置highchart配置 ChartType: 1曲线图 2季节图:季节图中公历和农历数据结构不同
         if(res.data.ChartInfo.ChartType===1){
+            if(type=='init'){
+                dateType.value=res.data.ChartInfo.DateType||3 
+                startDate.value=res.data.ChartInfo.StartDate||''
+                endDate.value=res.data.ChartInfo.EndDate||''
+            }
             setSplineOpt(res.data.EdbInfoList)
         }else{
+            if(type=='init'){
+                dateType.value=res.data.ChartInfo.DateType||3 
+                startDate.value=res.data.ChartInfo.SeasonStartDate||''
+                endDate.value=res.data.ChartInfo.SeasonEndDate||''
+            }
+            
             setSeasonOpt(res.data.EdbInfoList[0])
         }
     }
 }
-getChartInfo()
+getChartInfo('init')
 
 // 路由改变 解决从搜索页返回数据不刷新问题
 onBeforeRouteUpdate((nval)=>{
     console.log('路由改变',nval);
     ChartInfoId=nval.query.ChartInfoId
+    dateType.value=null
+    startDate.value=''
+    endDate.value=''
     // router.go(0)
-    getChartInfo()
+    getChartInfo('init')
 })
 
 // 上下线设置
@@ -172,6 +206,16 @@ let axisLimitData=reactive({//左右轴极值
     rightMin:0,
     rightMax:0
 })
+const handleConfirmSetLimit=()=>{//确定修改极值（研究员会调用一次保存）
+    if(canSave.value){
+        handleSaveChart()
+    }
+    showLimit.value=false
+}
+const handleCloseLimit=()=>{//点击遮罩层关闭弹窗或者点击取消关闭
+    getChartInfo()
+    showLimit.value=false
+}
 
 
 // 设置曲线图配置
@@ -278,9 +322,12 @@ const setSplineOpt=(data)=>{
             chartEdbInfo:item//指标数据用于在保存时读取指标数据
         }
         yAxis.push(yItem)
-
-        minAndMaxTimeTemArr.push(item.DataList[0].DataTimestamp)
-        minAndMaxTimeTemArr.push(item.DataList[item.DataList.length-1].DataTimestamp)
+        
+        if(item.DataList.length>0){
+            minAndMaxTimeTemArr.push(item.DataList[0].DataTimestamp)
+            minAndMaxTimeTemArr.push(item.DataList[item.DataList.length-1].DataTimestamp)
+        }
+        
     })
 
     // 设置值
@@ -399,7 +446,7 @@ const setSeasonOpt=(data)=>{
 
     // 农历
     if(calendarType.value==='农历'){
-        let filterArr=data.DataList.List.slice(1,data.DataList.List.length)||[]
+        let filterArr=data.DataList.List&&data.DataList.List.slice(1,data.DataList.List.length)||[]
         // console.log('aaa',filterArr);
         filterArr.forEach((item,index)=>{
             let seriesItem={
@@ -443,7 +490,8 @@ const setSeasonOpt=(data)=>{
                 endOnTick: false,
                 startOnTick: false,
                 showLastLabel: true, //显示最后刻度值
-                tickPixelInterval: 50
+                tickPixelInterval: 50,
+                // chartEdbInfo:item//指标数据用于在保存时读取指标数据
             }
             yAxis.push(yAxisItem)
         })
@@ -618,7 +666,7 @@ const pageChange=async (type)=>{
         if(type==='before'){
             let index=searchListData.value.findIndex(item=>item.ChartInfoId==resData.value.ChartInfo.ChartInfoId)
             if(!searchListData.value[index-1]){
-                Toast('当前已经是图库第一张图')
+                Toast('当前已是第一张图')
             }else{
                 router.replace({
                     query:{
@@ -631,7 +679,7 @@ const pageChange=async (type)=>{
         if(type==='next'){
             let index=searchListData.value.findIndex(item=>item.ChartInfoId==resData.value.ChartInfo.ChartInfoId)
             if(!searchListData.value[index+1]){
-                Toast('当前已经是图库最后一张图')
+                Toast('当前已是最后一张图')
             }else{
                 router.replace({
                     query:{
@@ -655,7 +703,7 @@ const pageChange=async (type)=>{
         chartBeforeAndNextData.value=res.data
         if(type==='before'){
             if(chartBeforeAndNextData.value.PrevChart.ChartInfoId===0){
-                Toast('当前已经是图库第一张图')
+                Toast('当前已是第一张图')
             }else{
                 if(chartBeforeAndNextData.value.PrevChart.Switch){
                     let temStr=chartBeforeAndNextData.value.PrevChart.MyChartClassifyName
@@ -678,7 +726,7 @@ const pageChange=async (type)=>{
             }
         }else if(type==='next'){
             if(chartBeforeAndNextData.value.NextChart.ChartInfoId===0){
-                Toast('当前已经是图库最后一张图')
+                Toast('当前已是最后一张图')
             }else{
                 if(chartBeforeAndNextData.value.NextChart.Switch){
                     let temStr=chartBeforeAndNextData.value.NextChart.MyChartClassifyName
@@ -714,23 +762,23 @@ onMounted(()=>{
 
 // 保存
 const handleSaveChart=async ()=>{
-    let arr=chartData.value.yAxis.map(item=>{
-        return {
-            ChartColor: item.chartEdbInfo.ChartColor,
-            ChartStyle: item.chartEdbInfo.ChartStyle,
-            ChartWidth: Number(item.chartEdbInfo.ChartWidth),
-            EdbInfoId: item.chartEdbInfo.EdbInfoId,
-            EdbInfoType: item.chartEdbInfo.EdbInfoType,
-            IsAxis: item.chartEdbInfo.IsAxis,
-            IsOrder: item.chartEdbInfo.IsOrder,
-            LeadUnit: item.chartEdbInfo.EdbInfoType ? '' : item.chartEdbInfo.LeadUnit,
-            LeadValue: item.chartEdbInfo.EdbInfoType ? 0 : Number(item.chartEdbInfo.LeadValue),
-            MaxData: Number(item.max),
-            MinData: Number(item.min),
-        }
-    })
     let params={}
-    if(resData.value.ChartInfo.ChartType===1){
+    if(resData.value.ChartInfo.ChartType===1){//曲线图
+        let arr=chartData.value.yAxis.map(item=>{
+            return {
+                ChartColor: item.chartEdbInfo.ChartColor,
+                ChartStyle: item.chartEdbInfo.ChartStyle,
+                ChartWidth: Number(item.chartEdbInfo.ChartWidth),
+                EdbInfoId: item.chartEdbInfo.EdbInfoId,
+                EdbInfoType: item.chartEdbInfo.EdbInfoType,
+                IsAxis: item.chartEdbInfo.IsAxis,
+                IsOrder: item.chartEdbInfo.IsOrder,
+                LeadUnit: item.chartEdbInfo.EdbInfoType ? '' : item.chartEdbInfo.LeadUnit,
+                LeadValue: item.chartEdbInfo.EdbInfoType ? 0 : Number(item.chartEdbInfo.LeadValue),
+                MaxData: Number(item.max),
+                MinData: Number(item.min),
+            }
+        })
         params={
             ChartInfoId: resData.value.ChartInfo.ChartInfoId || 0,
             ChartEdbInfoList: arr,
@@ -738,7 +786,22 @@ const handleSaveChart=async ()=>{
             StartDate:startDate.value,
             EndDate: endDate.value,
         }
-    }else{
+    }else if(resData.value.ChartInfo.ChartType===2){//季节图
+        let arr=resData.value.EdbInfoList.map(item=>{
+            return {
+                ChartColor: item.ChartColor,
+                ChartStyle: item.ChartStyle,
+                ChartWidth: Number(item.ChartWidth),
+                EdbInfoId: item.EdbInfoId,
+                EdbInfoType: item.EdbInfoType,
+                IsAxis: item.IsAxis,
+                IsOrder: item.IsOrder,
+                LeadUnit: item.EdbInfoType ? '' : item.LeadUnit,
+                LeadValue: item.EdbInfoType ? 0 : Number(item.LeadValue),
+                MaxData: Number(chartData.value.yAxis[0].max),
+                MinData: Number(chartData.value.yAxis[0].min),
+            }
+        })
         params={
             ChartInfoId: resData.value.ChartInfo.ChartInfoId || 0,
             ChartEdbInfoList: arr,
@@ -759,9 +822,9 @@ const handleRefreshChart=async ()=>{
     const res=await apiChartRefresh({ChartInfoId:Number(ChartInfoId)})
     if(res.code===200){
         setTimeout(() => {
-            Toast.success('刷新成功')
-        }, 10);
-        getChartInfo()
+            Toast.success(res.msg)
+        }, 200);
+        getChartInfo('init')
     }
 }
 </script>
@@ -780,7 +843,7 @@ const handleRefreshChart=async ()=>{
             <img class="icon" src="../../../assets/hzyb/chart/refresh.png" alt="" @click="handleRefreshChart">
         </div>
 
-        <chartBox :options='chartData' v-if="resData"></chartBox>
+        <chartBox :options='chartData' v-if="!loading"></chartBox>
         
         <div class="flex source-box">
             <span>来源：弘则研究</span>
@@ -792,7 +855,7 @@ const handleRefreshChart=async ()=>{
         </div>
 
         <!-- 日期类型 -->
-        <div class="date-type-box">
+        <div class="date-type-box" v-if="resData&&resData.ChartInfo.ChartType===1">
             <div 
                 :class="['item',item.value==dateType?'active':'']" 
                 v-for="item in dateTypeList" 
@@ -805,13 +868,13 @@ const handleRefreshChart=async ()=>{
         <div class="latest-value-wrap" v-if="resData">
             <p style="margin-bottom:10px">最新数值</p>
             <ul class="flex list" v-if="resData.ChartInfo.ChartType===1">
-                <li v-for="item in chartData.series" :key="item.name">
+                <li :class="chartData.series.length==1?'one':''" v-for="item in chartData.series" :key="item.name">
                     <p style="color:#333">{{moment(item.LatestDate).format('YYYY-MM-DD')}}</p>
                     <p :style="{color:item.color}">{{item.name}}</p>
                     <p style="color:#1F243A">{{item.LatestValue}}</p>
                 </li>
             </ul>
-            <ul class="list" v-else>
+            <ul class="flex list" v-else>
                 <li style="width:100%;border-right:none">
                     <p style="color:#333">{{moment(resData.EdbInfoList[0].LatestDate).format('YYYY-MM-DD')}}</p>
                     <p :style="{color:resData.EdbInfoList[0].ChartColor}">{{resData.ChartInfo.ChartName}}</p>
@@ -845,12 +908,13 @@ const handleRefreshChart=async ()=>{
             v-model:show="showLimit"
             position="bottom"
             :overlay-style="{background:'rgba(0,0,0,0)'}"
+            @click-overlay="handleCloseLimit"
         >
             <div class="set-limit-box">
                 <div class="flex limit-top">
-                    <span style="color:#A7A7A7" @click="showLimit=false">取消</span>
+                    <span style="color:#A7A7A7" @click="handleCloseLimit">取消</span>
                     <span>上下限设置</span>
-                    <span style="color:#E3B377" @click="showLimit=false">确定</span>
+                    <span style="color:#E3B377" @click="handleConfirmSetLimit">确定</span>
                 </div>
                 <div class="con">
                     <p style="margin:20px 0" class="top">
@@ -859,15 +923,15 @@ const handleRefreshChart=async ()=>{
                     </p>
                     <p style="margin-bottom:25px" v-if="hasLeftAxis">
                         <span style="margin-right:35px">左轴</span>
-                        <input type="number" v-model="axisLimitData.leftMin">
-                        <span style="margin:0 10px">至</span>
                         <input type="number" v-model="axisLimitData.leftMax">
+                        <span style="margin:0 10px">至</span>
+                        <input type="number" v-model="axisLimitData.leftMin">
                     </p>
                     <p v-if="hasRightAxis">
                         <span style="margin-right:35px">右轴</span>
-                        <input type="number" v-model="axisLimitData.rightMin">
-                        <span style="margin:0 10px">至</span>
                         <input type="number" v-model="axisLimitData.rightMax">
+                        <span style="margin:0 10px">至</span>
+                        <input type="number" v-model="axisLimitData.rightMin">
                     </p>
                 </div>
             </div>
@@ -1006,6 +1070,10 @@ const handleRefreshChart=async ()=>{
                     font-size: 28px;
                 }
             }
+            .one{
+                flex: 1;
+                border-right: none !important;
+            }
         }
     }
 

src/views/hzyb/chart/component/chartBox.vue

@@ -120,8 +120,11 @@ watch(
                 <span :style="{color:item.visible?'':'#ccc'}">{{item.name}}</span>
             </div>
         </div>
-
-        <div class="chart-box" id="chart-box"></div>
+		<div class="chart-content">
+			<img class="mark-img" src="../../../../assets/hzyb/chart/mark.png" alt="">
+			<div class="chart-box" id="chart-box"></div>
+		</div>
+        
     </div>
 </template>
 
@@ -154,6 +157,18 @@ watch(
             }
         }
     }
+	.chart-content{
+		position: relative;
+		.mark-img{
+			position: absolute;
+			width: 58%;
+			left: 50%;
+			top: 50%;
+			transform: translate(-50%,-50%);
+			pointer-events: none;
+			z-index: 2;
+		}
+	}
     .chart-box {
 		padding-top: 10px;
         margin-top: 30px;