eta1.6.3 单因子页面调整完成

src/views/chartRelevance_manage/components/chartCard.vue

@@ -62,7 +62,7 @@ export default {
   mixins: [chartSetMixin],
   computed: {
     isHaveButton() {
-      let routes = ['/relevancechartEditor','/statisticFeatureChartEditor']
+      let routes = ['/relevancechartEditor','/statisticFeatureChartEditor','/relevancechartEditorV2']
       return routes.includes(this.$route.path)
     },
     cardTitle() {

src/views/chartRelevance_manage/relevance/components/formMixin.js

@@ -1,4 +1,5 @@
 //单因子，多因子的表单 共同逻辑
+import {yearSelector} from '@/utils/defaultOptions';
 import selectTarget from '../../components/selectTarget.vue'
 export default{
     components:{selectTarget},
@@ -14,10 +15,19 @@ export default{
     },
     computed:{
         yearSelector(){
-            return []
+            return [
+                ...yearSelector,
+                { name: this.$i18n.locale == 'zh'?'自定义':'custom',value: 5 }
+            ]
         },
         dayOpt(){
-            return []
+            return [
+                {label:this.$t('Edb.FreAll.year_min'),val:'年'},
+                {label:this.$t('Edb.FreAll.quarter_min'),val:'季'},
+                {label:this.$t('Edb.FreAll.month_min'),val:'月'},
+                {label:this.$t('Edb.FreAll.week_min'),val:'周'},
+                {label:this.$t('Edb.FreAll.day_min'),val:'天'},
+            ]
         }
     },
     methods: {

src/views/chartRelevance_manage/relevance/relevanceChartEditorV2.vue

@@ -2,7 +2,7 @@
     <div class="relevance-chart-editor-wrap">
         <div class="info-wrap content-wrap">
             <div class="info-top">
-                <el-button @click="testRuleCheck">确定</el-button>
+                <el-button @click="previewChart">确定</el-button>
                 <el-button>取消</el-button>
                 <span>操作说明</span>
             </div>
@@ -38,50 +38,50 @@
                     class="chart-min-cont"
                     v-if="chartBatchData"
                 >
-                    <div class="card-wrapper">
+                    <div class="card-wrapper content-wrap">
                         <chartCard 
-                        :entryType="1"
-                        ref="chartCard1"
-                        :data="chartBatchData.CurveData"
-                        :settings="infoForm"
-                        :isChartAdd="buttonAuth.isCurveChartAdd"
-                        @saveChart="saveChartToBaseHandle"
-                        />
-                    </div>
-                    <div class="card-wrapper" v-if="chartBatchData.CorrelationData">
-                        <chartCard 
-                        :entryType="2"
-                        ref="chartCard2"
-                        :data="chartBatchData.CorrelationData"
-                        :settings="infoForm"
-                        :isChartAdd="buttonAuth.isRelevanceChartAdd"
-                        @saveChart="saveChartToBaseHandle"
-                        />
-                    </div>
-                    <template v-if="chartBatchData.RollingCorrelationData">
-                        <div class="card-wrapper" v-if="chartBatchData.RollingCorrelationData[0]">
-                        <chartCard 
-                            :entryType="3"
-                            ref="chartCard3"
-                            :data="chartBatchData.RollingCorrelationData[0]"
+                            :entryType="1"
+                            ref="chartCard1"
+                            :data="chartBatchData.CurveData"
                             :settings="infoForm"
-                            :isChartAdd="buttonAuth.isRollChartAdd"
-                            :isEdbAdd="buttonAuth.isRollEdbAdd"
+                            :isChartAdd="buttonAuth.isCurveChartAdd"
                             @saveChart="saveChartToBaseHandle"
-                            @saveEdb="saveEdbToBaseHandle"
                         />
-                        </div>
-                        <div class="card-wrapper" v-if="chartBatchData.RollingCorrelationData[1]">
+                    </div>
+                    <div class="card-wrapper content-wrap" v-if="chartBatchData.CorrelationData">
                         <chartCard 
-                            :entryType="4"
-                            ref="chartCard4"
-                            :data="chartBatchData.RollingCorrelationData[1]"
+                            :entryType="2"
+                            ref="chartCard2"
+                            :data="chartBatchData.CorrelationData"
                             :settings="infoForm"
-                            :isChartAdd="buttonAuth.isRollChartTwoAdd"
-                            :isEdbAdd="buttonAuth.isRollEdbTwoAdd"
+                            :isChartAdd="buttonAuth.isRelevanceChartAdd"
                             @saveChart="saveChartToBaseHandle"
-                            @saveEdb="saveEdbToBaseHandle"
                         />
+                    </div>
+                    <template v-if="chartBatchData.RollingCorrelationData">
+                        <div class="card-wrapper content-wrap" v-if="chartBatchData.RollingCorrelationData[0]">
+                            <chartCard 
+                                :entryType="3"
+                                ref="chartCard3"
+                                :data="chartBatchData.RollingCorrelationData[0]"
+                                :settings="infoForm"
+                                :isChartAdd="buttonAuth.isRollChartAdd"
+                                :isEdbAdd="buttonAuth.isRollEdbAdd"
+                                @saveChart="saveChartToBaseHandle"
+                                @saveEdb="saveEdbToBaseHandle"
+                            />
+                        </div>
+                        <div class="card-wrapper content-wrap" v-if="chartBatchData.RollingCorrelationData[1]">
+                            <chartCard 
+                                :entryType="4"
+                                ref="chartCard4"
+                                :data="chartBatchData.RollingCorrelationData[1]"
+                                :settings="infoForm"
+                                :isChartAdd="buttonAuth.isRollChartTwoAdd"
+                                :isEdbAdd="buttonAuth.isRollEdbTwoAdd"
+                                @saveChart="saveChartToBaseHandle"
+                                @saveEdb="saveEdbToBaseHandle"
+                            />
                         </div>
                     </template>
                 </div>
@@ -113,8 +113,10 @@ export default {
         return {
             infoForm:{
                 Model:1,
+                EdbInfoIdA:'',
+                EdbInfoIdB:'',
                 Curve:{
-                    DateType:'',
+                    DateType:3,
                     Date:'',
                     LeftMin:'',
                     LeftMax:'',
@@ -123,17 +125,23 @@ export default {
                     EdbInfoType:true,//显示为标准指标(true)或领先指标(false)
                 },//曲线图
                 Correlation:{
-                    CalculateValue:'',//计算窗口
-                    CalculateUnit:'',//计算窗口单位（时间）
-                    LeadValue:'',//分析周期
-                    LeadUnit:'',//分析周期单位（时间）
+                    CalculateValue:0,//计算窗口
+                    CalculateUnit:'天',//计算窗口单位（时间）
+                    LeadValue:0,//分析周期
+                    LeadUnit:'天',//分析周期单位（时间）
                 },//相关性
                 RollingCorrelation:[
                     {
-                        CalculateValue:'',
-                        CalculateUnit:'',
-                        LeadValue:'',
-                        LeadUnit:''
+                        CalculateValue:0,
+                        CalculateUnit:'天',
+                        LeadValue:0,
+                        LeadUnit:'天'
+                    },
+                    {
+                        CalculateValue:0,
+                        CalculateUnit:'天',
+                        LeadValue:0,
+                        LeadUnit:'天'
                     }
                 ],//滚动相关性
             },
@@ -155,14 +163,6 @@ export default {
             },
         };
     },
-    computed:{
-        yearSelector(){
-            return []
-        },
-        dayOpt(){
-            return []
-        }
-    },
     methods: {
         //选择指标后填入上下限
         async getEdbDetail({EdbInfoId,EdbInfoType}) {
@@ -175,8 +175,8 @@ export default {
             }
         },
         async handleSelectTarget({type,target}){
-            this.infoForm[type] = target||''
             if(!target) return
+            this.infoForm[type] = target.EdbInfoId||''
             if(!['EdbInfoIdA','EdbInfoIdB'].includes(type)) return 
             const {max,min} = await this.getEdbDetail(target)
             if(type==='EdbInfoIdA'){
@@ -212,9 +212,49 @@ export default {
             this.chartBatchData.CurveData.EdbInfoList[1].IsOrder = IsOrder;
         },
         dateChange(){},
-        async testRuleCheck(){
-            await this.$refs.infoFormRef.validate()
+        //确定-预览相关性图表
+        async previewChart(){
+            //表单校验
+            const test = await this.$refs.infoFormRef.validate()
+            //相关性值校验
+            if(!this.checkValue()) return 
+            //单因子：渲染相关性图表，需要保存MultipleGraphConfigId
+            if(this.infoForm.Model===1){
+                const res = await chartRelevanceApi.chartOptionsSet({...this.infoForm});
+                if(res.Ret !== 200) return
+                const { MultipleGraphConfigId } = res.Data;
+                this.infoForm.MultipleGraphConfigId = MultipleGraphConfigId;
+                this.previewSingleChart()
+            }else{
+                //多因子：仅渲染标的指标+添加曲线的指标
+                this.previewMultipleChart()
+            }
         },
+        //校验规则
+        checkValue() {
+            //只用于校验规则条件大小
+            let checkBool = true;
+            const valueMap = {
+                '年': 365,
+                '季': 90,
+                '月': 30,
+                '周': 7,
+                '天': 1
+            }
+            const { Correlation } = this.infoForm;
+            if(Correlation.CalculateValue*valueMap[Correlation.CalculateUnit] < Correlation.LeadValue*valueMap[Correlation.LeadUnit]*2) {
+                this.infoForm.Correlation.CalculateValue = 0;
+                this.$message.warning(/* '相关性计算窗口必须≥2*分析周期' */this.$t('StatisticAnalysis.ChartRelevance.check_value_hint'))
+                checkBool = false
+            }
+            return checkBool
+        },
+        async previewSingleChart(){
+            const res = await chartRelevanceApi.previewChartBatch({...this.infoForm});
+            if(res.Ret !== 200) return
+            this.chartBatchData = res.Data;
+        },
+        previewMultipleChart(){},
         //获取相关性图表详情
         getRelevanceChartDetail(){
             //判断是单因子or多因子
@@ -250,7 +290,7 @@ export default {
                 isRollEdbTwoAdd: res.Data.EdbMappingList.some(_ => _.MultipleLocationSource===4)
             }
             //初始化chartBatch
-            this.getPreviewSplineChart()
+            this.previewSingleChart()
         }
     },
 };
@@ -344,6 +384,44 @@ export default {
     .model-wrap{
         flex:1;
         height: calc(100vh - 120px);
+        .single-model-wrap{
+            width: 100%;
+            overflow: hidden;
+        }
+        .chart-min-cont {
+            height: calc(100vh - 120px);
+            overflow-y: auto;
+            display: flex;
+            flex-wrap: wrap;
+            gap:15px;
+            .card-wrapper {
+                width: 48%;
+                min-height: 350px;
+                min-width:410px;
+                .card-item {
+                    padding: 20px;
+                    .top {
+                        display: flex;
+                        justify-content: space-between;
+                        align-items: center;
+                        margin-bottom: 15px;
+                    }
+                    .title {
+                        font-size: 15px;
+                        text-align: left;
+                        margin: 10px 0;
+                    }
+                }
+            }
+        }
+        .nodata {
+            height: calc(100vh - 120px);
+            background-color: #fff;
+            text-align: center;
+            font-size: 16px;
+            color: #666;
+            padding: 100px 0;
+        }
     }
 }
 </style>