900字范文 > vue 获取光标位置

vue 获取光标位置

时间：2018-07-12 19:27:23

相关推荐

vue 获取光标位置

新建组件configFormulaSalary

<template><div><el-dialog title="公式配置":visible="isConfigFormula" top="15vh"width="1200px" custom-class="config-dialog":before-close="onClose"append-to-body:close-on-click-modal="false"@mousedown.native="handleDialogMousedown($event)"@mouseup.native="handleDialogMouseup($event)"><div class="form-main"><div class="left-cont"><div class="left-title">{{info? info.name : ''}}=</div><div class="input-box"><el-input type="textarea" v-model="formulaValue"autofocus="autofocus" @keyup.enter.native="searchHandle"ref="configInput" id="configInput"placeholder="请输入计算公式或选择函数" @focus="getCursor"></el-input></div><div class="formula-btn"><div class="formula-left"><el-button class="btn-experience" @click="onCheckItemFormula">公式校验</el-button><span class="margin-l-20 tips-box" v-if="msgSuccessTips"><i class="el-icon-circle-check"></i>{{msgSuccessTips}}</span><span class="margin-l-20 tips-box err" v-if="msgErrorTips"><i class="el-icon-circle-close"></i>{{msgErrorTips}}</span></div><div class="right-form-btn"><el-select v-model="formulaRule" placeholder="请选择" class="config-select-btn"><el-optionv-for="item in formulaRuleList":key="item.value":label="item.label":value="item.value"></el-option></el-select><span class="label-text">保留</span><el-select v-model="decimalPoint" placeholder="请选择" class="select-right"><el-optionv-for="item in decimalPointList":key="item":label="item":value="item"></el-option></el-select><span class="label-text">位小数</span></div></div><div class="formula-item"><span class="item-title">快捷运算符</span><span class="formula-label" v-for="(unit,indexU) in formulaTypeList":key="indexU" @click="onSelectOperator(unit.value)">{{unit.label}}</span></div><div class="bottom-drap"><div class="drap-title">点击选择薪资字段</div><div class="drap-list"><div class="list" v-for="(drap,indexD) in drapList" :key="indexD"><div class="item" @click="onSelect(drap,'#')" v-if="info.name !==drap">{{drap}}</div></div></div></div></div><div class="right-cont" @mouseleave="onLeave"><div class="title-bar">插入函数</div><div class="right-box"><div class="box-title-bar">常用函数</div><ul class="box-item-list" ><li class="item-cont" v-for="(formula,indexV) in mon":key="indexV" @mouseenter="onEnterFormulaData(indexV,formula,1)":class="isSelectIndex1 == indexV?'is-active':''"@click="onSelect(formula.grammar)"><span>{{formula.title}}</span><el-button type="text">插入</el-button></li></ul><div class="box-title-bar">系统函数</div><ul class="box-item-list"><li class="item-cont" v-for="(formula,indexV) in formulaData.system":key="indexV" @mouseenter="onEnterFormulaData(indexV,formula,2)" :class="isSelectIndex2 == indexV?'is-active':''"@click="onSelect(formula.grammar)"><span>{{formula.title}}</span><el-button type="text">插入</el-button></li></ul></div><div class="right-item-por" v-show="selectClass"><div class="title">{{selectFunObj.title}}</div><p v-html="selectFunObj.describe"></p></div></div></div><span slot="footer" class="dialog-footer"><el-button @click="onClose">取消</el-button><el-button type="primary" @click="onSubmit('ruleForm')">确定</el-button></span></el-dialog></div></template>

在父组件中引入configFormulaSalary

<configFormulaSalary :isConfigFormula="isConfigFormula" :drapList="drapList" :info="formulaSalaryInfo"@onClose="onConfigFormulaClose" @onSubmitEdit="onConfigFormulaGroup" v-if="isConfigFormula":fieldGroupList="fieldGroupList"></configFormulaSalary><script>import configFormulaSalary from './components/configFormulaSalary.vue'export default {name: 'App',components: {HelloWorld,configFormulaSalary},data () {return {isConfigFormula:false,classmodel: false,drapList:[],formulaSalaryInfo:{},fieldGroupList: []}},methods: {// 关闭配置弹框onConfigFormulaClose(){this.isConfigFormula = false},// 打开配置弹框onConfigFormulaGroup(e){this.isConfigFormula = true},}}</script>

本内容不代表本网观点和政治立场，如有侵犯你的权益请联系我们处理。

网友评论

网友评论仅供其表达个人看法，并不表明网站立场。