eta_front/src/views/dataEntry_manage/databaseComponents/operationDialog.vue

<template>
	<el-dialog
		:visible.sync="isOperation"
		:close-on-click-modal="false"
		:modal-append-to-body="false"
		@close="cancelHandle"
		custom-class="operation-dialog fit-screen-dialog"
		center
		top="5vh"
		v-dialogDrag
	>
		<div slot="title" style="display: flex; align-items: center">
			<img
				:src="$icons.computed"
				style="color: #fff; width: 16px; height: 16px; margin-right: 5px"
			/>
			<span style="font-size: 16px">{{ (operationForm.edb_id ? (operationForm.view ? $t('Dialog.title_prefix_view') : $t('Dialog.title_prefix_edit')) : '') + titleMap.get(type) }}</span>
		</div>
		<div class="dialog-main">

			<!-- 多选source -->
			<ul class="label-cont" v-if="!operationForm.view && !operationForm.edb_id">
				<li v-for="item in sourceList" :key="item.key" :class="{act: type === item.key}" @click="init();$emit('changeSource',item.key)">{{item.label}}</li>
			</ul>

			<div class="min-top">
				<label ><!-- 选择指标 -->{{$t('Edb.choose_edb')}}：</label>

				<el-select
					v-model="select_target"
					v-loadMore="searchLoad"
					:filterable="!select_target"
					clearable
					:placeholder="$t('Edb.InputHolderAll.input_name')"
					style="width: 85%"
					remote
					:remote-method="getTarget"
					@click.native="inputFocusHandle"
					@change="chooseTarget"
					@blur="search_have_more = false"
					:disabled="operationForm.view"
				>
					<i slot="prefix" class="el-input__icon el-icon-search"></i>
					<el-option
						v-for="item in searchOptions"
						:key="item.EdbInfoId"
						:label="$parent.currentLang==='en'?(item.EdbNameEn||item.EdbName):item.EdbName"
						:value="item.EdbInfoId"
						:disabled="!item.HaveOperaAuth"
					>
						<div>
							<img 
								:src="$icons.lock_ico2" 
								width="18" 
								height="18" 
								style="vertical-align:middle" 
								v-if="!item.HaveOperaAuth"
							/>
							{{$parent.currentLang==='en'?(item.EdbNameEn||item.EdbName):item.EdbName}}
						</div>
					</el-option>
				</el-select>
				<i class="el-icon-tickets" style="color:#409EFF;font-size:18px" @click="handleSelectBtnClick" v-if="select_target"/>
				
			</div>
			<div class="middle">
				<label>{{ $t('Edb.have_choose_edb') }}：</label>
				<el-table
				:data="tableData"
				style="box-shadow: 0px 3px 6px rgba(155, 170, 219, 0.2);margin-top:10px;"
				border>
					<el-table-column
						v-for="item in tableColums"
						:key="item.label"
						:label="item.label"
						:width="item.widthsty"
						:min-width="item.minwidthsty"
						align="center"
					>
						<template slot-scope="scope">
							<span v-if="item.key==='Frequency'">{{ getFrequencyTrans(scope.row.Frequency) }}</span>
							<span v-else-if="item.key==='Unit'">{{ getUnitTrans(scope.row.Unit) }}</span>
							<span v-else>{{ scope.row[item.key] }}</span>
						</template>
					</el-table-column>
					<el-table-column
						width="110"
						align="center"
						:label="$t('Table.column_operations')"
						v-if="!operationForm.view"
					>
						<template slot-scope="scope">
							<span class="deletesty" @click="delTarget"><!-- 删除 -->{{$t('Table.delete_btn')}}</span>
						</template>
					</el-table-column>
					<div slot="empty" style="padding:20px 0 30px;">
						<tableNoData :text="$t('Table.no_edb_msg')" size="mini"/>
					</div>
				</el-table>
				<ul 
					class="data-ul" 
					ref="dataUl" 
					@scroll="scrollHandle"
					v-if="dataList.length">
						<li
							class="value-item"
							v-for="(item, index) in dataList"
							:key="item.EdbDataId"
						>
							<span class="value-label">
								<i class="new-tag" v-if="index === 0"></i>
								{{item.DataTime}}
							</span>
							<span class="value-label" style="min-width:200px;text-align:center;">{{item.Value}}</span>
						</li>
				</ul>
				<div class="form-cont">
					<el-form
						ref="form"
						label-position="right"
						inline
						label-width="120px"
						:model="formData"
						:rules="formRules"
						:disabled="operationForm.view"
					>
						<!-- 时间移位选项 -->
						<el-form-item :label="$t('EtaBasePage.label_move_way')" style="display: block;" v-if="type === 22" prop="moveVal">
							<el-select
								v-model="formData.moveType"
								style="width: 100px"
								placeholder=""
								size="mini"
								@change="refreshTarget"
							>
								<el-option
									v-for="item in moveTypeOpions"
									:key="item.key"
									:label="item.label"
									:value="item.key"
								>
								</el-option>
							</el-select>
							<el-input
								style="width: 80px"
								type="number"
								min="0"
								size="mini"
								v-model="formData.moveVal"
								@change="refreshTarget"
								@keyup.native="filterCode(formData)"
							></el-input>
							<el-select
								v-model="formData.moveUnit"
								size="mini"
								placeholder=""
								style="width: 100px"
								@change="refreshTarget"
							>
								<el-option
									v-for="item in fre_options"
									:key="item.label"
									:label="item.label"
									:value="item.value"
								>
								</el-option>
							</el-select>
						</el-form-item>
						<!-- 指标名称 -->
						<el-form-item :label="$t('Edb.Detail.e_name')" prop="targetName">
							<el-input
								v-model="formData.targetName"
								style="width: 340px"
								:placeholder="$t('Edb.InputHolderAll.input_name')"
							/>
						</el-form-item>
						<!-- 指标单位 -->
						<el-form-item :label="$t('Edb.Detail.e_unit')" prop="unit">
							<selectUnit 
								v-model="formData.unit" 
								style="width: 340px" 
								:disabled="!operationForm.edb_id&&[6,7,75].includes(type)"
							/>
						</el-form-item>
						<!-- 指标目录 -->
						<el-form-item :label="$t('Edb.Detail.e_menu')" prop="menu">
							<cascader
								v-model="formData.menu"
								:options="options"
								clearable
								:placeholder="$t('Edb.InputHolderAll.input_menu')"
								:config="{ checkStrictly: true }"
							/>
						</el-form-item>
						<!-- 指标频度 -->
						<el-form-item :label="$t('Edb.Detail.e_fre')" prop="frequency">
							<el-select
								v-model="formData.frequency"
								:placeholder="$t('Edb.InputHolderAll.input_fre')"
								style="width: 340px"
								clearable
								:disabled="[5,14,61,63].includes(type)||(!operationForm.edb_id&&[6,7,75].includes(type))"
								@change="handleFrequencyChange"
							>
								<el-option
									v-for="item in frequencyArr"
									:key="item.label"
									:label="item.label"
									:value="item.value"
								>
								</el-option>
							</el-select>
						</el-form-item>
						<!-- N数值 -->
						<el-form-item :label="$t('EtaBasePage.label_n_val')"  prop="n_num" v-if="[8,12,13,35].includes(type)">
							<el-input
								v-model="formData.n_num"
								style="width: 340px"
								:placeholder="$t('Edb.InputHolderAll.input_n_val')"
								type="number"
								@change="NchangeHandle"
							/>
						</el-form-item>
						<!-- 超季节性 公历农历-->
						<el-form-item :label="$t('EtaBasePage.label_calendar')" prop="calendar_type" v-if="type===35">
							<el-select
								v-model="formData.calendar_type"
								:placeholder="$t('EtaBasePage.label_calendar_placeholder')"
								style="width: 340px"
								@change="NchangeHandle"
							>
								<el-option
									v-for="item in calendarOptions"
									:key="item.key"
									:label="item.label"
									:value="item.label"
								>
								</el-option>
							</el-select>
						</el-form-item>
						<!-- 降频 取值类型 -->
						<el-form-item :label="$t('EtaBasePage.label_val_type')"  prop="value_type" v-if="type===51">
							<el-select
								v-model="formData.value_type"
								placeholder="请选择数据取值类型"
								style="width: 340px"
							>
								<el-option :label="$t('EtaBasePage.val_type_end')" value="期末值"/>
								<el-option :label="$t('EtaBasePage.val_type_average')" value="平均值"/>
							</el-select>
						</el-form-item>
						<!-- 最新值处理 -->
						<el-form-item :label="$t('Edb.CalculatesAll.latest_processing')" prop="new_value" v-if="type===62">
							<el-select v-model="formData.new_value" placeholder="请选择" style="width: 340px">
								<el-option :label="$t('EtaBasePage.default_select_text')" value=""></el-option>
								<el-option :label="$t('EtaBasePage.mean_imputation_select_text')" :value="'均值填充'" v-if="hasNewValueOpt"></el-option> 
							</el-select>
						</el-form-item>
						<el-form-item :label="$t('EtaBasePage.null_val_deal')" prop="emptyType" v-if="type===14">
							<el-select
								v-model="formData.emptyType"
								:placeholder="$t('Edb.InputHolderAll.input_fre')"
								style="width: 340px"
							>
								<el-option :label="$t('EtaBasePage.null_val_deal_2')" :value="0"></el-option>
								<el-option :label="$t('EtaBasePage.null_val_deal_3')" :value="3"></el-option>
							</el-select>
						</el-form-item>
					</el-form>
				</div>
			</div>
		</div>
		<div class="dia-bot" v-if="!operationForm.view">
			<el-button
				type="primary"
				style="margin-right: 20px"
				@click="saveHandle"
				:loading="loading"
				>{{loading ? $t('Edb.calculate_ing') : operationForm.edb_id ? $t('Dialog.confirm_save_btn') : saveBtnMap.get(type)}}</el-button
			>
			<el-button type="primary" plain @click="cancelHandle('cancel')"><!-- 取消 -->{{$t('Dialog.cancel_btn')}}</el-button>
		</div>
		<el-popover
			placement="top-start"
			width="500"
			trigger="click">
			<p style="padding:30px;line-height:25px;" v-html="$parent.tips.get(type)"/>
			<span slot="reference" class="tip-label"><!-- 公式说明 -->{{$t('Edb.formula_instru')}}</span>
		</el-popover>
	</el-dialog>
</template>

<script>
import { dataBaseInterface } from '@/api/api.js';
import { formRules} from './util';
import { unitArr,frequencySelectList } from '@/utils/defaultOptions';
export default {
	name:'',
	props: {
		isOperation: {
			type: Boolean
		},
		type: {
			type: Number
		},
		operationForm: {
			type: Object,
		}
	},
	computed: {
		// 累计值计算时 均值填充判断标识
		frequencyChangeFlag(){
			return this.tableData[0]?`${this.tableData[0].Frequency}转${this.formData.frequency}`:''
		}
	},
	watch: {
		isOperation(newval) {
			newval && this.getMenu();
			if(newval && this.operationForm.edb_id) {
				const backData = _.cloneDeep(this.operationForm);
				this.select_target = backData.oldedb_id;
				const { 
					edb_id,
					targetName,
					unit,
					menu,
					frequency,
					formula,
					moveType,
					moveUnit,
					moveVal,
					oldedb_id,
					oldEdb_name,
					calendar_type,
					EmptyType
				} = backData;
				this.formData = {
					edb_id,
					targetName,
					unit,
					menu,
					frequency,
					n_num: formula,
					value_type: this.type === 51 ? formula : '期末值',
					moveType,
					moveUnit,
					moveVal,
					calendar_type,
					new_value:'',
					emptyType:EmptyType,
				}
				this.getDataList();

				if(backData.Extra){
					const ExtraObj=JSON.parse(backData.Extra)
					this.formData.new_value=ExtraObj.LastValType==1?'均值填充':''
				}

				//回显时的默认options
				this.searchOptions = [
					{
						EdbInfoId: oldedb_id,
						EdbName: oldEdb_name,
					}
				]
			}

			this.sourceList = [5,61].includes(this.type)
				? [{ label: /* '累计值转月值' */this.$t('Edb.CalculatesAll.to_month'),key: 5 },{ label: /* '累计值转季值' */this.$t('Edb.CalculatesAll.to_quarter'),key: 61 }]
				: [62,63].includes(this.type)
				? [{ label: /* '累计值' */this.$t('Edb.CalculatesAll.cumulate'),key: 62 },{ label: /* '年初至今累计值' */this.$t('Edb.CalculatesAll.cumulate_oneyear'),key: 63 }]
				: []
		},
		frequencyChangeFlag(n){
			const arr=['日度转周度','日度转旬度','周度转旬度']
			if(n&&arr.includes(n)){
				this.hasNewValueOpt=false
				this.formData.new_value=''
			}else{
				this.hasNewValueOpt=true
			}
		}
	},
	computed: {
		tableColums(){
			return [
				{
					label: /* '指标ID' */this.$t('Edb.Detail.e_id'),
					key: 'EdbCode',
				},
				{
					label: /* '指标名称' */this.$t('Edb.Detail.e_name'),
					key: this.$parent.currentLang==='en'?'EdbNameEn':'EdbName',
				},
				{
					label: /* '频度' */ this.$t('Edb.Detail.e_fre'),
					key: 'Frequency',
				},
				{
					label: /* '单位' */this.$t('Edb.Detail.e_unit'),
					key: this.$parent.currentLang==='en'?'UnitEn':'Unit',
				},
				{
					label: /* '起始时间' */this.$t('Edb.Detail.e_start_time'),
					key: 'StartDate',
					minwidthsty: '100px'
				},
				{
					label: /* '更新时间' */this.$t('Edb.Detail.e_update_time'),
					key: 'ModifyTime',
					minwidthsty: '110px'
				},
				{
					label: /* '来源' */this.$t('Edb.Detail.source'),
					key: 'SourceName',
				},
			]
		},
		formRules(){
			return formRules
		},
		unitArr() {
			return unitArr
		},
		titleMap(){//标题
			return new Map([
				[5,this.$t('Edb.CalculatesAll.to_month_quarter')],/* '累计值转月/季值' */
				[6,this.$t('Edb.CalculatesAll.on_year')],/* '同比值' */
				[7,this.$t('Edb.CalculatesAll.differ')],/* '同差值' */
				[8,this.$t('Edb.CalculatesAll.n_move_average')],/* 'N数值移动平均计算' */
				[12,this.$t('Edb.CalculatesAll.n_rate')],/* 'N数值环比值' */
				[13,this.$t('Edb.CalculatesAll.n_differ')],/* 'N数值环差值'  */
				[14,this.$t('Edb.CalculatesAll.up_conver')],/* 升频 */
				[22,this.$t('Edb.CalculatesAll.time_move')],/* '时间移位' */
				[35,this.$t('Edb.CalculatesAll.super_season')],/* '超季节性'  */
				// [40, this.$t('Edb.CalculatesAll.differ')],/* '数据调整' */
				[52,this.$t('Edb.CalculatesAll.annual')],/* '年化'  */
				[51,this.$t('Edb.CalculatesAll.down_conver')],/* '降频' */
				[61,this.$t('Edb.CalculatesAll.to_month_quarter')],/* '累计值转月/季值' */
				[62,this.$t('Edb.CalculatesAll.cumulate')],/* '累计值' */
				[63,this.$t('Edb.CalculatesAll.cumulate')],/* '累计值' */
				[75,this.$t('Edb.CalculatesAll.day_mean')]/* '日均值' */
			])
		},
		saveBtnMap(){//保存文案
			return new Map([
				[5,this.$t('Edb.CalculateBtns.to_month')],/* '转月值计算' */
				[6,this.$t('Edb.CalculateBtns.on_year')],/* '同比值计算' */
				[7,this.$t('Edb.CalculateBtns.differ')],/* '同差值计算' */
				[8,this.$t('Edb.CalculateBtns.n_move_average')],/* '移动平均计算' */
				[12,this.$t('Edb.CalculateBtns.n_rate')],/* '环比值计算' */
				[13,this.$t('Edb.CalculateBtns.n_differ')],/* '环差值计算' */
				[14,this.$t('Edb.CalculateBtns.up_conver')],/* '升频计算' */
				[22,this.$t('Dialog.confirm_save_btn')],/* '保存' */
				[35,this.$t('Edb.CalculateBtns.super_season')],/* '超季节性计算' */
				[52,this.$t('Edb.CalculateBtns.annual')],/* '年化计算' */
				[51,this.$t('Edb.CalculateBtns.down_conver')],/* '降频计算' */
				[61,this.$t('Edb.CalculateBtns.to_quarter')],/* '转季值计算'  */
				[62,this.$t('Edb.CalculateBtns.cumulate')],/* '累计值计算' */
				[63,this.$t('Edb.CalculateBtns.cumulate_oneyear')],/* '年初至今计算' */
				[75,this.$t('Edb.CalculateBtns.day_mean')],/* '日均值计算' */
			])
		},
		frequencyArr(){//频度筛选
			return frequencySelectList(['半年度'])
		},
		fre_options(){//领先频率
			return [
				{label:this.$t('Edb.FreAll.day_min'),value:'天'},
				{label:this.$t('Edb.FreAll.week_min'),value:'周'},
				{label:this.$t('Edb.FreAll.month_min'),value:'月'},
				{label:this.$t('Edb.FreAll.quarter_min'),value:'季'},
				{label:this.$t('Edb.FreAll.year_min'),value:'年'},
			]
		},
		moveTypeOpions(){
			return [
				{
					label: this.$t('ETableChildren.ahead_lable'),
					key: 1
				},
				{
					label: this.$t('ETableChildren.lagging_lable'),
					key: 2
				},
			]
		},
		calendarOptions(){
			return [
				{label: this.$t('Chart.calendar_gre'),key: 1},
				{label: this.$t('Chart.calendar_lunar_text'),key: 2},
			]
		}
	},
	data () {
		return {
			select_target:'',
			searchOptions:[],//指标列表
			haveMore: true,
			dataList:[],
			tableData:[],
			page_no:1,
			formData: {
				targetName:'',
				unit:'',
				menu:'',
				frequency:'',
				n_num: 1,
				moveType: 1,
				moveUnit: '天',
				moveVal: '',
				calendar_type: '公历',
				value_type: '期末值',
				new_value:'',
				emptyType:0,
			},
			options: [],
			levelProps: {
				label: 'ClassifyName',
				value: 'ClassifyId',
				children: 'Children',
				checkStrictly: true
			},
			/* frequencyArr, */
			/* fre_options: ['天','周','月','季','年'], */
			/* moveTypeOpions: [
				{
					label: '领先',
					key: 1
				},
				{
					label: '滞后',
					key: 2
				},
			], */
			loading:false,
			
			search_have_more: false,
			search_page: 1,
			current_search: '',

			/* calendarOptions: [
				{label: '公历',key: 1},
				{label: '农历',key: 2},
			], */

			sourceList: [],

			hasNewValueOpt:true,//最新值处理的选项

		};
	},
	methods: {
		/* 指标列表 */
		getTarget(query) {
			this.search_page = 1;
			this.current_search = query;
			this.searchApi(this.current_search);
		},

		/* 聚焦获取当前检索 */
		inputFocusHandle(e) {
			this.search_page = 1;
			this.current_search = e.target.value;
			this.searchApi(this.current_search);
		},

		searchApi(query,page=1) {

			const filterMap = {
				5: 2,
				14: 3,
				63: 6
			}

			dataBaseInterface.targetSearchByPage({
				KeyWord:query,
				CurrentIndex: page,
				FilterSource: filterMap[this.type] ? filterMap[this.type] : 1,
				Frequency: this.type===61?'季度': ''
			}).then(res => {
				if(res.Ret !== 200) return

				const { List,Paging } = res.Data;
				this.search_have_more = page < Paging.Pages;
				let arr = page === 1 ? List : this.searchOptions.concat(List);

				this.searchOptions = this.operationForm.edb_id ? arr.filter(item => item.EdbInfoId !== this.operationForm.edb_id) : arr;
					
			})
		},

		searchLoad() {
			if(!this.search_have_more) return;
			this.searchApi(this.current_search,++this.search_page)
		},

		/* 获取目录结构 */
		getMenu() {
			dataBaseInterface.menuListV3().then((res) => {
				if (res.Ret === 200) {
					this.filterNodes(res.Data.AllNodes||[]);
					this.options = res.Data.AllNodes || [];
				}
			});
		},
		// 递归改变第三级目录结构
		filterNodes(arr) {
			arr.length &&
				arr.forEach((item) => {
					item.Children.length && this.filterNodes(item.Children);
					if (!item.Children.length) {
						delete item.Children;
					}
				});
		},
		/* 获取指标数据 */
		getDataList() {
			dataBaseInterface.targetList({
				PageSize: 10,
				CurrentIndex: this.page_no,
				EdbInfoId: this.select_target,
			}).then(res => {
				if(res.Ret === 200) {
					if(res.Data) {
						res.Data.Item.ModifyTime = res.Data.Item.ModifyTime.substr(0,10);
						this.tableData = [res.Data.Item] || [];
						this.haveMore =  this.page_no < res.Data.Paging.Pages ? true : false;

						//原指标有权限
						if(res.Data.Item.HaveOperaAuth) {
							this.dataList = this.page_no === 1 ? (res.Data.Item.DataList || []) : this.dataList.concat(res.Data.Item.DataList);
						}else {
							this.dataList = []
						}
					}else {
						this.tableData = [];
						this.dataList = [];
					}
				}
			})
		},
		/* 滚动加载 */
		scrollHandle(e) {
			const dom = e.target
			let scrollTop = dom.scrollTop; //滑入屏幕上方的高度
			let windowHeitht = dom.clientHeight; //页面的高度
			let scrollHeight = dom.scrollHeight; //整个div的高度
			let total = scrollTop + windowHeitht
			if(total >= scrollHeight && this.haveMore){
				this.page_no ++;
				this.getDataList();
			}
		},
		/* 选择指标 */
		chooseTarget(val) {
			if(val) {
				let obj = this.searchOptions.find(item => item.EdbInfoId === val);
				if(obj.Frequency !== '月度' && this.type === 5) {
					this.select_target = '';
					this.$message.warning(/* '只能选择月度指标' */this.$t('ETableChildren.only_select_msg'))
					return;
				}
				//频度 名称默认同步
				this.setDefaultOption(obj);
				this.page_no = 1;
				this.dataList.length ? this.$refs.dataUl.scrollTop = 0 : null;
				this.getDataList()
			}else {
				this.tableData = [];
				this.dataList = [];
			}
		},
		/* 删除已选指标 */
		delTarget() {
			this.tableData = [];
			this.dataList = [];
			this.select_target = '';
			this.page_no = 1;
		},

	  /* 过滤负数 小数点*/
    filterCode(item) {
      item.moveVal=item.moveVal.replace(/[^\.\d]/g,'').replace('.','');
    },

		init() {
			this.page_no = 1;
			this.select_target = '';
			this.searchOptions = [];
			this.tableData = [];
			this.dataList = [];
			this.formData = {
				targetName:'',
				unit:'',
				menu:'',
				frequency:'',
				n_num: 1,
				moveType: 1,
				moveUnit: '天',
				moveVal: '',
				calendar_type: '公历',
				value_type: '期末值',
				new_value:'',
				emptyType:0,
			};
			this.$refs.form.resetFields();
		},
		/* 保存 */
		async saveHandle() {
			if(!this.select_target) this.$message.warning('指标不能为空')
			
				console.log(this.formData)
				await this.$refs.form.validate();
				this.loading = true;

				const valueMap = {
					22: 'moveVal',
					51: 'value_type'
				}

				let params ={
					Source: this.type,
					EdbName: this.formData.targetName,
					Unit: this.formData.unit,
					ClassifyId: Array.isArray(this.formData.menu)?this.formData.menu[this.formData.menu.length - 1]:this.formData.menu,
					Frequency: this.formData.frequency,
					Formula: valueMap[this.type] ? String(this.formData[valueMap[this.type]]) : String(this.formData.n_num),
					FromEdbInfoId: this.select_target,
					MoveFrequency: this.formData.moveUnit,
					MoveType: this.formData.moveType, 
					Calendar: this.formData.calendar_type,
					Extra:JSON.stringify({
						LastValType:this.formData.new_value==='均值填充'?1:0
					}),
					EmptyType:this.formData.emptyType
				}

				const res = this.operationForm.edb_id 
					? await dataBaseInterface.calculateTargetEdit({ ...params,EdbInfoId: this.operationForm.edb_id })
					: await dataBaseInterface.calculateTargetSave(params)
					this.loading = false;
					if (res.Ret !== 200) return
					this.$message.success(res.Msg);

					this.operationForm.edb_id 
						? this.$emit('addCallBack','edit') 
						: this.$emit('addCallBack','add',{ code:res.Data.UniqueCode,id:res.Data.EdbInfoId,classifyId:params.ClassifyId });
					this.init();
		},
		/* 关闭弹窗 */
		cancelHandle(type) {
			this.init()
			this.$emit('cancel');
			type==='cancel' && !this.operationForm.edb_id && this.$emit('openPrev');
		},

		// N数值变化，名称也变化
		NchangeHandle() {
			if(!this.select_target) return;
			let obj = this.searchOptions.find(item => item.EdbInfoId === this.select_target);
			let edbName = this.$parent.currentLang==='en'?obj.EdbNameEn:obj.EdbName;
			const tMap=new Map([
				['日度','D'],
				['周度','W'],
				['旬度','T'],
				['月度','M'],
				['季度','Q'],
				['年度','Y'],
			])
			const name_map = {
				8: `${edbName}/${this.formData.n_num}${tMap.get(obj.Frequency)}MA`,
				12: `${edbName}${this.formData.n_num}${obj.Frequency.slice(0,1)}环比`,
				13: `${edbName}${this.formData.n_num}${obj.Frequency.slice(0,1)}环差`,
				35: `${edbName}超季节性/${this.formData.n_num}年${this.formData.calendar_type==='公历'?'':'/'+this.formData.calendar_type}`
			}
			this.formData.targetName = name_map[this.type] || '';
		},

		// 频度变化 修改指标名
		handleFrequencyChange(){
			if(!this.select_target||this.operationForm.edb_id) return;
			let obj = this.searchOptions.find(item => item.EdbInfoId === this.select_target);
			let edbName = this.$parent.currentLang==='en'?obj.EdbNameEn:obj.EdbName;

			const name_map = {
				51: `${edbName}/${this.formData.frequency.substr(0,1)}频`,
				62:  `${edbName}累计值/${this.formData.frequency}`,
			}
			this.formData.targetName=name_map[this.type] || ''
		},

		// 时间位移-移动方式修改 修改指标名
		refreshTarget(){
			if(this.type==22){
				if(!this.select_target||this.operationForm.edb_id) return;
				let obj = this.searchOptions.find(item => item.EdbInfoId === this.select_target);
				let edbName = this.$parent.currentLang==='en'?obj.EdbNameEn:obj.EdbName;

				this.formData.targetName=`${edbName}${this.moveTypeOpions.filter(item=>item.key===this.formData.moveType)[0].label}${this.formData.moveVal}${this.formData.moveUnit}`
			}
		},

		/* 单位默认同步基础指标
		同比 同差 频度同步 单位无 
		转月 平均值 频度单位同步
				
		同比 同差值：默认名称为指标名称+同比/同差
		n数值环比/环差值计算：默认名称为指标名称+N+频度+环比/环差
		转月 平均计算 变频默认指标名称同步
		2023/2/6 
		N数值移动平均计算:原指标名称/N*MA
		变频:原指标名称/频度+变频
		*/
		setDefaultOption(obj) {
			const tMap=new Map([
				['日度','D'],
				['周度','W'],
				['旬度','T'],
				['月度','M'],
				['季度','Q'],
				['年度','Y'],
			])

			let edbName = this.$parent.currentLang==='en'?obj.EdbNameEn:obj.EdbName;
			let unit = this.$parent.currentLang ==='en'?obj.UnitEn:obj.Unit;
			const name_map = {
				5: `${edbName}转月值`,
				8: `${edbName}/${this.formData.n_num}${tMap.get(obj.Frequency)}MA`,
				14: `${edbName}/日频`,
				6: `${edbName}同比`,
				7: `${edbName}同差`,
				12: `${edbName}${this.formData.n_num}${obj.Frequency.slice(0,1)}环比`,
				13: `${edbName}${this.formData.n_num}${obj.Frequency.slice(0,1)}环差`,
				35: `${edbName}超季节性/${this.formData.n_num}年${this.formData.calendar_type==='公历'?'':'/'+this.formData.calendar_type}`,
				52: `${edbName}年化值`,
				51: `${edbName}/${obj.Frequency.substr(0,1)}频`,
				61:  `${edbName}转季值`,
				62:  `${edbName}累计值/${obj.Frequency}`,
				63:  `${edbName}年初至今累计值`,
				75: `${edbName}日均值`,
				22:	`${edbName}${this.moveTypeOpions.find(item=>item.key===this.formData.moveType)&&this.moveTypeOpions.find(item=>item.key===this.formData.moveType).label}${this.formData.moveVal}${this.formData.moveUnit}`
			}
			
			let frequerncyMap = {
				14: '日度',
				61: '季度',
				62: ''
			}

			this.formData = {
				targetName: name_map[this.type] || '',
				frequency: frequerncyMap[this.type] || obj.Frequency,
				unit: [5,8,14,7,35,75].includes(this.type) ? unit : '无',
				menu: obj.ClassifyId || '',
				n_num: 1,
				moveType: 1,
				moveUnit: '天',
				moveVal: '',
				calendar_type: this.formData.calendar_type,
				value_type: this.formData.value_type,
				new_value:'',
				emptyType:0
			}
		},
        handleSelectBtnClick(){
            //计算指标打开弹窗,基础指标打开新页面
            if(this.tableData[0].EdbType===2){
                this.$emit('lookHistory',this.select_target)
            }else{
                const {ClassifyId,UniqueCode,EdbInfoId} = this.tableData[0]
                let {href} = this.$router.resolve({path:`/database`,query:{code:UniqueCode,id:EdbInfoId,classifyId:ClassifyId}});
                window.open(href,'_blank');
            }
        },
	},
	created() {},
	mounted() {},
}
</script>
<style lang='scss'>
.operation-dialog {
	max-width: 1200px !important;
	position: relative;
	div::-webkit-scrollbar {
		width: 6px !important;
	}
	.el-input-number .el-input__inner {
		padding: 0 34px 0 4px;
	}
	.el-dialog__body {
		max-height: 780px;
		overflow: auto;
	}
	.dialog-main {
		.el-cascader .el-input {
			width: 340px;
		}
		.label-cont {
			display: flex;
			align-items: center;
			margin-bottom: 15px;
			li {
				cursor: pointer;
				font-size: 16px;
				margin-right: 24px;
				&:hover {
					color: #409EFF;
				}
				&.act {
					color: #409EFF;
				}
			}
		}
		.min-top {
			padding: 20px 30px;
			border: 1px solid #ECECEC;
			box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
			border-radius:4px;
		}
		.middle {
			margin-top: 20px;
			.data-ul {
				margin-top: 5px;
				border-bottom: 1px solid #dcdfe6;
				max-height: 140px;
				overflow-y: auto;
				.value-item {
					/* width: 100%; */
					padding: 14px 0;
					border: 1px solid #dcdfe6;
					border-bottom: none;
					display: flex;
					justify-content: space-around;
					.value-label {
						position: relative;
						color: #666;
					}
					.new-tag {
						width: 6px;
						height: 6px;
						display: inline-block;
						position: absolute;
						left: -12px;
						top: 50%;
						transform: translateY(-50%);
						border-radius: 50%;
						background: #f00;
					}
				}
			}
			.form-cont {
				padding-top: 30px;
				margin-top: 30px;
				border-top: 1px dashed #AAB4CC;
				input::-webkit-outer-spin-button,
				input::-webkit-inner-spin-button {
						-webkit-appearance: none;
				}
				input[type="number"]{
					-moz-appearance: textfield;
				}
			}
		}
	}
	.dia-bot {
		padding: 20px 0 30px;
		display: flex;
		justify-content: center;
	}
	.tip-cont {
		padding: 30px;
	}
	.tip-label {
		position: absolute;
		bottom: 30px;
		right: 30px;
		color: #409EFF;
		cursor: pointer;
	}
}
</style>