|
@@ -0,0 +1,441 @@
|
|
|
+<template>
|
|
|
+ <div class="dataEntry-page">
|
|
|
+
|
|
|
+ <header>
|
|
|
+ <div class="left-btn">
|
|
|
+ <el-button type="primary" @click="isShowinsert=true"><!-- 导入数据 -->{{$t('ManualEntryPage.tit_insert_data')}}</el-button>
|
|
|
+ <el-button type="primary"><!-- 批量加入指标库 -->{{$t('ManualEntryPage.batch_addbase')}}</el-button>
|
|
|
+ <el-button type="primary" @click="$router.push({path: '/online_excel' })"><!-- 在线Excel -->{{$t('ManualEntryPage.online_excel')}}</el-button>
|
|
|
+ <el-button type="primary"><!-- 批量删除 -->{{$t('ManualEntryPage.batch_del')}}</el-button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="right-wrap">
|
|
|
+ <el-button type="text"><!-- 导出Excel -->{{$t('ManualEntryPage.tit_export')}}</el-button>
|
|
|
+ <el-select
|
|
|
+ v-model="search_txt"
|
|
|
+ v-loadMore="searchLoad"
|
|
|
+ ref="searchRef"
|
|
|
+ :filterable="!search_txt"
|
|
|
+ remote
|
|
|
+ clearable
|
|
|
+ :placeholder="$t('Edb.InputHolderAll.input_name_orid')"
|
|
|
+ style="width: 260px;"
|
|
|
+ :remote-method="searchHandle"
|
|
|
+ @click.native="inputFocusHandle"
|
|
|
+ >
|
|
|
+ <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.EdbInfoId"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </header>
|
|
|
+ <div class="main">
|
|
|
+
|
|
|
+ <div class="main-left" id="left">
|
|
|
+
|
|
|
+ <div class="left-main">
|
|
|
+ <div class="tree-cont">
|
|
|
+ <el-tree
|
|
|
+ ref="treeRef"
|
|
|
+ class="classify-tree"
|
|
|
+ :data="classifyList"
|
|
|
+ node-key="UniqueCode"
|
|
|
+ :props="defaultProp"
|
|
|
+ :current-node-key="select_node"
|
|
|
+ :default-expanded-keys="defaultShowNodes"
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ check-strictly
|
|
|
+ empty-text="暂无分类"
|
|
|
+ lazy
|
|
|
+ :load="getLazyTreeData"
|
|
|
+ @current-change="nodeChange"
|
|
|
+ >
|
|
|
+ <span class="custom-tree-node" slot-scope="{ node, data }">
|
|
|
+ <span
|
|
|
+ class="text_oneLine node_label"
|
|
|
+ :style="`width:${
|
|
|
+ (select_node === data.UniqueCode && node.Nodewidth) || ''
|
|
|
+ }`"
|
|
|
+ >
|
|
|
+ <span>{{ data.ClassifyName }}</span>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </el-tree>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="main-right" id="right">
|
|
|
+ <!-- 分类 -->
|
|
|
+ <template v-if="!selectedEdb">
|
|
|
+ <div>
|
|
|
+ <h3>共200个指标</h3>
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ style="box-shadow: 0px 3px 6px rgba(155, 170, 219, 0.2);margin-top: 20px"
|
|
|
+ border
|
|
|
+ ref="table"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ v-for="item in tableColums"
|
|
|
+ :key="item.key"
|
|
|
+ :label="item.label"
|
|
|
+ :width="item.widthsty"
|
|
|
+ :min-width="item.minwidthsty"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <span>{{row[item.key]}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('Table.column_operations')"
|
|
|
+ align="center"
|
|
|
+ min-width="200"
|
|
|
+ >
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <div>
|
|
|
+ <span class="editsty" @click="handleEdb({item:row,type:'edit'})">{{$t('Table.edit_btn')}}</span>
|
|
|
+ <span class="editsty" @click="handleEdb({item:row,type:'addToBase'})"><!-- 加入指标库 -->{{$t('ManualEntryPage.add_tobase')}}</span>
|
|
|
+ <span class="editsty" @click="handleEdb({item:row,type:'logs'})"><!-- 操作日志 -->{{$t('ManualEntryPage.opera_logs')}}</span>
|
|
|
+ <span class="deletesty" @click="handleEdb({item:row,type:'del'})">{{$t('Table.delete_btn')}}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <div class="nodata" slot="empty">
|
|
|
+ <tableNoData :text="$t('Table.prompt_slogan')" size="mini"/>
|
|
|
+ </div>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <div style="height:35px;margin: 20px 0;">
|
|
|
+ <m-page
|
|
|
+ :page_no="page_no"
|
|
|
+ :pageSize="pageSize"
|
|
|
+ :total="total"
|
|
|
+ @handleCurrentChange="pageChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <!-- 指标详情 -->
|
|
|
+ <template v-else>
|
|
|
+ <edbDetail
|
|
|
+ :id="selectedEdb"
|
|
|
+ @handle="handleEdb"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <!-- 导入数据弹窗 -->
|
|
|
+ <insert-data
|
|
|
+ :isShowinsert.sync="isShowinsert"
|
|
|
+ @importSuccess="importSuccess"
|
|
|
+ source="dataEntry"
|
|
|
+ />
|
|
|
+
|
|
|
+
|
|
|
+ <!-- 操作日志弹窗 -->
|
|
|
+ <operateLogsDia
|
|
|
+ :isShow.sync="isShowOperaLogs"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import { dataInterence } from '@/api/api.js';
|
|
|
+import mPage from '@/components/mPage.vue';
|
|
|
+import edbDetail from './components/edbDetail.vue'
|
|
|
+import operateLogsDia from './components/operateLogsDia.vue';
|
|
|
+import insertData from '../components/insertData.vue';
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ mPage,
|
|
|
+ edbDetail,
|
|
|
+ operateLogsDia,
|
|
|
+ insertData
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ tableColums() {
|
|
|
+ return [
|
|
|
+ { label: this.$t('Edb.Detail.e_id'),key: 'TradeCode' },
|
|
|
+ { label: this.$t('Edb.Detail.e_name'),key: 'SecName',minwidthsty:'150px' },
|
|
|
+ { label: this.$t('Edb.Detail.e_fre'),key: 'Frequency',widthsty:'100px' },
|
|
|
+ { label: this.$t('Edb.Detail.e_unit'),key: 'Unit', },
|
|
|
+ { label: this.$t('Edb.Detail.e_creator'),key: 'UserName', },
|
|
|
+ { label: this.$t('Edb.Detail.e_update_time'),key: 'ModifyTime', },
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ defaultProp: {
|
|
|
+ label: 'ClassifyName',
|
|
|
+ children: 'Child',
|
|
|
+ isLeaf: 'isLeaf'
|
|
|
+ },
|
|
|
+ classifyList: [],
|
|
|
+
|
|
|
+ tableData: [],
|
|
|
+ pageNo: 1,
|
|
|
+ total: 0,
|
|
|
+ pageSize: 10,
|
|
|
+
|
|
|
+ selectClassifyId: 0,
|
|
|
+ selectNode: '',
|
|
|
+ selectedEdb: 0,
|
|
|
+
|
|
|
+ /* 操作日志弹窗 */
|
|
|
+ isShowOperaLogs: false,
|
|
|
+
|
|
|
+ /* 导入弹窗 */
|
|
|
+ isShowinsert:false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted(){
|
|
|
+ this.getClassify();
|
|
|
+ this.getTableData()
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ // 获取分类
|
|
|
+ getClassify() {
|
|
|
+ dataInterence.getClassifyV2().then(res =>{
|
|
|
+ if(res.Ret === 200 && res.Data.List) {
|
|
|
+ this.classifyList = res.Data.List||[];
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ //加载子指标
|
|
|
+ async getLazyTreeData(node,resolve,maxLevel=2) {
|
|
|
+ if(node.level===0){
|
|
|
+ resolve(this.classifyList)
|
|
|
+ }else if(node.level>0&&node.level<maxLevel){
|
|
|
+ //获取对应层级的Child
|
|
|
+ resolve(node.data.Child||[])
|
|
|
+ }else{
|
|
|
+ let arr=[]
|
|
|
+ const res=await dataInterence.getClassifyLoadChild({
|
|
|
+ ClassifyId: node.data.ClassifyId
|
|
|
+ })
|
|
|
+ if (res.Ret === 200) {
|
|
|
+ const temarr = res.Data.List || [];
|
|
|
+ arr=temarr.map(item=>{
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ isLeaf:item.TradeCode?true:false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ resolve(arr)
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ async getTableData() {
|
|
|
+ const res = await dataInterence.getEdbListV2({
|
|
|
+ ClassifyId: this.selectClassifyId,
|
|
|
+ CurrentIndex: this.pageNo,
|
|
|
+ PageSize: this.pageSize
|
|
|
+ })
|
|
|
+
|
|
|
+ if(res.Ret !==200) return
|
|
|
+ this.tableData = res.Data.List || [];
|
|
|
+ this.total = res.Data.Paging.Totals;
|
|
|
+ },
|
|
|
+
|
|
|
+ pageChange(page) {
|
|
|
+ this.pageNo = page;
|
|
|
+ this.getTableData()
|
|
|
+ },
|
|
|
+
|
|
|
+ //选中节点
|
|
|
+ nodeChange(data,node) {
|
|
|
+ this.selectClassifyId = !data.TradeCode?data.ClassifyId:0;
|
|
|
+ this.selectNode = data.UniqueCode;
|
|
|
+ this.selectedEdb = data.TradeCode;
|
|
|
+
|
|
|
+ if(this.selectClassifyId){
|
|
|
+ this.pageNo = 1;
|
|
|
+ this.getTableData();
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ //导入成功
|
|
|
+ importSuccess() {
|
|
|
+ this.isShowinsert = false;
|
|
|
+ this.getTableList();
|
|
|
+ },
|
|
|
+
|
|
|
+ /* 操作 */
|
|
|
+ handleEdb({item,type}) {
|
|
|
+ const typeMap = {
|
|
|
+ 'edit': this.handleEditEdb,
|
|
|
+ 'addToBase': this.handleAddToBase,
|
|
|
+ 'logs': this.handleOperaLogs,
|
|
|
+ 'del': this.handleDelEdb
|
|
|
+ }
|
|
|
+
|
|
|
+ typeMap[type]&&typeMap[type](item)
|
|
|
+ },
|
|
|
+
|
|
|
+ handleEditEdb(item) {
|
|
|
+ this.$router.push({
|
|
|
+ path: '/dataEdit',
|
|
|
+ query: {
|
|
|
+ id: item.TradeCode
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+
|
|
|
+ /* 加入指标库 */
|
|
|
+ handleAddToBase() {
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ // 查看操作日志
|
|
|
+ handleOperaLogs(item){
|
|
|
+ // this.operteId
|
|
|
+ this.isShowOperaLogs = true;
|
|
|
+ },
|
|
|
+
|
|
|
+ /* 删除指标 */
|
|
|
+ handleDelEdb(item) {
|
|
|
+ // 删除前检测指标下是否有录入数据
|
|
|
+ dataInterence.checkTarget({
|
|
|
+ TradeCode:item.TradeCode
|
|
|
+ }).then(res => {
|
|
|
+ if(res.Data.Status===1){
|
|
|
+ this.$message.error(/* "该指标已加入指标库,不可删除" */ this.$t('ManualEdbListPage.edb_not_allow_delete'))
|
|
|
+ return
|
|
|
+ }else{
|
|
|
+ this.$confirm(
|
|
|
+ res.Data.Status===0 ? this.$t('ManualEdbListPage.del_edb_msg') : this.$t('ManualEdbListPage.del_edb_rela_msg'),
|
|
|
+ this.$t('Dialog.warn_tit'),{
|
|
|
+ type:'warning'
|
|
|
+ }).then(() => {
|
|
|
+ dataInterence.delTarget({
|
|
|
+ TradeCode:item.TradeCode
|
|
|
+ }).then(res =>{
|
|
|
+ if( res.Ret !== 200 ) return
|
|
|
+ this.$message.success(/* '删除成功!' */this.$t('MsgPrompt.delete_msg'));
|
|
|
+ this.getTableData();
|
|
|
+ });
|
|
|
+ }).catch(() => {});
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style scoped lang='scss'>
|
|
|
+.dataEntry-page {
|
|
|
+ *{box-sizing: border-box;}
|
|
|
+ header,.main-left,.main-right {
|
|
|
+ padding: 20px;
|
|
|
+ background: #fff;
|
|
|
+ border: 1px solid #C8CDD9;
|
|
|
+ border-radius: 4px;
|
|
|
+ }
|
|
|
+ header {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .main {
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .main-left {
|
|
|
+ width: 300px;
|
|
|
+ flex-shrink: 0;
|
|
|
+ margin-right: 30px;
|
|
|
+ .tree-cont {
|
|
|
+ height: calc(100vh - 260px);
|
|
|
+ overflow: auto;
|
|
|
+ }
|
|
|
+ .classify-tree {
|
|
|
+ color: #333;
|
|
|
+ overflow: hidden;
|
|
|
+ .custom-tree-node {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ display: block;
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .main-right {
|
|
|
+ flex: 1;
|
|
|
+ height: calc(100vh - 220px);
|
|
|
+ overflow: auto;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style lang="scss">
|
|
|
+ .dataEntry-page {
|
|
|
+ .classify-tree {
|
|
|
+ .el-tree__drop-indicator {
|
|
|
+ height: 3px;
|
|
|
+ background-color: #409eff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tree-node__content {
|
|
|
+ margin-bottom: 14px !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tree-node__children {
|
|
|
+ .el-tree-node {
|
|
|
+ margin-bottom: 0px !important;
|
|
|
+ padding-left: 18px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tree-node__content {
|
|
|
+ margin-bottom: 5px !important;
|
|
|
+ padding-left: 0 !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .expanded.el-icon-caret-right:before {
|
|
|
+ content: url('~@/assets/img/set_m/down.png') !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-icon-caret-right:before {
|
|
|
+ content: url('~@/assets/img/set_m/slide.png') !important;
|
|
|
+ }
|
|
|
+ .el-tree-node__expand-icon{
|
|
|
+ padding-top: 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tree-node__expand-icon.is-leaf.el-icon-caret-right:before {
|
|
|
+ content: '' !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tree-node__expand-icon.expanded {
|
|
|
+ -webkit-transform: rotate(0deg);
|
|
|
+ transform: rotate(0deg);
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tree-node.is-current>.el-tree-node__content {
|
|
|
+ background-color: #f0f4ff !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-tree-node__content {
|
|
|
+ padding-right: 10px !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+}
|
|
|
+</style>
|