فهرست منبع

Merge branch 'demand-164'

cxmo 1 سال پیش
والد
کامیت
fb755e599e

BIN
src/assets/img/ppt_m/list_bg.png


BIN
src/assets/img/ppt_m/move_ico2.png


+ 12 - 0
src/lang/modules/Slides/pptList.js

@@ -114,6 +114,12 @@ export const listEn = {
   is_delete_ppt: "Are you sure you want to delete this PowerPoint slide?",
   add_least_one: "Please add at least one PowerPoint slide.",
   preview_report_btn: "Preview report.",
+
+  //列表页操作栏
+  list_ppt_item_publish:'Publish',
+  list_ppt_item_preview:'Demo',
+  list_ppt_item_download:'Download',
+  list_ppt_item_edit:'Edit'
 };
 
 /* 中文 */
@@ -230,4 +236,10 @@ export const listZh = {
   is_delete_ppt: "确定删除该页ppt吗",
   add_least_one: "请至少添加一张",
   preview_report_btn: "预览报告",
+
+  //列表页操作栏
+  list_ppt_item_publish:'预览发布',
+  list_ppt_item_preview:'演示',
+  list_ppt_item_download:'下载',
+  list_ppt_item_edit:'编辑'
 };

+ 86 - 5
src/views/ppt_manage/newVersion/pptCatalog.vue

@@ -210,7 +210,7 @@
             @end="moveListPPT"
             :disabled="(treeName==='private'&&!selectNode)||treeName!=='private'"
             >
-            <div class="list-item" 
+            <!-- <div class="list-item" 
               v-for="item in catalogPPTList" :key="item.PptId"
               @click="changeModel('ppt',item)"
               >
@@ -228,6 +228,27 @@
                 <span>{{item.Title}}</span>
               </div>
               <span style="font-size:14px;">{{$t('Slides.creation_time')}}:{{$moment(item.PptCreateTime).format('YYYY-MM-DD')}}</span>
+            </div> -->
+            <div class="list-item" 
+                v-for="item in catalogPPTList" :key="item.PptId"
+                @click="changeModel('ppt',item)">
+                <div class="item-image" 
+                    :style="{'background-image':`url(${require('@/assets/img/ppt_m/list_bg.png')})`}">
+                        <span>{{item.Title}}</span>
+                </div>
+                <div class="item-opt">
+                    <span v-for="optItem in setListTool()" :key="optItem.key" @click.stop="handleListToolClick(optItem,item)">
+                        {{ getListMenuOptText(optItem.label) }}
+                    </span>
+                </div>
+                <div class="item-foot" style="margin-bottom:0;">
+                    <span style="font-size:14px;">{{$t('Slides.creation_time')}}:{{$moment(item.PptCreateTime).format('YYYY-MM-DD')}}</span>
+                    <img
+                        v-if="treeName==='private'&&selectNode"
+                        src="~@/assets/img/ppt_m/move_ico2.png"
+                        style="width: 14px; height: 14px; margin-right: 8px"
+                    />
+                </div>
             </div>
           </draggable>
           <div class="empty" v-if="catalogPPTList.length===0">
@@ -438,7 +459,15 @@ export default {
     } */
   },
   methods: {
-    // 
+    //ppt列表操作栏
+    getListMenuOptText(e){
+        if(e==='预览发布') return this.$t('Slides.list_ppt_item_publish')
+        if(e==='演示') return this.$t('Slides.list_ppt_item_preview')
+        if(e==='下载') return this.$t('Slides.list_ppt_item_download')
+        if(e==='编辑') return this.$t('Slides.list_ppt_item_edit')
+
+    },
+    //ppt详情操作栏
     getContentMenuOptText(e){
       if(e==='查看报告') return this.$t('Slides.view_report_btn')
       if(e==='编辑') return this.$t('Slides.edit_lable_name')
@@ -565,6 +594,34 @@ export default {
         })
       }
     },
+    //设置列表的操作按钮
+    setListTool(){
+      let list = []
+      const {checkPermissionBtn,pptPermission} = this.permissionBtn
+      const authMap = {
+          'publish':checkPermissionBtn(pptPermission.ppt_publish),
+          'present':checkPermissionBtn(pptPermission.ppt_show),
+          'download':checkPermissionBtn(pptPermission.ppt_download),
+          'edit':checkPermissionBtn(pptPermission.ppt_save),
+      }
+      //私有目录显示编辑,其他不显示
+      list = toolList.filter((i)=>{
+          return ['publish','present','download','edit'].includes(i.key)
+        })
+      if(this.treeName!=='private'){
+        list = list.filter(_ => _.key !== 'edit')
+      }
+      const sortMap = {
+        'present':0,
+        'edit':1,
+        'publish':2,
+        'download':3
+      }
+      list.sort((a,b)=>{
+        return sortMap[a.key] - sortMap[b.key]
+      })
+      return list
+    },
     //设置操作按钮
     setToolList(pptDetail={}){
       //公共目录:显示除 删除, 编辑 外的全部按钮
@@ -755,6 +812,22 @@ export default {
         })
       })
     },
+    //点击列表操作栏事件处理
+    handleListToolClick(item,{PptId,PptxUrl,Title}){
+        const urlMap = {
+        edit:`/ppteditor?id=${PptId}`,
+        publish:`/pptpublish?id=${PptId}`,
+        present:`/pptpresent?id=${PptId}`
+      }
+      if(urlMap[item.key]){
+        window.open(urlMap[item.key],'_blank')
+        return 
+      }
+      const handleCommand = {
+        'download':this.downloadPpt,
+      }
+      handleCommand[item.key]({PptxUrl,Title})
+    },
     //点击操作栏事件处理
     async handleToolClick(item){
       const urlMap = {
@@ -1504,7 +1577,7 @@ export default {
           flex-wrap: wrap;
         }
         .list-item{
-          width: 30%;
+          width: 23%;
           background-color: white;
           border: 1px solid #ECECEC;
           border-radius: 4px;
@@ -1513,7 +1586,7 @@ export default {
           margin: 0 20px 20px 0;
           padding:10px;
           box-sizing: border-box;
-          .item-title{
+          .item-title,.item-foot{
             width:100%;
             height:20px;
             display: flex;
@@ -1550,9 +1623,17 @@ export default {
               transform: translate(-50%,-50%);
               font-size: 24px;
               color: #FFFFFF;
-              font-weight: bold;
+              /* font-weight: bold; */
             }
           }
+          .item-opt{
+            display:flex;
+            justify-content:space-between;
+            color:#0052D9;
+            cursor:pointer;
+            margin:10px 0;
+            font-size:16px;
+          }
         }
         .empty{
           position: absolute;

+ 85 - 4
src/views/ppt_manage/newVersion/pptEnCatalog.vue

@@ -205,7 +205,7 @@
             @end="moveListPPT"
             :disabled="treeName!=='private'"
             >
-            <div class="list-item" 
+            <!-- <div class="list-item" 
               v-for="item in catalogPPTList" :key="item.PptId"
               @click="changeModel('ppt',item)"
               >
@@ -223,6 +223,27 @@
                 <span>{{item.Title}}</span>
               </div>
               <span style="font-size:14px;">{{$t('Slides.creation_time')}}:{{$moment(item.PptCreateTime).format('YYYY-MM-DD')}}</span>
+            </div> -->
+            <div class="list-item" 
+                v-for="item in catalogPPTList" :key="item.PptId"
+                @click="changeModel('ppt',item)">
+                <div class="item-image" 
+                :style="{'background-image':`url(${require('@/assets/img/ppt_m/list_bg.png')})`}">
+                        <span>{{item.Title}}</span>
+                </div>
+                <div class="item-opt">
+                    <span v-for="optItem in setListTool()" :key="optItem.key" @click.stop="handleListToolClick(optItem,item)">
+                        {{ getListMenuOptText(optItem.label) }}
+                    </span>
+                </div>
+                <div class="item-foot" style="margin-bottom:0;">
+                    <span style="font-size:14px;">{{$t('Slides.creation_time')}}:{{$moment(item.PptCreateTime).format('YYYY-MM-DD')}}</span>
+                    <img
+                        v-if="treeName==='private'&&selectNode"
+                        src="~@/assets/img/ppt_m/move_ico2.png"
+                        style="width: 14px; height: 14px; margin-right: 8px"
+                    />
+                </div>
             </div>
           </draggable>
           <div class="empty" v-if="catalogPPTList.length===0">
@@ -424,6 +445,14 @@ export default {
     },
   },
   methods: {
+    //ppt列表操作栏
+    getListMenuOptText(e){
+        if(e==='预览发布') return this.$t('Slides.list_ppt_item_publish')
+        if(e==='演示') return this.$t('Slides.list_ppt_item_preview')
+        if(e==='下载') return this.$t('Slides.list_ppt_item_download')
+        if(e==='编辑') return this.$t('Slides.list_ppt_item_edit')
+
+    },
     getContentMenuOptText(e){
       if(e==='查看报告') return this.$t('Slides.view_report_btn')
       if(e==='编辑') return this.$t('Slides.edit_lable_name')
@@ -537,6 +566,34 @@ export default {
         })
       }
     },
+    //设置列表的操作按钮
+    setListTool(){
+      let list = []
+      const {checkPermissionBtn,pptPermission} = this.permissionBtn
+      const authMap = {
+          'publish':checkPermissionBtn(pptPermission.ppt_publish),
+          'present':checkPermissionBtn(pptPermission.ppt_show),
+          'download':checkPermissionBtn(pptPermission.ppt_download),
+          'edit':checkPermissionBtn(pptPermission.ppt_save),
+      }
+      //私有目录显示编辑,其他不显示
+      list = toolList.filter((i)=>{
+          return ['publish','present','download','edit'].includes(i.key)
+        })
+      if(this.treeName!=='private'){
+        list = list.filter(_ => _.key !== 'edit')
+      }
+      const sortMap = {
+        'present':0,
+        'edit':1,
+        'publish':2,
+        'download':3
+      }
+      list.sort((a,b)=>{
+        return sortMap[a.key] - sortMap[b.key]
+      })
+      return list
+    },
     //设置操作按钮
     setToolList(pptDetail={}){
       //公共目录:显示除 删除, 编辑 外的全部按钮
@@ -720,6 +777,22 @@ export default {
         })
       })
     },
+    //点击列表操作栏事件处理
+    handleListToolClick(item,{PptId,PptxUrl,Title}){
+        const urlMap = {
+        edit:`/ppteditor?id=${PptId}`,
+        publish:`/pptpublish?id=${PptId}`,
+        present:`/pptpresent?id=${PptId}`
+      }
+      if(urlMap[item.key]){
+        window.open(urlMap[item.key],'_blank')
+        return 
+      }
+      const handleCommand = {
+        'download':this.downloadPpt,
+      }
+      handleCommand[item.key]({PptxUrl,Title})
+    },
     //点击操作栏事件处理
     async handleToolClick(item){
       const urlMap = {
@@ -1393,7 +1466,7 @@ export default {
           flex-wrap: wrap;
         }
         .list-item{
-          width: 30%;
+          width: 23%;
           background-color: white;
           border: 1px solid #ECECEC;
           border-radius: 4px;
@@ -1402,7 +1475,7 @@ export default {
           margin: 0 20px 20px 0;
           padding:10px;
           box-sizing: border-box;
-          .item-title{
+          .item-title,.item-foot{
             width:100%;
             height:20px;
             display: flex;
@@ -1438,9 +1511,17 @@ export default {
               transform: translate(-50%,-50%);
               font-size: 24px;
               color: #FFFFFF;
-              font-weight: bold;
+              /* font-weight: bold; */
             }
           }
+          .item-opt{
+            display:flex;
+            justify-content:space-between;
+            color:#0052D9;
+            cursor:pointer;
+            margin:10px 0;
+            font-size:16px;
+          }
         }
         .empty{
           position: absolute;