|
|
@@ -8,16 +8,6 @@
|
|
|
>
|
|
|
<i class="el-icon-d-arrow-right"></i>
|
|
|
</span>
|
|
|
- <div class="chartSetting-label-list">
|
|
|
- <edb-label-list
|
|
|
- :currentLang="currentLang"
|
|
|
- :labelList="labelList"
|
|
|
- :activeLabelId="select_node"
|
|
|
- @clickLabel="changeCurrentLabel"
|
|
|
- @deleteLabel="deleteLabel"
|
|
|
- @moveLabel="({oldIndex,newIndex})=>{labelList[oldIndex] = labelList.splice(newIndex, 1, labelList[oldIndex])[0];}"
|
|
|
- />
|
|
|
- </div>
|
|
|
<div class="chartSetting-main">
|
|
|
<div class="main-left left" id="left" v-show="!isSlideLeft">
|
|
|
|
|
|
@@ -31,7 +21,17 @@
|
|
|
|
|
|
<div class="left-main">
|
|
|
<div class="chartSetting_main_top">
|
|
|
+ <el-radio-group
|
|
|
+ v-model="classifyShowType"
|
|
|
+ @input="handleChangeClassifyType"
|
|
|
+ >
|
|
|
+ <el-radio-button :label="item.key" v-for="item in classifyTabs" :key="item.key">
|
|
|
+ {{item.label}}
|
|
|
+ </el-radio-button>
|
|
|
+ </el-radio-group>
|
|
|
+
|
|
|
<el-select
|
|
|
+ v-if="classifyShowType!=='shared'"
|
|
|
v-model="search_txt"
|
|
|
v-loadMore="searchLoad"
|
|
|
:filterable="!search_txt"
|
|
|
@@ -62,108 +62,173 @@
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
- <div class="tree-cont">
|
|
|
- <el-tree
|
|
|
- ref="treeRef"
|
|
|
- class="target_tree"
|
|
|
- :data="treeData"
|
|
|
- node-key="UniqueCode"
|
|
|
- :props="defaultProp"
|
|
|
- :allow-drag="canDragHandle"
|
|
|
- :allow-drop="canDropHandle"
|
|
|
- :current-node-key="select_node"
|
|
|
- :default-expanded-keys="defaultShowNodes"
|
|
|
- draggable
|
|
|
- :expand-on-click-node="false"
|
|
|
- check-strictly
|
|
|
- :empty-text="$t('Common.no_classify_msg')"
|
|
|
- lazy
|
|
|
- :load="getLazyTreeData"
|
|
|
- @node-expand="handleNodeExpand"
|
|
|
- @node-collapse="handleNodeCollapse"
|
|
|
- @current-change="nodeChange"
|
|
|
- @node-drop="dropOverHandle"
|
|
|
- @node-drag-end="dropMouseLeave"
|
|
|
- @node-drag-leave="dropMouseLeave"
|
|
|
- @node-drag-enter="dropMouseOver"
|
|
|
- >
|
|
|
- <span class="custom-tree-node" slot-scope="{ node, data }">
|
|
|
- <el-input
|
|
|
- ref="editVal"
|
|
|
- style="width: 90px"
|
|
|
- placeholder="请输入值"
|
|
|
- class="label-input"
|
|
|
- v-model="new_label"
|
|
|
- v-if="data.isEdit&&permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_add')"
|
|
|
- @blur="changeValue(node, data)"
|
|
|
- />
|
|
|
- <span
|
|
|
- @dblclick.stop="editNodeLabel(node, data)"
|
|
|
- v-else
|
|
|
- class="text_oneLine node_label"
|
|
|
- :style="`width:${select_node === data.UniqueCode?'60%':'auto'}`"
|
|
|
- :id="`node${data.UniqueCode}`"
|
|
|
- >
|
|
|
- <img
|
|
|
- :src="$icons.lock_ico2"
|
|
|
- width="18"
|
|
|
- height="18"
|
|
|
- style="vertical-align:middle"
|
|
|
- v-if="!data.HaveOperaAuth&&data.ChartInfoId"
|
|
|
- />
|
|
|
- <span>{{ currentLang==='en' ? (data.ChartClassifyNameEn||data.ChartClassifyName) : data.ChartClassifyName }}</span>
|
|
|
- </span>
|
|
|
- <span
|
|
|
- style="display: flex; align-items: center"
|
|
|
- v-if="select_node === data.UniqueCode"
|
|
|
+
|
|
|
+ <!-- 公共目录，我的目录 -->
|
|
|
+ <div
|
|
|
+ class="tree-cont"
|
|
|
+ v-if="['public','own'].includes(classifyShowType)"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ class="own-tree"
|
|
|
+ :style="`height:${classifyShowType==='own'?'60%':'100%'}`
|
|
|
+ ">
|
|
|
+ <!-- <div class="tree-title">目录</div> -->
|
|
|
+ <div class="tree-wrapper">
|
|
|
+ <el-tree
|
|
|
+ ref="treeRef"
|
|
|
+ class="target_tree"
|
|
|
+ :data="treeData"
|
|
|
+ node-key="UniqueCode"
|
|
|
+ :props="defaultProp"
|
|
|
+ :allow-drag="canDragHandle"
|
|
|
+ :allow-drop="canDropHandle"
|
|
|
+ :current-node-key="select_node"
|
|
|
+ :default-expanded-keys="defaultShowNodes"
|
|
|
+ draggable
|
|
|
+ :expand-on-click-node="false"
|
|
|
+ check-strictly
|
|
|
+ :empty-text="$t('Common.no_classify_msg')"
|
|
|
+ lazy
|
|
|
+ :load="getLazyTreeData"
|
|
|
+ @node-expand="handleNodeExpand"
|
|
|
+ @node-collapse="handleNodeCollapse"
|
|
|
+ @current-change="nodeChange"
|
|
|
+ @node-drop="dropOverHandle"
|
|
|
+ @node-drag-end="dropMouseLeave"
|
|
|
+ @node-drag-leave="dropMouseLeave"
|
|
|
+ @node-drag-enter="dropMouseOver"
|
|
|
+ >
|
|
|
+ <span class="custom-tree-node" slot-scope="{ node, data }">
|
|
|
+ <span
|
|
|
+ class="text_oneLine node_label"
|
|
|
+ :style="`width:${select_node === data.UniqueCode?'60%':'auto'}`"
|
|
|
+ :id="`node${data.UniqueCode}`"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ :src="$icons.lock_ico2"
|
|
|
+ width="18"
|
|
|
+ height="18"
|
|
|
+ style="vertical-align:middle"
|
|
|
+ v-if="!data.HaveOperaAuth&&data.ChartInfoId"
|
|
|
+ />
|
|
|
+ <span>{{ currentLang==='en' ? (data.ChartClassifyNameEn||data.ChartClassifyName) : data.ChartClassifyName }}</span>
|
|
|
+ </span>
|
|
|
+ <span
|
|
|
+ style="display: flex; align-items: center"
|
|
|
+ v-if="select_node === data.UniqueCode"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/data_m/move_ico.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 14px; height: 14px; margin-right: 8px"
|
|
|
+ v-if="data.Button.MoveButton"
|
|
|
+ />
|
|
|
+ <!-- 添加子项 -->
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/set_m/add.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 14px; height: 14px; margin-right: 8px"
|
|
|
+ @click.stop="addNode(node, data)"
|
|
|
+ v-if="data.Button.AddButton&&permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_add')"
|
|
|
+ />
|
|
|
+ <!-- 编辑子项 -->
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/set_m/edit.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 15px; height: 14px; margin-right: 8px"
|
|
|
+ @click.stop="editNode(node, data)"
|
|
|
+ v-if="data.Button.OpButton&&permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_add')"
|
|
|
+ />
|
|
|
+ <!-- 删除子项 -->
|
|
|
+ <img
|
|
|
+ slot="reference"
|
|
|
+ src="~@/assets/img/set_m/del.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 14px; height: 14px"
|
|
|
+ @click.stop="removeNode(node, data)"
|
|
|
+ v-if="data.Button.DeleteButton&&permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_delete')"
|
|
|
+ />
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+ </el-tree>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="opt-wrapper">
|
|
|
+ <!-- 新增分类 -->
|
|
|
+ <div
|
|
|
+ class="opt-item"
|
|
|
+ @click="addLevelOneHandle"
|
|
|
+ v-if="CanOpClassify&&permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_add')"
|
|
|
>
|
|
|
- <img
|
|
|
- src="~@/assets/img/data_m/move_ico.png"
|
|
|
- alt=""
|
|
|
- style="width: 14px; height: 14px; margin-right: 8px"
|
|
|
- v-if="data.Button.MoveButton"
|
|
|
- />
|
|
|
- <!-- 添加子项 -->
|
|
|
- <img
|
|
|
- src="~@/assets/img/set_m/add.png"
|
|
|
- alt=""
|
|
|
- style="width: 14px; height: 14px; margin-right: 8px"
|
|
|
- @click.stop="addNode(node, data)"
|
|
|
- v-if="data.Button.AddButton&&permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_add')"
|
|
|
- />
|
|
|
- <!-- 编辑子项 -->
|
|
|
- <img
|
|
|
- src="~@/assets/img/set_m/edit.png"
|
|
|
- alt=""
|
|
|
- style="width: 15px; height: 14px; margin-right: 8px"
|
|
|
- @click.stop="editNode(node, data)"
|
|
|
- v-if="data.Button.OpButton&&permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_add')"
|
|
|
- />
|
|
|
- <!-- 删除子项 -->
|
|
|
- <img
|
|
|
- slot="reference"
|
|
|
- src="~@/assets/img/set_m/del.png"
|
|
|
- alt=""
|
|
|
- style="width: 14px; height: 14px"
|
|
|
- @click.stop="removeNode(node, data)"
|
|
|
- v-if="data.Button.DeleteButton&&permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_delete')"
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/set_m/add_ico.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 16px; height: 16px; margin-right: 5px"
|
|
|
+ />
|
|
|
+ <span>添加图表分类</span>
|
|
|
+ </div>
|
|
|
+ <!-- 移动图表 -->
|
|
|
+ <div class="opt-item">
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/set_m/move_batch_ico.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 16px; height: 16px; margin-right: 5px"
|
|
|
+ />
|
|
|
+ <span>批量移动图表</span>
|
|
|
+ </div>
|
|
|
+ <template v-if="classifyShowType==='own'">
|
|
|
+ <!-- 共享图表 -->
|
|
|
+ <div class="opt-item" @click="handleOpenSetShared('shared')">
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/set_m/shared_ico.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 16px; height: 16px; margin-right: 5px"
|
|
|
+ />
|
|
|
+ <span>设置图表共享</span>
|
|
|
+ </div>
|
|
|
+ <!-- 公开图表 -->
|
|
|
+ <div class="opt-item" @click="handleOpenSetShared('public')">
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/set_m/public_ico.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 16px; height: 16px; margin-right: 5px"
|
|
|
+ />
|
|
|
+ <span>设置图表公开</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 收藏目录 拼接我的指标tab-->
|
|
|
+ <div class="collect-tree" v-if="classifyShowType==='own'">
|
|
|
+ <div class="tree-title">收藏图表</div>
|
|
|
+ <div class="tree-wrapper">
|
|
|
+ <collectEdbMenu
|
|
|
+ :data="collectClassifys"
|
|
|
+ @change="getCollectClassifys"
|
|
|
+ ref="collectEdbMenuRef"
|
|
|
/>
|
|
|
- </span>
|
|
|
- </span>
|
|
|
- </el-tree>
|
|
|
- <div
|
|
|
- class="noDepart"
|
|
|
- @click="addLevelOneHandle"
|
|
|
- v-if="CanOpClassify&&permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_add')"
|
|
|
- >
|
|
|
- <img
|
|
|
- src="~@/assets/img/set_m/add_ico.png"
|
|
|
- alt=""
|
|
|
- style="width: 16px; height: 16px; margin-right: 10px"
|
|
|
- />
|
|
|
- <span><!-- 添加图表分类 -->{{$t('EtaChartPage.add_classify_btn')}}</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="opt-wrapper">
|
|
|
+ <div class="opt-item" @click="handleOpenCollectClassify">
|
|
|
+ <img
|
|
|
+ src="~@/assets/img/set_m/add_ico.png"
|
|
|
+ alt=""
|
|
|
+ style="width: 16px; height: 16px; margin-right: 5px"
|
|
|
+ />
|
|
|
+ <span>新增收藏分类</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
+ <!-- 共享指标目录 -->
|
|
|
+ <div class="tree-cont"
|
|
|
+ v-else-if="classifyShowType==='shared'"
|
|
|
+ >
|
|
|
+ <sharedMenu/>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
<span
|
|
|
@@ -175,6 +240,7 @@
|
|
|
<i class="el-icon-d-arrow-left"></i>
|
|
|
</span>
|
|
|
</div>
|
|
|
+
|
|
|
<div
|
|
|
class="main-right right"
|
|
|
id="right"
|
|
|
@@ -399,17 +465,7 @@
|
|
|
<i class="el-icon-share"/> <!-- 分享 -->
|
|
|
{{$t('Chart.chart_share_btn')}}
|
|
|
</li>
|
|
|
- <li
|
|
|
- v-permission="permissionBtn.chartLibPermission.chartLib_addMy"
|
|
|
- class="span-item"
|
|
|
- @click="addMychartHandle(chartInfo)"
|
|
|
- >
|
|
|
- <img
|
|
|
- :src="$icons.chart_join_ico"
|
|
|
- alt=""
|
|
|
- style="width: 13px; height: 12px; vertical-align: middle"
|
|
|
- /><!-- 加入我的图库 -->{{$t('Chart.chart_addmy_btn')}}
|
|
|
- </li>
|
|
|
+
|
|
|
<li
|
|
|
v-permission="permissionBtn.chartLibPermission.chartLib_refresh"
|
|
|
class="span-item"
|
|
|
@@ -594,18 +650,6 @@
|
|
|
:style="{background: `no-repeat top/cover url('${!chart.HaveOperaAuth ? $icons.lock_big : chart.ChartImage}')`}"></div>
|
|
|
<div class="chart-item-bottom">
|
|
|
<span><!-- 创建时间 -->{{$t('Chart.list_chart_time')}}: {{ chart.CreateTime.slice(0,10) }}</span>
|
|
|
- <span v-permission="permissionBtn.chartLibPermission.chartLib_addMy"
|
|
|
- class="join_txt"
|
|
|
- @click="addMychartHandle(chart)"
|
|
|
- v-if="chart.HaveOperaAuth"
|
|
|
- >
|
|
|
- <img
|
|
|
- :src="$icons.chart_join_ico"
|
|
|
- alt=""
|
|
|
- style="width: 13px; height: 12px; vertical-align: middle"
|
|
|
- />
|
|
|
- <!-- 加入我的图库 -->{{$t('Chart.chart_addmy_btn')}}
|
|
|
- </span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -696,6 +740,31 @@
|
|
|
>{{ $t('Dialog.confirm_btn')}}</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
+
|
|
|
+
|
|
|
+ <!-- 图表收藏弹窗 -->
|
|
|
+ <edbCollectDia
|
|
|
+ ref="edbCollectRef"
|
|
|
+ :show.sync="isOpenEdbCollectDia"
|
|
|
+ :edbId="collectEdbForm.edbId"
|
|
|
+ :add_ids="collectEdbForm.collectClassifyIdList"
|
|
|
+ @success="arr=>{chartInfo.CollectClassifyIdList = arr}"
|
|
|
+ />
|
|
|
+
|
|
|
+ <!-- 添加收藏分类弹窗 -->
|
|
|
+ <addCollectClassifyDia
|
|
|
+ :show.sync="isOpenCollectClassifyDia"
|
|
|
+ :form="collectClassifyForm"
|
|
|
+ @confirm="getTreeData();isOpenEdbCollectDia&&$refs.edbCollectRef.getClassify()"
|
|
|
+ />
|
|
|
+
|
|
|
+ <!-- 设置公开共享列表弹窗 -->
|
|
|
+ <setSharedListDialog
|
|
|
+ :show.sync="isOpenSetSharedDia"
|
|
|
+ :type="sharedType"
|
|
|
+ source="chart"
|
|
|
+ @change="getTreeData"
|
|
|
+ />
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -704,7 +773,8 @@ import { dataBaseInterface, mychartInterface } from '@/api/api.js';
|
|
|
import {
|
|
|
copyOtherOptions
|
|
|
} from '@/utils/defaultOptions';
|
|
|
-import { chartSetMixin } from './mixins/chartPublic'
|
|
|
+import { chartSetMixin } from './mixins/chartPublic';
|
|
|
+import { edbCollectInterface } from '@/api/modules/chartApi';
|
|
|
import mPage from '@/components/mPage';
|
|
|
import Chart from './components/chart';
|
|
|
import chartDialog from './components/chartDialog';
|
|
|
@@ -713,8 +783,12 @@ import addMyClassifyDia from './components/addMyClassifyDia';
|
|
|
import SaveChartOther from './components/SaveChartOther';
|
|
|
import changeLang from "./components/changeLang.vue"
|
|
|
import setEnNameDia from "./components/setEnNameDia.vue"
|
|
|
-import EdbLabelList from '../../components/edbLabelList.vue';
|
|
|
import setLangInfoDia from './components/setLangInfo.vue'
|
|
|
+import collectEdbMenu from './databaseComponents/collectEdbMenu.vue';
|
|
|
+import edbCollectDia from './databaseComponents/edbCollectDia.vue';
|
|
|
+import addCollectClassifyDia from './databaseComponents/addCollectClassifyDia.vue';
|
|
|
+import sharedMenu from './sharedComponents/sharedMenu.vue';
|
|
|
+import setSharedListDialog from './sharedComponents/setSharedListDialog.vue';
|
|
|
export default {
|
|
|
name: '',
|
|
|
components: {
|
|
|
@@ -726,8 +800,12 @@ export default {
|
|
|
SaveChartOther,
|
|
|
changeLang,
|
|
|
setEnNameDia,
|
|
|
- EdbLabelList,
|
|
|
- setLangInfoDia
|
|
|
+ setLangInfoDia,
|
|
|
+ collectEdbMenu,
|
|
|
+ sharedMenu,
|
|
|
+ setSharedListDialog,
|
|
|
+ edbCollectDia,
|
|
|
+ addCollectClassifyDia
|
|
|
},
|
|
|
directives: {
|
|
|
drag(el, bindings) {
|
|
|
@@ -744,7 +822,7 @@ export default {
|
|
|
var end = e.clientX;
|
|
|
var newWidth = end - init + initWidth;
|
|
|
left.style.width = newWidth + 'px';
|
|
|
- right.style.width = newWidth > 300 ? total_wid - newWidth + 'px' : total_wid - 320 + 'px';
|
|
|
+ right.style.width = newWidth > 350 ? total_wid - newWidth + 'px' : total_wid - 350 + 'px';
|
|
|
};
|
|
|
document.onmouseup = function () {
|
|
|
document.onmousemove = document.onmouseup = null;
|
|
|
@@ -783,7 +861,6 @@ export default {
|
|
|
dialogForm: {
|
|
|
level: '',
|
|
|
},
|
|
|
- drawImg: '',
|
|
|
dynamicWidth: '',
|
|
|
|
|
|
/* 季节性图 */
|
|
|
@@ -793,7 +870,6 @@ export default {
|
|
|
isSlideLeft: false,
|
|
|
dynamicNode: null, //当前选中的node对象 用于拖动宽度时动态改变label宽度
|
|
|
/* 公共图库列表展示 */
|
|
|
- isShowPublicChart: false,
|
|
|
publicHaveMove: true, // 是否还有下一页
|
|
|
default_classify: '',
|
|
|
public_page_no: 1,
|
|
|
@@ -823,6 +899,27 @@ export default {
|
|
|
|
|
|
showUploadToForum:false,//显示上传至社区弹窗
|
|
|
uploadToForumIntro:'',//上传至社区简述
|
|
|
+
|
|
|
+
|
|
|
+ /* 目录分类 */
|
|
|
+ classifyTabs: [
|
|
|
+ { label: '我的图表',key: 'own' },
|
|
|
+ { label: '共享图表',key: 'shared' },
|
|
|
+ { label: '公共图表',key: 'public' },
|
|
|
+ ],
|
|
|
+ classifyShowType:'own',
|
|
|
+
|
|
|
+ collectClassifys:[],//收藏目录
|
|
|
+ //指标收藏弹窗
|
|
|
+ isOpenEdbCollectDia: false,
|
|
|
+ collectEdbForm: {},
|
|
|
+ //收藏分类弹窗
|
|
|
+ isOpenCollectClassifyDia: false,
|
|
|
+ collectClassifyForm: {},
|
|
|
+
|
|
|
+ /* 设置共享弹窗 */
|
|
|
+ isOpenSetSharedDia: false,
|
|
|
+ sharedType:'',//shared/public
|
|
|
};
|
|
|
},
|
|
|
watch: {
|
|
|
@@ -1026,35 +1123,6 @@ export default {
|
|
|
this.default_classify = !data.ChartInfoId ? data.ChartClassifyId : '';
|
|
|
},
|
|
|
|
|
|
- /* 双击label出现input修改框 */
|
|
|
- editNodeLabel(node, data) {
|
|
|
- //目录名称可以双击修改 指标不能
|
|
|
- if (!data.ChartInfoId && data.Button.OpButton&&this.permissionBtn.isShowBtn('chartLibPermission','chartLib_classifyOpt_add')) {
|
|
|
- this.$set(data, 'isEdit', true);
|
|
|
- this.new_label = this.currentLang==='en'?data.ChartClassifyNameEn:data.ChartClassifyName;
|
|
|
- this.$nextTick(() => {
|
|
|
- this.$refs.editVal.focus();
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- /* input失去焦点恢复node 修改最新的值*/
|
|
|
- changeValue(node, data) {
|
|
|
- if (this.new_label) {
|
|
|
- this.$set(data, 'isEdit', false);
|
|
|
- dataBaseInterface
|
|
|
- .editChartClassify({
|
|
|
- ChartClassifyId: data.ChartClassifyId,
|
|
|
- ChartClassifyName: this.new_label,
|
|
|
- })
|
|
|
- .then((res) => {
|
|
|
- if (res.Ret === 200) {
|
|
|
- this.getTreeData();
|
|
|
- }
|
|
|
- });
|
|
|
- } else {
|
|
|
- this.$message.warning('名称不能为空');
|
|
|
- }
|
|
|
- },
|
|
|
// 只看我的 复选框改变事件
|
|
|
onlyMeHandler(){
|
|
|
this.getTreeData();
|
|
|
@@ -1175,7 +1243,6 @@ export default {
|
|
|
.then((res) => {
|
|
|
if (res.Ret === 200) {
|
|
|
this.$message.success(res.Msg);
|
|
|
- const label = this.labelList.find(i=>i.id===ChartInfoId)
|
|
|
if (!res.Data.ChartInfoId) this.selected_chartid = '';
|
|
|
if(type && res.Data.ChartInfoId){
|
|
|
this.getTreeData({
|
|
|
@@ -1183,10 +1250,8 @@ export default {
|
|
|
id: res.Data.ChartInfoId,
|
|
|
type: res.Data.ChartType,
|
|
|
})
|
|
|
- label&&this.deleteLabel(label,'chart')
|
|
|
}else{
|
|
|
this.getTreeData();
|
|
|
- label&&this.deleteLabel(label)
|
|
|
}
|
|
|
//如果router.query里的图表被删除,则清掉参数
|
|
|
if(Number(this.$route.query.id)===ChartInfoId){
|
|
|
@@ -1430,7 +1495,7 @@ export default {
|
|
|
}else{
|
|
|
resolve([])
|
|
|
}
|
|
|
- this.changeTreeNode()
|
|
|
+ this.changeTreeNode()
|
|
|
})
|
|
|
}
|
|
|
if(node.level>2){
|
|
|
@@ -1479,7 +1544,6 @@ export default {
|
|
|
})
|
|
|
if(res.Ret===406){
|
|
|
this.$message.warning(res.Msg)
|
|
|
- this.deleteLabel({code:this.select_node})
|
|
|
return
|
|
|
}
|
|
|
if (res.Ret !== 200) return;
|
|
|
@@ -1493,8 +1557,7 @@ export default {
|
|
|
this.tableData = res.Data.EdbInfoList;
|
|
|
|
|
|
// //将指标添加进标签列表中
|
|
|
- const {ChartNameEn,ChartName,ChartInfoId,UniqueCode,ChartClassifyId}=res.Data.ChartInfo
|
|
|
- this.addLabel({code:UniqueCode,id:ChartInfoId,classifyId:ChartClassifyId,EdbName:ChartName,EdbNameEn:ChartNameEn,chartData:res.Data.ChartInfo})
|
|
|
+ const {ChartNameEn,ChartName,ChartInfoId,UniqueCode,ChartClassifyId}=res.Data.ChartInfo;
|
|
|
this.defaultShowNodes=this.findParentNodeHandle(this.treeData,ChartClassifyId).reverse();
|
|
|
this.changeTreeNode()
|
|
|
|
|
|
@@ -2209,11 +2272,10 @@ export default {
|
|
|
PageSize: this.public_page_size,
|
|
|
CurrentIndex: this.public_page_no,
|
|
|
ChartClassifyId: this.default_classify || 0,
|
|
|
- IsShowMe:this.isOnlyMe || false
|
|
|
+ IsShowMe:this.isOnlyMe
|
|
|
})
|
|
|
.then((res) => {
|
|
|
if (res.Ret !== 200) return;
|
|
|
- // this.isShowPublicChart = res.Data ? true : false;
|
|
|
this.publicHaveMove = res.Data
|
|
|
? this.public_page_no < res.Data.Paging.Pages
|
|
|
: false;
|
|
|
@@ -2255,14 +2317,6 @@ export default {
|
|
|
})
|
|
|
},
|
|
|
|
|
|
- /* 加入我的图库 */
|
|
|
- addMychartHandle(item) {
|
|
|
- this.add_chart_id = item.ChartInfoId;
|
|
|
- //已有的分类ids
|
|
|
- this.add_ids = item.MyChartClassifyId ? item.MyChartClassifyId.split(',').map(item => Number(item)) : [];
|
|
|
- this.isAddMyChart = true;
|
|
|
- },
|
|
|
-
|
|
|
/* 加入我的图库成功 */
|
|
|
addMySuccess(params) {
|
|
|
this.isAddMyChart = false;
|
|
|
@@ -2283,54 +2337,6 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
|
|
|
- /* 获取标签列表 */
|
|
|
- getlabelList(){
|
|
|
- const List = JSON.parse(sessionStorage.getItem('etachart'))||[]
|
|
|
- this.labelList = List
|
|
|
- },
|
|
|
- /* 添加标签 params 基本属性{code,id,classifyId,EdbName,EdbNameEn}*/
|
|
|
- addLabel(params){
|
|
|
- const index = this.labelList.findIndex(i=>i.code===params.code)
|
|
|
- //标签已存在列表中,更新标签的值
|
|
|
- if(index!==-1){
|
|
|
- this.labelList.splice(index,1,params)
|
|
|
- return
|
|
|
- }
|
|
|
- //根据页面宽度 判断标签数量是否达到上限
|
|
|
- const listWidth = document.querySelector('.chartSetting-label-list').offsetWidth
|
|
|
- const minWidth=170+20
|
|
|
- const maxNum = Math.floor(listWidth/minWidth)
|
|
|
- if(this.labelList.length>=maxNum){
|
|
|
- //达到上限则挤出第一个,再添加
|
|
|
- this.labelList.shift()
|
|
|
- }
|
|
|
- this.labelList.push(params)
|
|
|
- },
|
|
|
- //改变选中标签,
|
|
|
- changeCurrentLabel(params){
|
|
|
- if(params.code!==this.select_node){
|
|
|
- this.selectCurrentNode(params)
|
|
|
- }
|
|
|
- },
|
|
|
- //删除标签
|
|
|
- deleteLabel(params,type="label"){
|
|
|
- const index = this.labelList.findIndex(i=>i.code===params.code)
|
|
|
- //如果删除的标签是选中状态
|
|
|
- if(this.select_node===params.code){
|
|
|
- //删除的是唯一一个标签
|
|
|
- if(this.labelList.length===1){
|
|
|
- this.selected_chartid=''
|
|
|
- this.select_node = ''
|
|
|
- this.$refs.treeRef.setCurrentKey(null)
|
|
|
- this.getPublicChartList()
|
|
|
- //不是唯一的标签,则默认选中上一个/下一个
|
|
|
- }else{
|
|
|
- type==='label'&&index===0&&this.changeCurrentLabel(this.labelList[1])
|
|
|
- type==='label'&&index!==0&&index!==-1&&this.changeCurrentLabel(this.labelList[index-1])
|
|
|
- }
|
|
|
- }
|
|
|
- index!==-1&&this.labelList.splice(index,1)
|
|
|
- },
|
|
|
changeTreeNode(){
|
|
|
this.$refs.treeRef.setCurrentKey(this.select_node);
|
|
|
},
|
|
|
@@ -2367,17 +2373,102 @@ export default {
|
|
|
this.getChartDetail()
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ /* =======2.3目录拆分======== */
|
|
|
+ /* 切换分类类型 */
|
|
|
+ handleChangeClassifyType() {
|
|
|
+ this.defaultShowNodes = [];
|
|
|
+ this.public_page_no = 0;
|
|
|
+ this.selected_edbid = 0;
|
|
|
+ this.default_classify = 0;
|
|
|
+ this.search_txt = '';
|
|
|
+ this.$refs.listChartPage && (this.$refs.listChartPage.scrollTop = 0);
|
|
|
+
|
|
|
+ this.getPublicChartList();
|
|
|
+
|
|
|
+
|
|
|
+ ['own','public'].includes(this.classifyShowType) && this.getTreeData();
|
|
|
+ this.classifyShowType==='own' && this.getCollectClassifys();
|
|
|
+ },
|
|
|
+
|
|
|
+ //获取收藏指标分类
|
|
|
+ async getCollectClassifys() {
|
|
|
+ const res = await edbCollectInterface.getEdbCollectClassify({ParentId:0})
|
|
|
+
|
|
|
+ this.collectClassifys = res.Data||[]
|
|
|
+ },
|
|
|
+
|
|
|
+ /* 收藏指标 */
|
|
|
+ handleCollectEdb(info) {
|
|
|
+ this.collectEdbForm = {
|
|
|
+ edbId: info.EdbInfoId,
|
|
|
+ collectClassifyIdList: info.CollectClassifyIdList||[]
|
|
|
+ },
|
|
|
+ this.isOpenEdbCollectDia = true
|
|
|
+ },
|
|
|
+
|
|
|
+ async handleRemoveCollect(item=null) {
|
|
|
+ const res = await edbCollectInterface.edbCollectCancel({
|
|
|
+ ClassifyId: this.select_classifyId,
|
|
|
+ EdbInfoId: item?item.EdbInfoId:this.selected_edbid
|
|
|
+ })
|
|
|
+
|
|
|
+ if(res.Ret !== 200) return
|
|
|
+ this.$message.success('取消收藏成功')
|
|
|
+ if(this.selected_edbid) {
|
|
|
+ this.chartList = []
|
|
|
+ this.selected_edbid = 0
|
|
|
+ }
|
|
|
+ this.getEdbChartList()
|
|
|
+ },
|
|
|
+
|
|
|
+ handleOpenCollectClassify(data=null) {
|
|
|
+ this.collectClassifyForm = {
|
|
|
+ name: data?data.ClassifyName:'',
|
|
|
+ classifyId:data?data.ClassifyId:0
|
|
|
+ }
|
|
|
+ this.isOpenCollectClassifyDia = true
|
|
|
+ },
|
|
|
+
|
|
|
+ /* 收藏指标拖动 */
|
|
|
+ async collectDragOver({oldIndex,newIndex}) {
|
|
|
+ if(oldIndex===newIndex) return
|
|
|
+ let NextEdbInfoId,PrevEdbInfoId;
|
|
|
+ if(newIndex===0){
|
|
|
+ PrevEdbInfoId=0
|
|
|
+ NextEdbInfoId=this.chartList[newIndex+1].EdbInfoId
|
|
|
+ }else if(newIndex===this.chartList.length-1){
|
|
|
+ PrevEdbInfoId = this.chartList[newIndex-1].EdbInfoId
|
|
|
+ NextEdbInfoId = 0
|
|
|
+ }else{
|
|
|
+ PrevEdbInfoId = this.chartList[newIndex-1].EdbInfoId
|
|
|
+ NextEdbInfoId = this.chartList[newIndex+1].EdbInfoId
|
|
|
+ }
|
|
|
+
|
|
|
+ let params = {
|
|
|
+ ClassifyId: this.select_classifyId,
|
|
|
+ EdbInfoId: this.chartList[newIndex].EdbInfoId,
|
|
|
+ NextEdbInfoId,
|
|
|
+ PrevEdbInfoId,
|
|
|
+ }
|
|
|
+
|
|
|
+ const res = await edbCollectInterface.moveCollectEdb(params)
|
|
|
+ if(res.Ret !== 200) return
|
|
|
+ this.$message.success('移动成功')
|
|
|
+ },
|
|
|
+
|
|
|
+ /* 设置指标共享弹窗 */
|
|
|
+ handleOpenSetShared(type) {
|
|
|
+ this.sharedType = type;
|
|
|
+ this.isOpenSetSharedDia = true;
|
|
|
+ }
|
|
|
|
|
|
},
|
|
|
- //离开页面时保存标签
|
|
|
- beforeRouteLeave(to,from,next){
|
|
|
- sessionStorage.setItem('etachart',JSON.stringify(this.labelList))
|
|
|
- next()
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.getlabelList()
|
|
|
|
|
|
+ mounted() {
|
|
|
+ this.getCollectClassifys();
|
|
|
if(this.$route.query.code) {
|
|
|
this.getTreeData({code: this.$route.query.code,id: Number(this.$route.query.id)})
|
|
|
} else {
|
|
|
@@ -2385,15 +2476,9 @@ export default {
|
|
|
this.getPublicChartList();
|
|
|
}
|
|
|
window.addEventListener('resize', this.reloadRightWid);
|
|
|
-
|
|
|
- //离开页面时保存标签
|
|
|
- window.onbeforeunload = ()=>{
|
|
|
- sessionStorage.setItem('etachart',JSON.stringify(this.labelList))
|
|
|
- }
|
|
|
},
|
|
|
destroyed() {
|
|
|
window.removeEventListener('resize', this.reloadRightWid);
|
|
|
- window.onbeforeunload = null
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
@@ -2605,7 +2690,6 @@ export default {
|
|
|
border: 1px solid #ececec;
|
|
|
border-radius: 4px;
|
|
|
box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
|
|
|
- height: calc(100vh - 113px);
|
|
|
overflow: hidden;
|
|
|
position: relative;
|
|
|
box-sizing: border-box;
|
|
|
@@ -2618,10 +2702,9 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.tree-cont {
|
|
|
- padding: 15px 20px 30px;
|
|
|
- overflow: auto;
|
|
|
- max-height: calc(100vh - 330px);
|
|
|
- margin-right: 20px;
|
|
|
+ padding: 0 20px 30px;
|
|
|
+ // overflow: auto;
|
|
|
+ height: calc(100vh - 320px);
|
|
|
}
|
|
|
.target_tree {
|
|
|
font-size: 14px;
|
|
|
@@ -2641,15 +2724,11 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.el-tree__drop-indicator {
|
|
|
- /* position:absolute; */
|
|
|
- /* left:0;
|
|
|
- right:0; */
|
|
|
height: 3px;
|
|
|
- // margin-top: 8px;
|
|
|
background-color: #409eff;
|
|
|
}
|
|
|
.el-tree-node__content {
|
|
|
- margin-bottom: 14px !important;
|
|
|
+ margin-bottom: 5px !important;
|
|
|
}
|
|
|
.el-tree-node__children {
|
|
|
.el-tree-node {
|
|
|
@@ -2682,15 +2761,6 @@ export default {
|
|
|
padding-right: 10px !important;
|
|
|
}
|
|
|
}
|
|
|
- .noDepart {
|
|
|
- margin: 60px 0;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- color: #409eff;
|
|
|
- font-size: 16px;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
.move-btn {
|
|
|
height: 100%;
|
|
|
width: 4px;
|
|
|
@@ -2885,11 +2955,39 @@ export default {
|
|
|
margin-bottom: 22px;
|
|
|
}
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .drawImg {
|
|
|
- position: absolute;
|
|
|
- top: -999px;
|
|
|
- z-index: -100;
|
|
|
+ .own-tree,.collect-tree {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ }
|
|
|
+ .own-tree {
|
|
|
+ height: 60%;
|
|
|
+ }
|
|
|
+ .collect-tree {
|
|
|
+ height: 40%;
|
|
|
+ border-top: 1px solid #C8CDD9;
|
|
|
+ }
|
|
|
+ .tree-title {
|
|
|
+ font-size: 15px;
|
|
|
+ margin: 15px 0;
|
|
|
+ }
|
|
|
+ .tree-wrapper {
|
|
|
+ flex: 1;
|
|
|
+ overflow: auto;
|
|
|
+ }
|
|
|
+ .opt-wrapper {
|
|
|
+ margin: 15px 0;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ color: #0052D9;
|
|
|
+ gap: 10px;
|
|
|
+ .opt-item {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 16px;
|
|
|
+ cursor: pointer;
|
|
|
}
|
|
|
}
|
|
|
|
