Browse Source

myETA公共图库改为列表,补充我的图库删除校验限制

cxmo 1 year ago
parent
commit
20e795266c
2 changed files with 151 additions and 2 deletions
  1. 8 0
      src/api/myETA.js
  2. 143 2
      src/views/myETA/Index.vue

+ 8 - 0
src/api/myETA.js

@@ -242,5 +242,13 @@ export default{
      */
     myETASaveChart(params){
         return post('/future_good/chart_info/save',params)
+    },
+    /**
+     * 获取myETA图库关联的节点列表
+     * @param {*} params 
+     * @returns 
+     */
+    getFrameNode(params){
+        return get('/my_chart/classify/framework_node_list',params)
     }
 }

+ 143 - 2
src/views/myETA/Index.vue

@@ -154,6 +154,21 @@ function handleRemoveChart(item,index){
         })
     }).catch(()=>{})
 }
+let hintDialogShow = ref(false)
+let detailArr = ref([])
+async function classifyDel(item){
+    const res = await apiMyETA.getFrameNode({
+        MyChartClassifyId:item.MyChartClassifyId
+    })
+    if(res.Ret!==200) return 
+    detailArr.value = res.Data||[]
+    if(detailArr.value.length){
+        hintDialogShow.value  = true
+        return
+    }
+    handleClassifyDel(item)
+}
+let activeMenu = ref([])
 
 // 跳转详情
 function goDetail(item){
@@ -234,6 +249,7 @@ async function goSearch(){
                 >{{item.name}}</span>
             </div>
             <draggable 
+                v-if="classifyState.classifyTypeAct==1"
                 class="list-box"
                 :list="curChartClassifyList" 
                 item-key="MyChartClassifyId"
@@ -262,6 +278,33 @@ async function goSearch(){
                     </li>
                 </template>
             </draggable>
+            <div class="public-classify-wrap" v-else>
+                <van-collapse class="classify-level" v-model="activeMenu" :border="false">
+                    <van-collapse-item
+                        :name="item.MenuAdminId"
+                        v-for="item in curChartClassifyList"
+                        :key="item.MenuAdminId"
+                        :is-link="true"
+                    >
+                        <template #title>
+                            <div class="title-second">
+                                <span class="van-ellipsis">{{item.MenuName}}</span>
+                            </div>
+                        </template>
+                        <div 
+                            class="classify-item"
+                            v-for="_item in item.Items" 
+                            :key="_item.MyChartClassifyId"
+                            @click.stop="handleSwitchClassify(_item)"
+                        >
+                            <span class="van-ellipsis text">{{ _item.MyChartClassifyName }}</span>
+                            <div @click.stop="handleShowOpt(_item)" class="menu-icon">
+                                <img class="icon" src="@/assets/imgs/ppt/ppt_icon_menu.png" alt="">
+                            </div>
+                        </div>
+                    </van-collapse-item>
+                </van-collapse>
+            </div>
             <div class="bot-btns" v-permission="myETABtn.myChart_classifyOpt_edit">
                 <van-button type="primary" block @click="handleAddClassify('')">添加我的分类</van-button>
             </div>
@@ -309,7 +352,7 @@ async function goSearch(){
                     @update:model-value="handleClassifyShare"
                 />
             </div>
-            <div class="item border red" @click="handleClassifyDel(classifyState.activeClassifyVal)" v-permission="myETABtn.myChart_classifyOpt_delete">
+            <div class="item border red" @click="classifyDel(classifyState.activeClassifyVal)" v-permission="myETABtn.myChart_classifyOpt_delete">
                 <!-- <img src="@/assets/imgs/icon_del.png" alt=""> -->
                 <span>删除</span>
             </div>
@@ -323,8 +366,46 @@ async function goSearch(){
             </template>
         </div>
     </van-popup>
+    <!--分类节点弹窗-->
+    <van-dialog
+        v-model:show="hintDialogShow"
+        title="提示"
+        show-cancel-button
+        confirmButtonText="确定"
+        @confirm="hintDialogShow = false"
+    >
+        <div class="class-node-wrap">
+            <p>该图分类已添加节点链接,不允许删除!详情请前往PC端查看。</p>
+            <div class="frame-list">
+                <p class="frame-item" v-for="(item,index) in detailArr" :key="index">
+                    {{index+1}}、{{item.FrameworkName}}({{item.NodeName}})
+                </p>
+            </div>
+        </div>
+
+    </van-dialog>
 </template>
 
+<style lang="scss">
+.public-classify-wrap{
+    .van-collapse{
+        .van-collapse-item{
+            >.van-cell{
+                flex-direction: row-reverse;
+                .van-cell__title{
+                    overflow: hidden;
+                }
+            }
+            .van-collapse-item__wrapper{
+                .van-collapse-item__content{
+                    padding-top: 0;
+                    padding-bottom: 0;
+                }
+            }
+        }
+    }
+}
+</style>
 <style lang="scss" scoped>
 .myETA-index-page{
     padding: 0 $page-padding;
@@ -454,6 +535,53 @@ async function goSearch(){
             }
         }
     }
+    .public-classify-wrap{
+        margin-top:30px;
+        .classify-level{
+            span{
+                padding: 0 15px;
+            }
+            .classify-item{
+                display: flex;
+                align-items: center;
+                justify-content: space-between;
+                overflow: hidden;
+                padding: var(--van-cell-vertical-padding) 0;
+                .menu-icon{
+                    width:30px;
+                    text-align: center;
+                }
+                img{
+                    display: inline-block;
+                    width: 48px;
+                    height: auto;
+                    &.icon{
+                        width: 6px;
+                        margin-right: 0;
+                    }
+                }
+            }
+        }
+        @media screen and (min-width:$media-width){
+            margin-top:10px;
+            .classify-level{
+                span{
+                    font-size: 16px;
+                    padding:0 60px;
+                    
+                }
+                .classify-item{
+                    img{
+                        width: 32px;
+                        &.icon{
+                            width:4px;
+                        }
+                    }
+                }
+                
+            }
+        }
+    }
     .bot-btns{
         padding: $page-padding;
     }
@@ -507,7 +635,14 @@ async function goSearch(){
     }
 }
 
-
+.class-node-wrap{
+    padding:30px;
+    .frame-list{
+        max-height: 30vh;
+        overflow-y: auto;
+        margin-top: 15px;
+    }
+}
 
 @media screen and (min-width:$media-width){
     .myETA-index-page{
@@ -617,5 +752,11 @@ async function goSearch(){
             
         }
     }
+    .class-node-wrap{
+        padding:30px;
+        .frame-list{
+            margin-top: 15px;
+        }
+    }
 }
 </style>