浏览代码

弹窗说明修改

cxmo 1 年之前
父节点
当前提交
fe358cdee2

二进制
src/assets/img/icons/tooltip.png


+ 72 - 0
src/views/chartRelevance_manage/components/explainDialog.vue

@@ -0,0 +1,72 @@
+<template>
+    <el-dialog custom-class="explain-dialog-wrap"
+        :visible.sync="showExplain"
+        :close-on-click-modal="false"
+        :append-to-body="true"
+        center
+        width="976px"
+        v-dialogDrag
+        top="8vh"
+        title="操作说明"
+        @close="$emit('close')"
+    >
+        <div class="dialog-container">
+            <div class="explain-text" v-for="text,index in textArray" :key="index" v-html="text">
+            </div>
+        </div>
+        <div class="dialog-btn">
+            <el-button type="primary" @click="$emit('close')">知道了</el-button>
+        </div>
+        
+    </el-dialog>
+</template>
+
+<script>
+import * as explainText from './explainText'
+export default {
+    props:{
+        showExplain:{
+            type:Boolean,
+            default:false
+        },
+        textArrName:{
+            type:String,
+            default:'chartrelevanceTextArr'
+        }
+    },
+    computed:{
+        textArray(){
+            return explainText[this.textArrName]
+        }
+    },
+    data() {
+        return {
+
+        };
+    },
+    methods: {
+
+    },
+};
+</script>
+
+<style scoped lang="scss">
+.explain-dialog-wrap{
+    .dialog-container{
+        .explain-text{
+            font-size: 16px;
+            padding-bottom: 20px;
+            &:not(:last-child){
+                border-bottom:1px solid #D9D9D9;
+            }
+            &:not(:first-child){
+                padding-top: 20px;
+            }
+        }
+    }
+    .dialog-btn{
+        padding-bottom: 25px;
+        text-align: center;
+    }
+}
+</style>

+ 38 - 0
src/views/chartRelevance_manage/components/explainText.js

@@ -0,0 +1,38 @@
+//相关性分析
+export const chartrelevanceTextArr = [
+    `<p style='font-weight:bold;'>相关性计算处理逻辑:</p>
+    <p>1、取数:取计算窗口的时间长度,从当前时间往前推移对应的时间长度,取该日期区间,指标A序列值和指标B序列值;</p>
+    <p>2、变频:根据指标A和指标B的频度对取出的数据序列做如下处理</p>
+    <p>①指标A高频,对指标B升频(线性方程插值法补全数据);</p>
+    <p>②指标B高频,对指标A升频(线性方程插值法补全数据);</p>
+    <p>③指标A,指标B同频,不作处理;</p>
+    <p>3、计算:按照分析周期,以指标A为基准,对指标B作对应期数的位移,根据公式相关系数R = SUM[(Xi-Mx)*(Yi-My)]/[(N-1)(SDx*SDy)],计算每个期数对应的相关性;</p>
+    <p style='height:20px;'></p>
+    <p>注:指标B作位移时,若以指标A的日期序列未找到指标B的值,则往前找最近值进行计算(往前找的范围为当前日期往前推移计算窗口的时间范围),0期(未作位移时)只取日期交集计算</p>`,
+    `<p style='font-weight:bold;'>相关性配置:</p>
+    <p>1、计算窗口:参与计算的历史数据时间段;</p>
+    <p>2、分析周期:指标B领先A的期数,如配置参数10个月,表示B领先A -10月、B领先A -9月,...,B领先A 9月、B领先A 10月,每期分别计算相关性值;</p>`,
+    `<p style='font-weight:bold;'>滚动相关性配置:</p>
+    <p>1、计算窗口:参与计算的时间段长度,从两个指标都有值的日期开始滚动的取计算窗口长度的值进行计算,如配置计算窗口1个月,则2023.7.28的值取2023.6.28~2023.7.28时间段,2023.7.27的值取2023.6.27~2023.7.27时间段;</p>
+    <p>2、B领先A:B指标领先A指标的参数,为0时不领先;</p>`
+]
+
+//拟合方程曲线
+export const fittingEquationListTextArr = [
+    `<p style='font-weight:bold;'>拟合方程曲线处理逻辑:</p>
+    <p>1、选择两组有相关性的指标</p>
+    <p>2、对两组在选定时间范围内的每一个时间节点,生成拟合方程Y=aX+b以及相关系数R²</p>
+    <p>3、分别画出弹性系数a,截距b,相关系数R²,在选定时间范围内的曲线图</p>`,
+]
+
+export const statisticFeatureListTextArr = [
+    `<p style='font-weight:bold;'>标准差处理逻辑:</p>
+    <p>计算所选时间范围内数据的样本标准差s,s=sqrt(((x1-x)^2 (x2-x)^2 ......(xn-x)^2)/(n-1)),n表示数据个数</p>`,
+    `<p style='font-weight:bold;'>百分位处理逻辑:</p>
+    <p>对所选时间范围内的数据,取最大值Max,最小值Min,计算Max-Min,百分位=(现值-Min)/(Max-Min),Max=Min时不子计算</p>`,
+    `<p style='font-weight:bold;'>频率分布处理逻辑:</p>
+    <p>1、在所选时间范围内,取最大值和最小值;</p>
+    <p>2、根据频段数划分多个间距相同的区间(左闭右开,最后一个区间为左闭右闭),统计数据值落在每个区间的数据个数;</p>
+    <p>3、频率=落在某区间数据个数/所选时间段内数据总个数;</p>
+    <p>4、累计频率为从最小值所在区间对应的频率开始累加;</p>`
+]

+ 20 - 4
src/views/chartRelevance_manage/fittingEquationChartEditor.vue

@@ -14,7 +14,7 @@
 					path: '/fittingEquationList',
 					query: $route.query
 				})">取消</el-button>
-				<span style="color: #666;">
+				<!-- <span style="color: #666;">
 						使用说明
 					<el-tooltip
 						effect="dark"
@@ -26,7 +26,11 @@
 						></div>
 						<i class="el-icon-question" />
 					</el-tooltip>
-				</span>
+				</span> -->
+				<div style="color:#409EFF;font-size: 16px;cursor: pointer;" @click="showExplain = true">
+					<i class="el-icon-document" style="font-size:22px;"></i>
+					操作说明
+				</div>
       </div>
 			<div class="left-min">
 				<div class="section-item">
@@ -155,6 +159,12 @@
       :isShow.sync="isSaveDialog"
 			:initData="leftOption.ChartMappingList"
 			@saveBack="editChartBackHandle"
+    />
+	<!-- 操作说明 -->
+    <ExplainDialog 
+        textArrName="fittingEquationListTextArr"
+        :show-explain="showExplain"
+        @close="showExplain = false"
     />
 
   </div>
@@ -167,8 +177,9 @@ import Chart from '@/views/dataEntry_manage/components/chart';
 import selectTarget from './components/selectTarget.vue';
 import fittingEquationSaveDia from './components/fittingEquationSaveDia.vue';
 import chartCard from './components/chartCard.vue';
+import ExplainDialog from './components/explainDialog.vue';
 export default {
-  components: { Chart,selectTarget,fittingEquationSaveDia,chartCard },
+  components: { Chart,selectTarget,fittingEquationSaveDia,chartCard,ExplainDialog },
 	directives: {
     drag(el, bindings) {
       el.onmousedown = function (e) {
@@ -236,7 +247,9 @@ export default {
 
 			useTip:`1、选择两组有相关性的指标<br>
 					2、对两组在选定时间范围内的每一个时间节点,生成拟合方程Y=aX+b以及相关系数R²<br>
-					3、分别画出弹性系数a,截距b,相关系数R²,在选定时间范围内的曲线图`
+					3、分别画出弹性系数a,截距b,相关系数R²,在选定时间范围内的曲线图`,
+			//操作说明弹窗
+			showExplain:false
 
     };
   },
@@ -417,6 +430,9 @@ export default {
       padding: 15px 20px;
       border: 1px solid #ececec;
       box-shadow: 0px 3px 6px rgba(167, 167, 167, 0.09);
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
     }
 		.left-min {
 			padding: 30px 20px;

+ 2 - 2
src/views/chartRelevance_manage/fittingEquationList.vue

@@ -13,7 +13,7 @@
 				<div class="datasheet_top">
 						<el-button v-permission="permissionBtn.statisticPermission.fittingEq_addChart"
 							type="primary" @click="goAddChart">添加图表</el-button>
-						<div style="color: #666">
+						<!-- <div style="color: #666">
 							 使用说明
 							<el-tooltip
 								effect="dark"
@@ -25,7 +25,7 @@
 								></div>
 								<i class="el-icon-question" />
 							</el-tooltip>
-						</div>
+						</div> -->
 				</div>
 
 				<div class="search-cont">

+ 21 - 6
src/views/chartRelevance_manage/relevanceChartEditor.vue

@@ -10,6 +10,10 @@
     <div class="left-cont" v-show="!isSlideLeft" id="left">
       <div class="left-top">
         <el-button type="primary" plain @click="$router.back()">取消</el-button>
+        <div style="color:#409EFF;font-size: 16px;cursor: pointer;" @click="showExplain = true">
+            <i class="el-icon-document" style="font-size:22px;"></i>
+            操作说明
+        </div>
       </div>
       <div class="left-min">
         <el-form
@@ -148,7 +152,7 @@
 
         <div class="section">
           <div>相关性
-            <el-tooltip
+            <!-- <el-tooltip
               effect="dark"
             >
               <div
@@ -157,7 +161,7 @@
                 style="line-height: 20px;width:350px"
               ></div>
               <i class="el-icon-question" style="color:#666"/>
-            </el-tooltip>
+            </el-tooltip> -->
           </div>
           <div class="section-item">
             <div style="flex-shrink:0;min-width:70px"><span style="color:red;font-size:18px;">*</span>计算窗口</div>
@@ -208,7 +212,7 @@
 
       <div class="section" v-for="(item,index) in chartInfo.RollingCorrelation" :key="index">
         <div>滚动相关性{{index+1}}
-          <el-tooltip
+          <!-- <el-tooltip
             effect="dark"
           >
             <div
@@ -217,7 +221,7 @@
               style="line-height: 20px;width:350px"
             ></div>
             <i class="el-icon-question" style="color:#666"/>
-          </el-tooltip>
+          </el-tooltip> -->
         </div>
         <div class="section-item">
           <span style="flex-shrink:0;min-width:70px">计算窗口</span>
@@ -357,6 +361,11 @@
       :chartData="chartData"
       @saveBack="saveEdbBack"
     />
+    <!-- 操作说明 -->
+    <ExplainDialog 
+        :show-explain="showExplain"
+        @close="showExplain = false"
+    />
   </div>
 </template>
 
@@ -370,8 +379,9 @@ import chartCard from './components/chartCard.vue';
 import SaveChartOther from '@/views/dataEntry_manage/components/SaveChartOther';
 import saveChartToBase from './components/saveChartTobaseDia.vue';
 import saveEdbToBase from './components/saveEdbToBaseDia.vue'
+import ExplainDialog from './components/explainDialog.vue';
 export default {
-  components: { selectTarget,chartCard,SaveChartOther,saveChartToBase,saveEdbToBase },
+  components: { selectTarget, chartCard, SaveChartOther, saveChartToBase, saveEdbToBase, ExplainDialog },
   directives: {
     drag(el, bindings) {
       el.onmousedown = function (e) {
@@ -506,7 +516,9 @@ export default {
           分析周期:指标B领先A的期数,如配置参数10个月,表示B领先A -10月、B领先A -9月,...,B领先A 9月、B领先A 10月,每期分别计算相关性值;`,
         rollingCorrelation:`计算窗口:参与计算的时间段长度,从两个指标都有值的日期开始滚动的取计算窗口长度的值进行计算,如配置计算窗口1个月,则2023.7.28的值取2023.6.28~2023.7.28时间段,2023.7.27的值取2023.6.27~2023.7.27时间段;<br>
         B领先A:B指标领先A指标的参数,为0时不领先;`
-      }
+      },
+      /* 操作说明弹窗 */
+      showExplain:false
 
     };
   },
@@ -813,6 +825,9 @@ export default {
       padding: 15px 20px;
       border-bottom: 1px solid #ececec;
       box-shadow: 0px 3px 6px rgba(167, 167, 167, 0.09);
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
     }
     .left-min {
       padding: 20px;

+ 24 - 8
src/views/chartRelevance_manage/statisticFeatureChartEditor.vue

@@ -10,6 +10,10 @@
     <div class="left-cont" v-show="!isSlideLeft" id="left">
       <div class="left-top">
         <el-button type="primary" plain @click="$router.back()">取消</el-button>
+        <div style="color:#409EFF;font-size: 16px;cursor: pointer;" @click="showExplain = true">
+            <i class="el-icon-document" style="font-size:22px;"></i>
+            操作说明
+        </div>
       </div>
       <div class="left-min">
         <div class="search-cont">
@@ -72,14 +76,14 @@
 
         <div class="section">
           <div>标准差
-            <el-tooltip effect="dark" placement="right">
+            <!-- <el-tooltip effect="dark" placement="right">
               <div
                 slot="content"
                 v-html="ruleTips.StandardDeviation"
                 style="line-height: 20px;width:300px"
               ></div>
               <i class="el-icon-question" style="color: #666" />
-            </el-tooltip>
+            </el-tooltip> -->
           </div>
           <div class="section-item">
             <div>滚动期数:</div>
@@ -95,14 +99,14 @@
 
         <div class="section">
           <div>百分位
-            <el-tooltip effect="dark" placement="right">
+            <!-- <el-tooltip effect="dark" placement="right">
               <div
                 slot="content"
                 v-html="ruleTips.Percentile"
                 style="line-height: 20px;width:300px"
               ></div>
               <i class="el-icon-question" style="color: #666" />
-            </el-tooltip>
+            </el-tooltip> -->
           </div>
           <div class="section-item">
             <span style="flex-shrink:0;min-width:70px">时间长度:</span>
@@ -130,14 +134,14 @@
 
         <div class="section">
           <div>频率分布
-            <el-tooltip effect="dark" placement="right">
+            <!-- <el-tooltip effect="dark" placement="right">
               <div
                 slot="content"
                 v-html="ruleTips.FrequencyDistribution"
                 style="line-height: 20px;width:300px"
               ></div>
               <i class="el-icon-question" style="color: #666" />
-            </el-tooltip>
+            </el-tooltip> -->
           </div>
           <div class="section-item">
             <span style="flex-shrink:0;min-width:70px">时间段:</span>
@@ -271,6 +275,12 @@
       :chartData="chartData"
       @saveBack="saveEdbBack"
     />
+    <!-- 操作说明 -->
+    <ExplainDialog 
+        textArrName="statisticFeatureListTextArr"
+        :show-explain="showExplain"
+        @close="showExplain = false"
+    />
   </div>
 </template>
 
@@ -283,9 +293,10 @@ import selectTarget from './components/selectTarget.vue'
 import chartCard from './components/chartCard.vue';
 import SaveChartOther from '@/views/dataEntry_manage/components/SaveChartOther';
 import saveChartToBase from './components/saveChartTobaseDia.vue';
-import saveEdbToBase from './components/saveEdbToBaseDia.vue'
+import saveEdbToBase from './components/saveEdbToBaseDia.vue';
+import ExplainDialog from './components/explainDialog.vue';
 export default {
-  components: { selectTarget,chartCard,SaveChartOther,saveChartToBase,saveEdbToBase },
+  components: { selectTarget,chartCard,SaveChartOther,saveChartToBase,saveEdbToBase,ExplainDialog },
   directives: {
     drag(el, bindings) {
       el.onmousedown = function (e) {
@@ -393,6 +404,8 @@ export default {
       isSaveEdbToBase: false,
 
       oldEdbInfoType: 0,//原指标来源
+      //操作说明弹窗
+      showExplain:false
     };
   },
   methods: {
@@ -672,6 +685,9 @@ export default {
       padding: 15px 20px;
       border-bottom: 1px solid #ececec;
       box-shadow: 0px 3px 6px rgba(167, 167, 167, 0.09);
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
     }
     .left-min {
       padding: 20px;

+ 4 - 1
src/views/dataEntry_manage/addChart.vue

@@ -262,6 +262,7 @@
 						v-if="chartInfo.ChartType===10"
 						ref="SectionScatterOptRef"
 						@getData="getSectionScatterData"
+						@modifySeriesName="IsNameDefault = false"
 					/>
         </div>
 			</div>
@@ -557,7 +558,8 @@ export default {
 			season_year:'',//季节图时间段
 			activeNames:'',
 
-			needWatch: true
+			needWatch: true,
+			IsNameDefault:true,
 
     };
   },
@@ -596,6 +598,7 @@ export default {
 						ChartName: this.chartInfo.ChartName,
 						ChartType: this.chartInfo.ChartType,
 						ChartEdbInfoList: db_arr,
+						IsNameDefault:this.IsNameDefault
 					}
 
 					//提交参数

+ 6 - 5
src/views/dataEntry_manage/components/satterSeriesDia.vue

@@ -353,9 +353,10 @@ export default {
       type: Object
     },
     edbInfoData:{
-        type:Array
+        type:Array,
+        default:[]
     },
-    SeriesNameModify:{
+    IsNameDefault:{
         type:Boolean
     }
   },
@@ -524,7 +525,7 @@ export default {
             name: item.EdbName,
           })
 
-          this.form.series_name = !this.SeriesNameModify?this.targetInfo.xEdbs[0].date:this.form.series_name;
+          this.form.series_name = this.IsNameDefault?this.targetInfo.xEdbs[0].date:this.form.series_name;
           this.form.x_unit = this.form.x_unit || item.Unit;
         }else {
           this.targetInfo.yEdbs.push({
@@ -608,7 +609,7 @@ export default {
       }
       this.$emit('saveCallback',params)
       //如果没修改过,且保存时值不相等,则此次保存视为修改
-      if(params.series_name!==xEdbs[0].date&&!this.SeriesNameModify){
+      if(params.series_name!==xEdbs[0].date&&this.IsNameDefault){
         this.$emit('modifySeriesName')
       }
       this.cancelHandle()
@@ -675,7 +676,7 @@ export default {
       const { index,type,item } = this.replaceForm;
 
       type==='x' ? this.targetInfo.xEdbs.splice(index,1,item) : this.targetInfo.yEdbs.splice(index,1,item);
-      if(type==='x'&&index===0&&!this.SeriesNameModify){
+      if(type==='x'&&index===0&&this.IsNameDefault){
         this.form.series_name = this.targetInfo.xEdbs[0].date;
       }
       this.cancelReplace()

+ 7 - 3
src/views/dataEntry_manage/components/sectionalScatterOption.vue

@@ -55,7 +55,7 @@
       :show.sync="isOpenSeriesDialog"
       :serieInfo="seriesArr[0]"
       :edbInfoData="edbInfoData"
-      :SeriesNameModify="SeriesNameModify"
+      :IsNameDefault="IsNameDefault"
       @saveCallback="saveSeriesOpt"
       @modifySeriesName="$emit('modifySeriesName')"
     />
@@ -171,9 +171,13 @@ export default {
       default: null
     },
     edbInfoData:{
-        dafault:[]
+        type:Array,
+        default:[]
     },
-    SeriesNameModify:Boolean
+    IsNameDefault:{
+        type:Boolean,
+        default:true
+    }
   },
   data() {
     return {

+ 6 - 6
src/views/dataEntry_manage/editChart.vue

@@ -275,9 +275,9 @@
 						ref="SectionScatterOptRef"
 						:initData="chartInfo.ExtraConfig?JSON.parse(chartInfo.ExtraConfig):null"
 						:edbInfoData="tableData"
-						:SeriesNameModify="SeriesNameModify||false"
+						:IsNameDefault="IsNameDefault"
 						@getData="getSectionScatterData"
-						@modifySeriesName="SeriesNameModify = true"
+						@modifySeriesName="IsNameDefault = false"
 					/>
         </div>
 			</div>
@@ -577,7 +577,7 @@ export default {
 
 			initBarOptions: null,//编辑时回显的barOptions数据
 			needWatch: false,
-			SeriesNameModify:false,
+			IsNameDefault:true,
 
 			UnitOptions:unitArr
     };
@@ -592,8 +592,8 @@ export default {
         })
         .then((res) => {
           if (res.Ret !== 200) return;
-					const { ChartInfo,EdbInfoList,BarChartInfo,SeriesNameModify} = res.Data;
-					this.SeriesNameModify = SeriesNameModify
+					const { ChartInfo,EdbInfoList,BarChartInfo,IsNameDefault} = res.Data;
+					this.IsNameDefault = IsNameDefault
 
            this.chartInfo = {
 						...ChartInfo,
@@ -667,7 +667,7 @@ export default {
 						ChartType: this.chartInfo.ChartType,
 						ChartInfoId: this.chartInfo.ChartInfoId,
 						ChartEdbInfoList: db_arr,
-						SeriesNameModify:this.SeriesNameModify
+						IsNameDefault:this.IsNameDefault
 					}
 
 					//提交参数