|
@@ -0,0 +1,744 @@
|
|
|
+<script setup>
|
|
|
+import {ref,reactive,watch} from 'vue'
|
|
|
+import { useRoute, useRouter } from "vue-router";
|
|
|
+import EDBHistory from '@/views/dataEDB/components/EDBHistory.vue'
|
|
|
+import SelectEDB from './SelectEDB.vue'
|
|
|
+import SelectEDBClassify from '../../components/SelectEDBClassify.vue'
|
|
|
+import SelectEDBUnit from '../../components/SelectEDBUnit.vue'
|
|
|
+import SelectEDBFrequency from '../../components/SelectEDBFrequency.vue'
|
|
|
+import SeeEDBDataList from './SeeEDBDataList.vue'
|
|
|
+import {calculateTypeTipsMap} from '../../util/config'
|
|
|
+import { showToast } from 'vant';
|
|
|
+import apiDataEDB from '@/api/dataEDB'
|
|
|
+import { useWindowSize } from '@vueuse/core'
|
|
|
+
|
|
|
+const { width } = useWindowSize()
|
|
|
+const route=useRoute()
|
|
|
+const router=useRouter()
|
|
|
+
|
|
|
+const props=defineProps({
|
|
|
+ edbInfo:{
|
|
|
+ type:Object,
|
|
|
+ default:null
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+watch(
|
|
|
+ ()=>props.edbInfo,
|
|
|
+ ()=>{
|
|
|
+ if(['edit','preview'].includes(route.query.type)){
|
|
|
+ const fromEdbInfo=props.edbInfo.CalculateList[0]
|
|
|
+ const edbInfoData=props.edbInfo.EdbInfoDetail
|
|
|
+ searchEDBInfoByCode(fromEdbInfo.FromEdbCode)
|
|
|
+ baseInfo.name=edbInfoData.EdbName
|
|
|
+ baseInfo.unit=edbInfoData.Unit
|
|
|
+ baseInfo.classify=edbInfoData.ClassifyId
|
|
|
+ baseInfo.frequency=edbInfoData.Frequency
|
|
|
+ if(edbInfoData.Source===51){//降频
|
|
|
+ baseInfo.valueType=edbInfoData.CalculateFormula
|
|
|
+ }
|
|
|
+ if(edbInfoData.Source===35){//超季节性
|
|
|
+ baseInfo.calendarType=edbInfoData.Calendar
|
|
|
+ }
|
|
|
+ if(edbInfoData.Source===22){//时间位移
|
|
|
+ baseInfo.moveType=edbInfoData.MoveType
|
|
|
+ baseInfo.moveUnit=edbInfoData.MoveFrequency
|
|
|
+ baseInfo.moveVal=edbInfoData.CalculateFormula
|
|
|
+ }
|
|
|
+ if([8,12,13,35].includes(edbInfoData.Source)){
|
|
|
+ baseInfo.numberN=Number(edbInfoData.CalculateFormula)
|
|
|
+ }
|
|
|
+ if([72].includes(edbInfoData.Source)){//指数修匀
|
|
|
+ baseInfo.alphaVal=Number(edbInfoData.CalculateFormula)
|
|
|
+ }
|
|
|
+
|
|
|
+ setTimeout(() => {
|
|
|
+ selectEDBClassifyINS.value?.getSelectClassifyOpt(props.edbInfo.EdbInfoDetail.ClassifyId)//获取选择的分类目录
|
|
|
+ }, 1000);
|
|
|
+ }
|
|
|
+ }
|
|
|
+)
|
|
|
+
|
|
|
+// 预览页面
|
|
|
+const isPreview=ref(route.query.type==='preview'||false)
|
|
|
+
|
|
|
+const moveTypeOpts=[{name:'领先',key:1},{name:'滞后',key:2}]
|
|
|
+const moveUnitOpts=[
|
|
|
+ {name:'天',key:'天'},
|
|
|
+ {name:'周',key:'周'},
|
|
|
+ {name:'月',key:'月'},
|
|
|
+ {name:'季',key:'季'},
|
|
|
+ {name:'年',key:'年'},
|
|
|
+]
|
|
|
+
|
|
|
+//公式说明
|
|
|
+const showTips=ref(false)
|
|
|
+const tipsContent=ref(calculateTypeTipsMap.get(['toMonthSeason','accumulate'].includes(route.query.source)? route.query.source: Number(route.query.source))||'')
|
|
|
+
|
|
|
+//提交计算按钮文字
|
|
|
+function getCalculateBtnText(){
|
|
|
+ let str='生成计算指标'
|
|
|
+ const btnTextMap=new Map([
|
|
|
+ [5,'转月值计算'],
|
|
|
+ [6,'同比值计算'],
|
|
|
+ [7,'同差值计算'],
|
|
|
+ [8,'移动平均计算'],
|
|
|
+ [12,'环比值计算'],
|
|
|
+ [13,'环差值计算'],
|
|
|
+ [14,'升频计算'],
|
|
|
+ [22,'保存'],
|
|
|
+ [35,'超季节性计算'],
|
|
|
+ [52,'年化计算'],
|
|
|
+ [51,'降频计算'],
|
|
|
+ [61,'转季值计算'],
|
|
|
+ [62,'累计值计算'],
|
|
|
+ [63,'年初至今计算'],
|
|
|
+ [72,'指数修匀计算'],
|
|
|
+ ])
|
|
|
+ str=btnTextMap.get(source.value)
|
|
|
+
|
|
|
+ return str
|
|
|
+}
|
|
|
+
|
|
|
+const editEdbInfoId=ref(route.query.edbInfoId||0)//编辑时的指标id
|
|
|
+const source=ref(0)//计算类型
|
|
|
+const tabsArr=ref([])
|
|
|
+// 初始化
|
|
|
+function init(){
|
|
|
+ // 累计值转月/季值
|
|
|
+ if(route.query.source==='toMonthSeason'){
|
|
|
+ tabsArr.value=[{ label: '累计值转月值',key: 5 },{ label: '累计值转季值',key: 61 }]
|
|
|
+ source.value=5
|
|
|
+ }else if(route.query.source==='accumulate'){//累计值
|
|
|
+ tabsArr.value=[{ label: '累计值',key: 62 },{ label: '年初至今累计值',key: 63 }]
|
|
|
+ source.value=62
|
|
|
+ }else{
|
|
|
+ tabsArr.value=[]
|
|
|
+ source.value=Number(route.query.source)
|
|
|
+ }
|
|
|
+}
|
|
|
+init()
|
|
|
+
|
|
|
+// 选择指标
|
|
|
+const showSelectEDB=ref(false)
|
|
|
+const selectEDBinfo=ref(null)
|
|
|
+function handleConfirmSelectEDB(e){
|
|
|
+ selectEDBinfo.value=e
|
|
|
+ updateBaseInfoData(e)
|
|
|
+}
|
|
|
+// 编辑时回显选择的指标 通过code去搜索
|
|
|
+function searchEDBInfoByCode(code){
|
|
|
+ apiDataEDB.edbSearchList({KeyWord:code,CurrentIndex:1,PageSize:1}).then(res=>{
|
|
|
+ if(res.Ret===200){
|
|
|
+ selectEDBinfo.value=res.Data?.List[0]
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+// 选择指标更新基础信息
|
|
|
+function updateBaseInfoData(data){
|
|
|
+ const tMap=new Map([
|
|
|
+ ['日度','D'],
|
|
|
+ ['周度','W'],
|
|
|
+ ['旬度','T'],
|
|
|
+ ['月度','M'],
|
|
|
+ ['季度','Q'],
|
|
|
+ ['年度','Y'],
|
|
|
+ ])
|
|
|
+ const name_map = {
|
|
|
+ 5: data.EdbName,
|
|
|
+ 8: `${data.EdbName}/${baseInfo.numberN}${tMap.get(data.Frequency)}MA`,
|
|
|
+ 14: `${data.EdbName}/${data.Frequency}升频`,
|
|
|
+ 6: `${data.EdbName}同比`,
|
|
|
+ 7: `${data.EdbName}同差`,
|
|
|
+ 12: `${data.EdbName}${baseInfo.numberN}${data.Frequency.slice(0,1)}环比`,
|
|
|
+ 13: `${data.EdbName}${baseInfo.numberN}${data.Frequency.slice(0,1)}环差`,
|
|
|
+ 35: `${data.EdbName}超季节性/${baseInfo.numberN}年${baseInfo.calendarType==='公历'?'':'/'+baseInfo.calendarType}`,
|
|
|
+ 52: `${data.EdbName}年化`,
|
|
|
+ 51: `${data.EdbName}/${data.Frequency}降频`,
|
|
|
+ 61: data.EdbName,
|
|
|
+ 62: data.EdbName,
|
|
|
+ 63: data.EdbName,
|
|
|
+ 72: `${data.EdbName}指数修匀`,
|
|
|
+ }
|
|
|
+ baseInfo.name=name_map[source.value]||''
|
|
|
+ baseInfo.unit=[5,8,14,7,35,72].includes(source.value) ? data.Unit : '无',
|
|
|
+ baseInfo.frequency=source.value === 14 ? '日度' : source.value === 61 ? '季度' : source.value === 62 ? '' : data.Frequency
|
|
|
+
|
|
|
+ if(source.value===72){//指数修匀目录默认和选择的指标在同一个目录
|
|
|
+ selectEDBClassifyINS.value?.getSelectClassifyOpt(data.ClassifyId)//获取选择的分类目录
|
|
|
+ }
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+// 基础信息
|
|
|
+const edbNameInputFocus=ref(false)
|
|
|
+const numberNInputFocus=ref(false)
|
|
|
+const alphaValInputFocus=ref(false)
|
|
|
+const baseInfo=reactive({
|
|
|
+ name:'',
|
|
|
+ unit:'',
|
|
|
+ classify:'',
|
|
|
+ frequency:'',
|
|
|
+ numberN:1,//N值
|
|
|
+ moveVal:'',
|
|
|
+ moveType:1,
|
|
|
+ moveUnit:'天',
|
|
|
+ calendarType:'公历',
|
|
|
+ valueType:'期末值',
|
|
|
+ alphaVal:'',
|
|
|
+})
|
|
|
+
|
|
|
+// 选择单位
|
|
|
+const showSelectUnit=ref(false)
|
|
|
+function onConfirmSelectUnit(value){
|
|
|
+ baseInfo.unit=value
|
|
|
+}
|
|
|
+
|
|
|
+//选择分类
|
|
|
+const showSelectClassify=ref(false)
|
|
|
+const classifyStr=ref('')
|
|
|
+const selectEDBClassifyINS=ref(null)
|
|
|
+function handleConfirmClassify({value,selectedOptions}){
|
|
|
+ if(selectedOptions.length===0){
|
|
|
+ baseInfo.classify=''
|
|
|
+ classifyStr.value=''
|
|
|
+ return
|
|
|
+ }
|
|
|
+ baseInfo.classify=value
|
|
|
+ classifyStr.value=`${selectedOptions[0].ClassifyName}/${selectedOptions[1].ClassifyName}/${selectedOptions[2].ClassifyName}`
|
|
|
+}
|
|
|
+
|
|
|
+//选择频度
|
|
|
+const showSelectFrequency=ref(false)
|
|
|
+function handleConfirmFrequency(value){
|
|
|
+ baseInfo.frequency=value
|
|
|
+}
|
|
|
+
|
|
|
+//移动方式类型选择
|
|
|
+const showMoveType=ref(false)
|
|
|
+function onSelectMoveType(e){
|
|
|
+ baseInfo.moveType=e.key
|
|
|
+}
|
|
|
+function getMoveTypeName(e){
|
|
|
+ return moveTypeOpts.filter(item=>item.key===e)[0].name
|
|
|
+}
|
|
|
+
|
|
|
+//移动方式单位选择
|
|
|
+const showMoveUnit=ref(false)
|
|
|
+function onSelectMoveUnit(e){
|
|
|
+ baseInfo.moveUnit=e.key
|
|
|
+}
|
|
|
+
|
|
|
+//超季节性日历选择
|
|
|
+const showSelectCalendar=ref(false)
|
|
|
+
|
|
|
+//降频数据取值选择
|
|
|
+const showDataValSelect=ref(false)
|
|
|
+
|
|
|
+//查看指标数据详情
|
|
|
+const showSeeEDBDataList=ref(false)
|
|
|
+
|
|
|
+// 提交计算
|
|
|
+const saveBtnLoading=ref(false)
|
|
|
+async function handleSave(){
|
|
|
+ if(!selectEDBinfo.value){
|
|
|
+ showToast('指标不能为空')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(!baseInfo.name){
|
|
|
+ showToast('指标名称不能为空')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(!baseInfo.unit){
|
|
|
+ showToast('指标单位不能为空')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(!baseInfo.classify){
|
|
|
+ showToast('指标目录不能为空')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if(!baseInfo.frequency){
|
|
|
+ showToast('指标频度不能为空')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if([72].includes(source.value)){
|
|
|
+ if(baseInfo.alphaVal<=0||baseInfo.alphaVal>=1){
|
|
|
+ showToast('请输入>0,<1的alpha数值')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ const valueMap = {
|
|
|
+ 22: 'moveVal',
|
|
|
+ 51: 'valueType',
|
|
|
+ 72: 'alphaVal'
|
|
|
+ }
|
|
|
+ const params={
|
|
|
+ FromEdbInfoId: selectEDBinfo.value.EdbInfoId,
|
|
|
+ Source: source.value,
|
|
|
+ EdbName: baseInfo.name,
|
|
|
+ Unit: baseInfo.unit,
|
|
|
+ ClassifyId: baseInfo.classify,
|
|
|
+ Frequency: baseInfo.frequency,
|
|
|
+ Formula: valueMap[source.value] ? String(baseInfo[valueMap[source.value]]) : String(baseInfo.numberN),
|
|
|
+ MoveFrequency: baseInfo.moveUnit,
|
|
|
+ MoveType: baseInfo.moveType,
|
|
|
+ Calendar: baseInfo.calendarType,
|
|
|
+ }
|
|
|
+
|
|
|
+ saveBtnLoading.value=true
|
|
|
+ const res=route.query.type==='edit'?await apiDataEDB.editCalculateEDB({...params,EdbInfoId:Number(route.query.edbInfoId)}) : await apiDataEDB.addCalculateEDB(params)
|
|
|
+ saveBtnLoading.value=false
|
|
|
+ if(res.Ret===200){
|
|
|
+ showToast(res.Msg)
|
|
|
+ setTimeout(() => {
|
|
|
+ if(route.query.type==='edit'){
|
|
|
+ router.back()
|
|
|
+ }else{
|
|
|
+ router.replace({
|
|
|
+ path:'/dataEDB/detail',
|
|
|
+ query:{
|
|
|
+ edbInfoId:res.Data.EdbInfoId
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }, 1500);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+// tab切换重置表单
|
|
|
+function handleTabChange(){
|
|
|
+ selectEDBinfo.value=null
|
|
|
+ baseInfo.name=''
|
|
|
+ baseInfo.unit=''
|
|
|
+ baseInfo.classify=''
|
|
|
+ baseInfo.frequency=''
|
|
|
+ baseInfo.numberN=1
|
|
|
+ baseInfo.moveVal=''
|
|
|
+ baseInfo.moveType=1
|
|
|
+ baseInfo.moveUnit='天'
|
|
|
+ baseInfo.calendarType='公历'
|
|
|
+ baseInfo.valueType='期末值'
|
|
|
+ classifyStr.value=''
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+//点击选择的指标左侧图标查看指标详情
|
|
|
+const showEDBHistory=ref(false)// 显示指标溯源
|
|
|
+const edbHistoryId=ref(0)
|
|
|
+function handleShowEDBHistory(data){
|
|
|
+ //计算指标打开弹窗,基础指标打开新页面
|
|
|
+ if(data.EdbType===2){
|
|
|
+ edbHistoryId.value=data.EdbInfoId
|
|
|
+ showEDBHistory.value=true
|
|
|
+ }else{
|
|
|
+ const routerEl=router.resolve({
|
|
|
+ path:'/dataEDB/detail',
|
|
|
+ query:{
|
|
|
+ edbInfoId:data.EdbInfoId
|
|
|
+ }
|
|
|
+ })
|
|
|
+ window.open(routerEl.href,'_blank')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <div class="other-calculate-wrap">
|
|
|
+ <van-tabs
|
|
|
+ v-model:active="source"
|
|
|
+ sticky
|
|
|
+ :offset-top="width>650?60:0"
|
|
|
+ border
|
|
|
+ title-active-color="#0052D9"
|
|
|
+ title-inactive-color="#333"
|
|
|
+ line-width="16px"
|
|
|
+ @change="handleTabChange"
|
|
|
+ v-if="tabsArr.length"
|
|
|
+ >
|
|
|
+ <van-tab
|
|
|
+ :title="tab.label"
|
|
|
+ :name="tab.key"
|
|
|
+ v-for="tab in tabsArr"
|
|
|
+ :key="tab.key"
|
|
|
+ />
|
|
|
+ </van-tabs>
|
|
|
+ <section class="section select-edb-box">
|
|
|
+ <van-field
|
|
|
+ :modelValue="selectEDBinfo?.EdbName"
|
|
|
+ label="选择指标"
|
|
|
+ :right-icon="!isPreview?'arrow':''"
|
|
|
+ readonly
|
|
|
+ placeholder="请选择指标"
|
|
|
+ input-align="right"
|
|
|
+ @click-input="showSelectEDB=true"
|
|
|
+ :disabled="isPreview"
|
|
|
+ >
|
|
|
+ <template #left-icon>
|
|
|
+ <div class="left-icon" v-if="selectEDBinfo" @click="handleShowEDBHistory(selectEDBinfo)">
|
|
|
+ <svg-icon name="edb-history-tag" size="24px"/>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ </section>
|
|
|
+ <section class="section edbinfo-box">
|
|
|
+ <div class="van-cell__title">已选指标</div>
|
|
|
+ <div v-if="!selectEDBinfo">
|
|
|
+ <img class="list-empty-img" src="https://hzstatic.hzinsights.com/static/ETA_mobile/empty_img.png" alt="">
|
|
|
+ <p style="text-align:center;color:#999">暂无指标</p>
|
|
|
+ </div>
|
|
|
+ <div class="info-box" v-else>
|
|
|
+ <h2 class="name">{{selectEDBinfo?.EdbName}}</h2>
|
|
|
+ <ul class="info-list">
|
|
|
+ <li class="info-item">ID:{{selectEDBinfo.EdbCode}}</li>
|
|
|
+ <li class="info-item">起始时间:{{selectEDBinfo.StartDate}}</li>
|
|
|
+ <li class="info-item">频度:{{selectEDBinfo.Frequency}}</li>
|
|
|
+ <li class="info-item">更新时间:{{selectEDBinfo.ModifyTime}}</li>
|
|
|
+ <li class="info-item">单位:{{selectEDBinfo.Unit}}</li>
|
|
|
+ <li class="info-item">数据来源:{{selectEDBinfo.SourceName}}</li>
|
|
|
+ </ul>
|
|
|
+ <div style="text-align:right">
|
|
|
+ <van-button color="#0052D9" size="small" @click="showSeeEDBDataList=true">查看数据</van-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </section>
|
|
|
+ <section class="section baseinfo-box">
|
|
|
+ <!-- 时间位移(移动方式) -->
|
|
|
+ <van-field
|
|
|
+ label="移动方式"
|
|
|
+ required
|
|
|
+ v-if="source===22"
|
|
|
+ :disabled="isPreview"
|
|
|
+ >
|
|
|
+ <template #input>
|
|
|
+ <div class="move-type-box">
|
|
|
+ <div :class="['btn',isPreview?'disabled':'']" @click="()=>{if(isPreview)return false;showMoveType=true}">
|
|
|
+ <svg-icon name="swap" v-if="!isPreview"></svg-icon>
|
|
|
+ <span>{{getMoveTypeName(baseInfo.moveType)}}</span>
|
|
|
+ </div>
|
|
|
+ <input :disabled="isPreview" class="input" type="number" :min="0" v-model="baseInfo.moveVal">
|
|
|
+ <div :class="['btn',isPreview?'disabled':'']" @click="()=>{if(isPreview)return false;showMoveUnit=true}">
|
|
|
+ <svg-icon name="swap" v-if="!isPreview"></svg-icon>
|
|
|
+ <span>{{baseInfo.moveUnit}}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ <van-field
|
|
|
+ v-model="baseInfo.name"
|
|
|
+ label="指标名称"
|
|
|
+ placeholder="指标名称"
|
|
|
+ input-align="right"
|
|
|
+ required
|
|
|
+ @focus="edbNameInputFocus=true"
|
|
|
+ @blur="edbNameInputFocus=false"
|
|
|
+ :disabled="isPreview"
|
|
|
+ >
|
|
|
+ <template #right-icon>
|
|
|
+ <svg-icon v-if="!isPreview" class="edit-icon" name="edit" :color="edbNameInputFocus?'#0052D9':'#333333'"/>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ <van-field
|
|
|
+ :modelValue="baseInfo.unit"
|
|
|
+ readonly
|
|
|
+ label="单位"
|
|
|
+ placeholder="请选择单位"
|
|
|
+ input-align="right"
|
|
|
+ :right-icon="!isPreview?'arrow':''"
|
|
|
+ required
|
|
|
+ @click-input="showSelectUnit=true"
|
|
|
+ :disabled="!editEdbInfoId&&[6,7].includes(source)||isPreview"
|
|
|
+ />
|
|
|
+ <van-field
|
|
|
+ :modelValue="classifyStr"
|
|
|
+ readonly
|
|
|
+ label="指标目录"
|
|
|
+ placeholder="请选择指标目录"
|
|
|
+ input-align="right"
|
|
|
+ :right-icon="!isPreview?'arrow':''"
|
|
|
+ required
|
|
|
+ @click-input="showSelectClassify=true"
|
|
|
+ :disabled="isPreview"
|
|
|
+ />
|
|
|
+ <van-field
|
|
|
+ :modelValue="baseInfo.frequency"
|
|
|
+ readonly
|
|
|
+ label="频度"
|
|
|
+ placeholder="请选择指标频度"
|
|
|
+ input-align="right"
|
|
|
+ :right-icon="!isPreview?'arrow':''"
|
|
|
+ required
|
|
|
+ @click-input="showSelectFrequency=true"
|
|
|
+ :disabled="[5,14,61,63].includes(source)||(!editEdbInfoId&&[6,7].includes(source))||isPreview"
|
|
|
+ />
|
|
|
+ <van-field
|
|
|
+ v-if="[8,12,13,35].includes(source)"
|
|
|
+ v-model.number="baseInfo.numberN"
|
|
|
+ label="N等于"
|
|
|
+ placeholder="请输入N数值"
|
|
|
+ input-align="right"
|
|
|
+ required
|
|
|
+ @focus="numberNInputFocus=true"
|
|
|
+ @blur="numberNInputFocus=false"
|
|
|
+ :disabled="isPreview"
|
|
|
+ >
|
|
|
+ <template #right-icon>
|
|
|
+ <svg-icon v-if="!isPreview" class="edit-icon" name="edit" :color="numberNInputFocus?'#0052D9':'#333333'"/>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ <!-- 超季节性日历 -->
|
|
|
+ <van-field
|
|
|
+ v-if="source===35"
|
|
|
+ :modelValue="baseInfo.calendarType"
|
|
|
+ readonly
|
|
|
+ label="日历"
|
|
|
+ placeholder="请选择日历"
|
|
|
+ input-align="right"
|
|
|
+ :right-icon="!isPreview?'arrow':''"
|
|
|
+ required
|
|
|
+ @click-input="showSelectCalendar=true"
|
|
|
+ :disabled="isPreview"
|
|
|
+ />
|
|
|
+ <!-- 降频数据取值 -->
|
|
|
+ <van-field
|
|
|
+ v-if="source===51"
|
|
|
+ :modelValue="baseInfo.valueType"
|
|
|
+ readonly
|
|
|
+ label="数据取值"
|
|
|
+ placeholder="请选择"
|
|
|
+ input-align="right"
|
|
|
+ :right-icon="!isPreview?'arrow':''"
|
|
|
+ @click-input="showDataValSelect=true"
|
|
|
+ :disabled="isPreview"
|
|
|
+ />
|
|
|
+ <!-- 指数修匀 alpha 值 -->
|
|
|
+ <van-field
|
|
|
+ v-if="[72].includes(source)"
|
|
|
+ v-model.number="baseInfo.alphaVal"
|
|
|
+ type="number"
|
|
|
+ label="alpha值"
|
|
|
+ placeholder="请输入alpha值"
|
|
|
+ input-align="right"
|
|
|
+ required
|
|
|
+ @focus="alphaValInputFocus=true"
|
|
|
+ @blur="alphaValInputFocus=false"
|
|
|
+ :disabled="isPreview"
|
|
|
+ >
|
|
|
+ <template #right-icon>
|
|
|
+ <svg-icon v-if="!isPreview" class="edit-icon" name="edit" :color="alphaValInputFocus?'#0052D9':'#333333'"/>
|
|
|
+ </template>
|
|
|
+ </van-field>
|
|
|
+ </section>
|
|
|
+
|
|
|
+ <div class="formula-intro-btn" @click="showTips=true">
|
|
|
+ <svg-icon class="icon" name="warning"></svg-icon>
|
|
|
+ <span>公式说明</span>
|
|
|
+ </div>
|
|
|
+ <div class="opt-btns" v-if="!isPreview">
|
|
|
+ <van-button class="primary2" @click="$router.back()">取消</van-button>
|
|
|
+ <van-button
|
|
|
+ type="primary"
|
|
|
+ :loading="saveBtnLoading"
|
|
|
+ loading-text="计算中..."
|
|
|
+ @click="handleSave"
|
|
|
+ >{{getCalculateBtnText()}}</van-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 选择指标 -->
|
|
|
+ <SelectEDB v-model:show="showSelectEDB" :source='source' @select="handleConfirmSelectEDB"/>
|
|
|
+
|
|
|
+ <!-- 选择单位 -->
|
|
|
+ <SelectEDBUnit v-model:show="showSelectUnit" @select="onConfirmSelectUnit"/>
|
|
|
+
|
|
|
+ <!-- 选择分类 -->
|
|
|
+ <SelectEDBClassify ref="selectEDBClassifyINS" v-model:show="showSelectClassify" :defaultId="baseInfo.classify" @select="handleConfirmClassify" />
|
|
|
+
|
|
|
+ <!-- 选择频度 -->
|
|
|
+ <SelectEDBFrequency v-model:show="showSelectFrequency" @select="handleConfirmFrequency"/>
|
|
|
+
|
|
|
+ <!-- 查看指标数据 -->
|
|
|
+ <SeeEDBDataList v-model:show="showSeeEDBDataList" :edbInfoId="selectEDBinfo?.EdbInfoId" />
|
|
|
+
|
|
|
+ <!-- 移动方式类型选择 -->
|
|
|
+ <van-action-sheet v-model:show="showMoveType" close-on-click-action :actions="moveTypeOpts" @select="onSelectMoveType" />
|
|
|
+
|
|
|
+ <!-- 移动方式单位选择 -->
|
|
|
+ <van-action-sheet v-model:show="showMoveUnit" close-on-click-action :actions="moveUnitOpts" @select="onSelectMoveUnit" />
|
|
|
+
|
|
|
+ <!-- 超季节性日历选择 -->
|
|
|
+ <van-action-sheet v-model:show="showSelectCalendar" close-on-click-action :actions="[{name:'公历'},{name:'农历'}]" @select="e=>baseInfo.calendarType=e.name" />
|
|
|
+
|
|
|
+ <!-- 降频数据取值 -->
|
|
|
+ <van-action-sheet v-model:show="showDataValSelect" close-on-click-action :actions="[{name:'期末值'},{name:'平均值'}]" @select="e=>baseInfo.valueType=e.name" />
|
|
|
+
|
|
|
+ <!-- 指标溯源 -->
|
|
|
+ <EDBHistory v-model:show="showEDBHistory" :edbInfoId="edbHistoryId"/>
|
|
|
+
|
|
|
+ <!-- 公式说明 -->
|
|
|
+ <van-dialog
|
|
|
+ v-model:show="showTips"
|
|
|
+ :title="$route.query.name"
|
|
|
+ confirmButtonText='知道啦'
|
|
|
+ >
|
|
|
+ <div class="edb-formula-tips-html-box" v-html="tipsContent"></div>
|
|
|
+ </van-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.other-calculate-wrap{
|
|
|
+ min-height: 90vh;
|
|
|
+ background-color: $page-bg-grey;
|
|
|
+ padding-bottom: 210px ;
|
|
|
+}
|
|
|
+.section{
|
|
|
+ background-color: #fff;
|
|
|
+ margin-bottom: 32px;
|
|
|
+}
|
|
|
+.edbinfo-box{
|
|
|
+ padding: var(--van-cell-horizontal-padding);
|
|
|
+ .info-box{
|
|
|
+ margin-top: 14px;
|
|
|
+ border-radius: 8px;
|
|
|
+ border: 1px solid $border-color;
|
|
|
+ box-shadow: $box-shadow;
|
|
|
+ padding: 20px;
|
|
|
+ .name{
|
|
|
+ font-size: 32px;
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ }
|
|
|
+ .info-list{
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ gap: 10px 0;
|
|
|
+ color: $font-grey;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ .info-item{
|
|
|
+ width: 100%;
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.move-type-box{
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+ gap: 20px;
|
|
|
+ .input{
|
|
|
+ box-sizing: border-box;
|
|
|
+ display: block;
|
|
|
+ border-radius: 12px;
|
|
|
+ width: 150px;
|
|
|
+ height: 72px;
|
|
|
+ padding: 0 32px;
|
|
|
+ background-color: #f6f6f6;
|
|
|
+ }
|
|
|
+ .btn{
|
|
|
+ flex-shrink: 0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 130px;
|
|
|
+ height: 72px;
|
|
|
+ border-radius: 12px;
|
|
|
+ background-color: #F2F3FF;
|
|
|
+ color: $theme-color;
|
|
|
+ }
|
|
|
+ .disabled{
|
|
|
+ background-color: #F6F6F6;
|
|
|
+ color: #333;
|
|
|
+ }
|
|
|
+}
|
|
|
+.formula-intro-btn{
|
|
|
+ width: 180px;
|
|
|
+ height: 60px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ gap: 5px;
|
|
|
+ color: $theme-color;
|
|
|
+ line-height: 1;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 32px;
|
|
|
+ margin-left: auto;
|
|
|
+ margin-right: var(--van-cell-horizontal-padding);
|
|
|
+ .icon{
|
|
|
+ width: 24px;
|
|
|
+ height: 24px;
|
|
|
+ }
|
|
|
+}
|
|
|
+.opt-btns{
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ background-color: #fff;
|
|
|
+ z-index: 99;
|
|
|
+ padding: 48px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ .van-button{
|
|
|
+ width: 48%;
|
|
|
+ max-width: 300PX;
|
|
|
+ }
|
|
|
+}
|
|
|
+@media screen and (min-width:$media-width){
|
|
|
+ .other-calculate-wrap{
|
|
|
+ padding-bottom: 105px;
|
|
|
+ }
|
|
|
+ .section{
|
|
|
+ margin-bottom: 16px;
|
|
|
+ }
|
|
|
+ .edbinfo-box{
|
|
|
+ .info-box{
|
|
|
+ margin-top: 7px;
|
|
|
+ border-radius: 4px;
|
|
|
+ padding: 10px;
|
|
|
+ .name{
|
|
|
+ font-size: 16px;
|
|
|
+ margin: 0 0 5px 0;
|
|
|
+ }
|
|
|
+ .info-list{
|
|
|
+ gap: 5px 0;
|
|
|
+ margin-bottom: 5px;
|
|
|
+ .info-item{
|
|
|
+ margin-bottom: 5px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .move-type-box{
|
|
|
+ gap: 10px;
|
|
|
+ .input{
|
|
|
+ border-radius: 6px;
|
|
|
+ width: 65px;
|
|
|
+ height: 36px;
|
|
|
+ padding: 0 16px;
|
|
|
+ }
|
|
|
+ .btn{
|
|
|
+ width: 65px;
|
|
|
+ height: 36px;
|
|
|
+ border-radius: 6px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .formula-intro-btn{
|
|
|
+ width: 90px;
|
|
|
+ height: 30px;
|
|
|
+ gap: 2px;
|
|
|
+ border-radius: 16px;
|
|
|
+ .icon{
|
|
|
+ width: 12px;
|
|
|
+ height: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .opt-btns{
|
|
|
+ padding: 24px;
|
|
|
+ justify-content: center;
|
|
|
+ gap: 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|