标识线新增

src/views/dataEntry_manage/components/addMarkerDialog.vue

@@ -160,18 +160,26 @@
                     <!-- 固定第一个指标 -->
                     <div class="fixed-edb">
                         <el-radio v-model="markerForm.edbType" :label="1">图上第一个指标</el-radio>
-                        <p>指标名称指标名称</p>
+                        <p>{{chartInfo.ChartName}}</p>
                     </div>
                     <!-- 指标/预测指标库的指标 -->
                     <div class="other-edb">
                         <el-radio v-model="markerForm.edbType" :label="2" style="margin-right: 20px;">其他指标</el-radio>
                         <!-- /datamanage/edb_info/filter_by_es/all -->
-                        <el-input
-                                v-model="markerForm.EdbName"
-                                style="width: 200px;"
-                                placeholder="请选择指标名称"
-                                clearable
-                            />
+                        <el-select style="width: 200px;"
+                            filterable remote clearable
+                            :placeholder="$t('ToolBox.ForexCalendar.edb_input')"
+                            v-model="searchObj"
+                            :remote-method="searchHandle"
+                            value-key="EdbInfoId"
+                            @change="searchChange">
+                            <i slot="prefix" class="el-input__icon el-icon-search"></i>
+                            <el-option
+                                v-for="item in searchOptions"
+                                :key="item.EdbInfoId"
+                                :label="item.EdbName"
+                                :value="item"/>
+                        </el-select>
                     </div>
                 </div>
             </el-form-item>
@@ -187,38 +195,43 @@
                 <!-- 起始时间 -->
                 <el-form-item label="起始时间">
                     <div class="form-item-content">
-                        <div class="fixed-time">
-                            <el-radio v-model="markerForm.startTimeInfo.timeType" :label="1" style="margin-right: 20px;">固定</el-radio>
+                        <div class="format">
+                            <el-radio v-model="markerForm.startTimeInfo.timeType" :label="1" style="margin-right: 0;">固定</el-radio>
                             <el-date-picker
                                 v-model="markerForm.startTimeInfo.date"
-                                type="date"
-                                style="width: 100px;"
+                                popper-class="x-range-picker-date"
+                                style="width: 140px;"
                                 placeholder="请输入固定时间"
                                 :clearable="false"
                                 format="yyyy-MM-dd"
                                 value-format="yyyy-MM-dd"
                             ></el-date-picker>
                         </div>
-                        <div class="custom-time">
-                            <el-radio v-model="markerForm.startTimeInfo.timeType" :label="2" style="margin-left:20px;margin-right:5px">动态</el-radio>
+                        <div class="format">
+                            <el-radio v-model="markerForm.startTimeInfo.timeType" :label="2" style="margin-left:20px;margin-right:0">动态</el-radio>
                             <el-tooltip effect="dark" content="说明说明" placement="top">
                                 <i class="el-icon-question" style="font-size: 16px;"></i>
                             </el-tooltip>
                         </div>
                     </div>
-                    
                 </el-form-item>
                 <!-- 起始时间为动态 -->
                 <div class="start-time-custom-wrap" v-if="markerForm.startTimeInfo.timeType===2">
                     <!-- 基准日期 -->
                     <el-form-item label="基准日期">
                         <div class="form-item-content">
-                            <div class="edb-sys-date">
+                            <div class="format">
                                 <el-radio v-model="markerForm.startTimeInfo.baseTimeType" :label="1">系统日期</el-radio>
                             </div>
-                            <div class="edb-new-date">
-                                <el-radio v-model="markerForm.startTimeInfo.baseTimeType" :label="2">指标最新日期</el-radio>
-                                <p>期数前移<el-input style="width:60px"></el-input>期</p>
+                            <div class="format" style="display: flex;align-items: center;">
+                                <p>
+                                    <el-radio v-model="markerForm.startTimeInfo.baseTimeType" :label="2" style="margin-right:5px;">指标最新日期</el-radio>
+                                </p>
+                                <p>期数前移
+                                    <el-input style="width:60px" type="number" class="number-input"
+                                    v-model="markerForm.startTimeInfo.moveValue" />
+                                    期
+                                </p>
                             </div>
                         </div>
                         
@@ -231,23 +244,23 @@
                 <!-- 结束时间 -->
                 <el-form-item label="结束时间">
                     <div class="form-item-content">
-                        <div class="now-time">
+                        <div class="format">
                             <el-radio v-model="markerForm.endTimeInfo.timeType" :label="3">至今</el-radio>
                         </div>
-                        <div class="fixed-time">
-                            <el-radio v-model="markerForm.endTimeInfo.timeType" :label="1">固定</el-radio>
+                        <div class="format">
+                            <el-radio v-model="markerForm.endTimeInfo.timeType" :label="1" style="margin-right: 0;">固定</el-radio>
                             <el-date-picker
                                 v-model="markerForm.endTimeInfo.date"
-                                type="date"
-                                style="width: 200px;"
+                                popper-class="x-range-picker-date"
+                                style="width: 140px;"
                                 placeholder="请输入固定时间"
                                 :clearable="false"
                                 format="yyyy-MM-dd"
                                 value-format="yyyy-MM-dd"
                             ></el-date-picker>
                         </div>
-                        <div class="custom-time">
-                            <el-radio v-model="markerForm.endTimeInfo.timeType" :label="2">动态</el-radio>
+                        <div class="format">
+                            <el-radio v-model="markerForm.endTimeInfo.timeType" :label="2" style="margin-right: 0;">动态</el-radio>
                             <el-tooltip effect="dark" content="说明说明" placement="top">
                                 <i class="el-icon-question" style="font-size: 16px;"></i>
                             </el-tooltip>
@@ -260,12 +273,18 @@
                     <!-- 基准日期 -->
                     <el-form-item label="基准日期">
                         <div class="form-item-content">
-                            <div class="edb-sys-date">
+                            <div class="format">
                                 <el-radio v-model="markerForm.endTimeInfo.baseTimeType" :label="1">系统日期</el-radio>
                             </div>
-                            <div class="edb-new-date">
-                                <el-radio v-model="markerForm.endTimeInfo.baseTimeType" :label="2">指标最新日期</el-radio>
-                                <p>期数前移<el-input style="width:60px"></el-input>期</p>
+                            <div class="format" style="display: flex;align-items: center;">
+                                <p>
+                                    <el-radio v-model="markerForm.endTimeInfo.baseTimeType" :label="2" style="margin-right:5px;">指标最新日期</el-radio>
+                                </p>
+                                <p>期数前移
+                                    <el-input style="width:60px" type="number" class="number-input"
+                                    v-model="markerForm.endTimeInfo.moveValue" />
+                                    期
+                                </p>
                             </div>
                         </div>
                         
@@ -282,13 +301,16 @@
                     </div>
                     <div class="format">
                         <el-radio v-model="markerForm.calculation" :label="2">区间均值</el-radio>
-                        <p>加<el-input style="width:60px" v-model="markerForm.calculationValue"></el-input>倍标准差</p>
+                        <p>加<el-input 
+                            style="width:60px" 
+                            v-model="markerForm.calculationValue" 
+                            type="number" class="number-input"></el-input>倍标准差</p>
                     </div>
                     <div class="format">
                         <el-radio v-model="markerForm.calculation" :label="3">区间</el-radio>
                         <p>
-                            <el-input style="width:60px" v-model="calculationValue"></el-input>%
-                            <el-select v-model="calculationType">
+                            <el-input style="width:60px" v-model="calculationValue" type="number" class="number-input"></el-input>%
+                            <el-select v-model="calculationType" style="width:80px">
                                 <el-option label="个数" :value="3"></el-option>
                                 <el-option label="数值" :value="4"></el-option>
                             </el-select>分位
@@ -386,6 +408,7 @@
 import dateMoveWaySec from '@/views/datasheet_manage/components/dateMoveWaySection.vue'
 import { defaultOpts } from '@/utils/defaultOptions';
 import { verticalPositions } from '@/views/system_manage/chartTheme/common/config';
+import {ForexCalendarInterface} from '@/api/modules/toolBoxApi';
 export default {
   props: {
     isShow: {
@@ -416,6 +439,9 @@ export default {
         this.markerForm = {
           ...this.form.data
         }
+        if(!this.markerForm.markLineType){
+            Object.assign(this.markerForm,this.markerExtraConfig)
+        }
       }else {
         this.editIndex = 0;
         
@@ -545,10 +571,9 @@ export default {
         3: '横轴',
       },
 
-      //temp mock
-      radio:'固定值',
-
       isMarkStyleShow:false,
+      searchObj:'',
+      searchOptions:[]
     }
   },
   mounted(){
@@ -558,12 +583,26 @@ export default {
 
     async saveMarker() {
 
-      if(this.form.markerType==='line'&&!this.markerForm.value) return this.$message.warning(/* '标识线所在刻度不能为空' */this.$t('Chart.Vailds.plotline_msg'))
+      if(this.form.markerType==='line'&&this.markerForm.markLineType===1&&!this.markerForm.value) return this.$message.warning(/* '标识线所在刻度不能为空' */this.$t('Chart.Vailds.plotline_msg'))
 
       else if(this.form.markerType==='area'&&(!this.markerForm.fromValue||!this.markerForm.toValue)) return this.$message.warning(/* '标识区所在范围不能为空' */this.$t('Chart.Vailds.plotarea_msg'))
       
       else if(this.form.markerType==='area'&&this.markerForm.fromValue===this.markerForm.toValue) return this.$message.warning(/* '标识区所在范围不能相同' */this.$t('Chart.Vailds.plotarea_same_msg'))
 
+      //其他判断
+      if(this.form.markerType==='line'){
+        if(this.markerForm.markLineType===2&&this.edbType===2&&!this.searchObj){
+            return this.$message.warning('请选择指标!')
+        }
+        //起始日期为动态 获取日期变换
+        if(this.markerForm.startTimeInfo.timeType===2){
+            this.markerForm.startTimeInfo.dateChangeInfo = this.$refs.startTimeInfo.dateChangeArr||[]
+        }
+        //结束日期为动态 获取日期变换
+        if(this.markerForm.endTimeInfo.timeType===2){
+            this.markerForm.endTimeInfo.dateChangeInfo = this.$refs.endTimeInfo.dateChangeArr||[]
+        }
+      }
       
       let item = _.cloneDeep(this.markerForm)
 
@@ -586,13 +625,28 @@ export default {
    
     cancelHandle() {
       this.$emit('update:isShow',false)
-    }
+    },
+    searchHandle(keyword){
+        ForexCalendarInterface.searchEdbInfo({
+            KeyWord:keyword,
+            CurrentIndex:1,
+            PageSize:100,
+        }).then(res=>{
+            if(res.Ret!==200) return 
+            this.searchOptions = res.Data.List||[]
+        })
+    },
+    searchChange(){
+        if(typeof this.searchObj === 'object'){
+            //获取需要的数据
+        }
+    },
   },
 }
 </script>
 <style scoped lang='scss'>
 .main {
-  padding-left: 15%;
+  padding-left: 5%;
 }
 .bottom {
   margin: 30px 0;
@@ -606,11 +660,16 @@ export default {
   .number-input .el-input__inner { padding: 0 2px 0 10px; }
   .form-item-content{
     display: flex;
+    .format{
+        margin-right: 30px;
+    }
   }
   .date-change-ways{
+    margin-bottom: 20px;
     .header{
         label{
             text-align: left !important;
+            width:120px !important;
         }
     }
   }