Procházet zdrojové kódy

Merge branch 'v2.0' into debug

yujinwen před 3 týdny
rodič
revize
95b1bf1e7d

+ 1 - 0
src/auto-imports.d.ts

@@ -7,6 +7,7 @@ export {}
 declare global {
   const $confirmDialog: typeof import('./plugin/dialog.jsx')['$confirmDialog']
   const EffectScope: typeof import('vue')['EffectScope']
+  const MessagePlugin: typeof import('tdesign-vue-next')['MessagePlugin']
   const computed: typeof import('vue')['computed']
   const createApp: typeof import('vue')['createApp']
   const customRef: typeof import('vue')['customRef']

+ 22 - 2
src/views/etaChart/components/ChartDetailPop.vue

@@ -1,10 +1,13 @@
 <script setup>
-import { apiETAChart } from '@/api/etaChart'
+import { apiETAChart,apiETAChartUser } from '@/api/etaChart'
 import { useChartRender } from '@/hooks/chart/render'
+import CollectChart from '@/views/user/favorite/components/CollectChart.vue'
 
 const { options, axisLimitState, chartRender, setLimitData, isUseSelfLimit } = useChartRender()
 
 const show=defineModel('show',{type:Boolean,default:false})
+const emits=defineEmits(['collectChange'])
+
 const props=defineProps({
   chartInfoId:{
     type:Number,
@@ -58,6 +61,19 @@ watch(
   }
 )
 
+const showCollectChart=ref(false)
+async function handleCancelCollect(){
+  const res=await apiETAChartUser.chartCollectCancel({
+    ChartInfoId:chartInfo.value.ChartInfoId
+  })
+  if(res.Ret!==200) return
+  MessagePlugin.success('取消成功')
+  chartInfo.value.IsCollect=false
+  emits('collectChange',false)
+}
+
+
+
 </script>
 
 <template>
@@ -74,7 +90,8 @@ watch(
   > 
     <div class="flex top-box">
       <div class="chart-name">{{chartInfo?.ChartName}}</div>
-      <svg-icon name="star" style="font-size:20px;cursor: pointer;"></svg-icon>
+      <svg-icon v-if="chartInfo?.IsCollect" name="star_fill" style="font-size:20px;cursor: pointer;" @click="handleCancelCollect"></svg-icon>
+      <svg-icon v-else name="star" style="font-size:20px;cursor: pointer;" @click="showCollectChart=true"></svg-icon>
     </div>
     <div class="chart-render-wrap" v-loading="loading">
       <div class="chart-box" id="chart-detail-pop-box"></div>
@@ -104,6 +121,9 @@ watch(
       </div>
     </div>
   </t-dialog>
+
+  <!-- 收藏图表 -->
+  <CollectChart v-model:show="showCollectChart" :data="chartInfo" @success="chartInfo.IsCollect=true;emits('collectChange',true)"/>
 </template>
 
 <style lang="scss" scoped>

+ 3 - 0
src/views/etaChart/components/ClassifyWrap.vue

@@ -78,6 +78,9 @@ async function getClassify() {
         Children: true
       }
     })
+    // 默认选中第一个
+    classifyActived.value = [arr[0]?.ChartClassifyId]
+    emits('filter')
   }
 }
 getClassify()

+ 14 - 4
src/views/etaChart/components/chartList/ChartBox.vue

@@ -1,9 +1,10 @@
 <script setup>
-import { apiETAChart } from '@/api/etaChart'
+import { apiETAChart,apiETAChartUser } from '@/api/etaChart'
 import { useChartRender } from '@/hooks/chart/render'
 import { onUnmounted, useTemplateRef } from 'vue'
 import ChartDetailPop from '../ChartDetailPop.vue'
 import CollectChart from '@/views/user/favorite/components/CollectChart.vue'
+import { MessagePlugin } from 'tdesign-vue-next'
 
 const { options, axisLimitState, chartRender, setLimitData, isUseSelfLimit } = useChartRender()
 
@@ -95,6 +96,14 @@ onUnmounted(()=>{
 const showChartDetailPop=ref(false)
 
 const showCollectChart=ref(false)
+async function handleCancelCollect(){
+  const res=await apiETAChartUser.chartCollectCancel({
+    ChartInfoId:props.chartData.ChartInfoId
+  })
+  if(res.Ret!==200) return
+  MessagePlugin.success('取消成功')
+  props.chartData.IsCollect=false
+}
 
 </script>
 
@@ -102,7 +111,8 @@ const showCollectChart=ref(false)
   <div class="flex chart-list-item-box" ref="compRef">
     <div class="flex top-box">
       <div class="text-ellipsis--l1 title">{{props.chartData.ChartClassifyName}}</div>
-      <svg-icon name="star" style="font-size:20px;cursor: pointer;" @click="showCollectChart=true"></svg-icon>
+      <svg-icon v-if="props.chartData.IsCollect" name="star_fill" style="font-size:20px;cursor: pointer;" @click="handleCancelCollect"></svg-icon>
+      <svg-icon v-else name="star" style="font-size:20px;cursor: pointer;" @click="showCollectChart=true"></svg-icon>
       <svg-icon name="full_screen" style="font-size:20px;margin-left:20px;cursor: pointer;" @click="showChartDetailPop=true"></svg-icon>
     </div>
     <div class="chart-render-wrap" v-loading="loading">
@@ -135,10 +145,10 @@ const showCollectChart=ref(false)
   </div>
 
   <!-- 图表详情弹窗 -->
-  <ChartDetailPop v-model:show="showChartDetailPop" :chartInfoId="chartInfo?.ChartInfoId"/>
+  <ChartDetailPop v-model:show="showChartDetailPop" :chartInfoId="chartInfo?.ChartInfoId" @collectChange="e=>props.chartData.IsCollect=e"/>
 
   <!-- 收藏图表 -->
-  <CollectChart v-model:show="showCollectChart" :data="chartInfo"/>
+  <CollectChart v-model:show="showCollectChart" :data="chartInfo" @success="props.chartData.IsCollect=true"/>
 </template>
 
 <style lang="scss" scoped>

+ 2 - 2
src/views/user/favorite/components/ClassifyWrap.vue

@@ -15,7 +15,7 @@ function handleClassifyItemClick({node}){
 watch(
   ()=>selecClassify.value,
   ()=>{
-    console.log("分类改变");
+    // console.log("分类改变");
     emits('change',selecClassify.value)
   }
 )
@@ -147,7 +147,7 @@ const showMoveChart=ref(false)
     @change="getClassifyList"
   />
   <!-- 转移分类 -->
-  <MoveChart v-model:show="showMoveChart" :classifyOpts="classifyList"/>
+  <MoveChart v-model:show="showMoveChart" :classifyOpts="classifyList" @change="emits('change',selecClassify)"/>
 </template>
 
 <style lang="scss" scoped>

+ 2 - 2
src/views/user/favorite/components/CollectChart.vue

@@ -6,7 +6,7 @@ import EditClassify from './EditClassify.vue'
 
 
 const show = defineModel('show', { type: Boolean, default: false })
-const emits = defineEmits(['change'])
+const emits = defineEmits(['success'])
 
 const props = defineProps({
   data: {
@@ -57,7 +57,7 @@ async function handleSave(){
     return
   }
   MessagePlugin.success('收藏成功')
-  
+  emits('success')
 }
 
 

+ 76 - 14
src/views/user/favorite/components/MoveChart.vue

@@ -1,9 +1,10 @@
 <script setup>
 import { apiETAChartUser } from '@/api/etaChart'
 import { SearchIcon } from 'tdesign-icons-vue-next'
+import { MessagePlugin } from 'tdesign-vue-next'
 
 const show = defineModel('show', { type: Boolean, default: false })
-
+const emits=defineEmits(['change'])
 
 const props=defineProps({
   classifyOpts:{
@@ -16,6 +17,10 @@ const props=defineProps({
 const selectClassify = ref('')
 const keyword = ref('')
 const checkAll = ref(false)
+const indeterminate=computed(()=>{
+  if(checkAll.value) return false
+  if(selectedRowKeys.value.length>0) return true
+})
 
 const columns=[
   {
@@ -38,14 +43,14 @@ const columns=[
 ]
 const tableData=ref([])
 const pagination = ref({
-  defaultPageSize: 20,
+  pageSize: 10,
   total: 0,
   current: 1,
   showPageSize:false
 });
 async function getChartList(){
   const res=await apiETAChartUser.chartCollectList({
-    CollectClassifyIds:selectClassify.value,
+    CollectClassifyIds:selectClassify.value?selectClassify.value.join(','):'',
     Keyword:keyword.value,
     PageSize:pagination.value.defaultPageSize,
     CurrentIndex:pagination.value.current
@@ -54,28 +59,77 @@ async function getChartList(){
   const arr=res.Data.List||[]
   pagination.value.total=res.Data.Paging.Totals
   tableData.value=arr
+  if(checkAll.value){
+    handleClickCheckAll(checkAll.value)
+  }
 }
 watch(
   ()=>show.value,
   (n)=>{
     if(n){
-      getChartList()
+      keyword.value=''
+      selectClassify.value=''
+      newClassify.value=''
+      handleRefreshList()
     }
   }
 )
 
-function onPageChange(){
-
+function onPageChange(pageInfo){
+  pagination.value.current = pageInfo.current
+  getChartList()
+}
+function handleRefreshList() {
+  pagination.value.current = 1
+  checkAll.value=false
+  selectedRowKeys.value=[]
+  getChartList()
 }
 
 const selectedRowKeys = ref([]);
 function handleTableSelectChange(value, ctx){
-  selectedRowKeys.value=value
+  selectedRowKeys.value = value
+  if(ctx.type==="uncheck"&&checkAll.value){
+    checkAll.value=false
+  }
+  if(ctx.type==='check'&&selectedRowKeys.value.length===pagination.value.total){
+    checkAll.value=true
+  }
+}
+function handleClickCheckAll(check) {
+  if(check){
+    // 全选
+    selectedRowKeys.value=[]
+    tableData.value.forEach(item=>{
+      selectedRowKeys.value.push(item.ChartInfoId)
+    })
+  }else{
+    selectedRowKeys.value=[]
+  }
 }
 
 const newClassify=ref('')
 async function handleSave() {
-
+  if(!newClassify.value){
+    MessagePlugin.warning('请选择要移动至的分类')
+    return
+  }
+  if(!checkAll.value&&selectedRowKeys.value===0){
+    MessagePlugin.warning('请选择要移动的图表')
+    return
+  }
+  const params={
+    SelectAll:checkAll.value,
+    CollectClassifyIds:selectClassify.value?selectClassify.value.join(','):'',
+    Keyword:keyword.value,
+    ChartInfoIds:selectedRowKeys.value.join(','),
+    CollectClassifyId:newClassify.value,
+  }
+  const res=await apiETAChartUser.chartCollectBatchMove(params)
+  if(res.Ret!==200) return
+  MessagePlugin.success('操作成功')
+  show.value=false
+  emits('change')
 }
 
 
@@ -95,7 +149,11 @@ async function handleSave() {
       <t-select
         v-model="selectClassify"
         placeholder="图表分类"
+        multiple
+        :min-collapsed-num="1"
+        clearable
         style="max-width: 235px"
+        @change="handleRefreshList"
       >
         <t-option
           v-for="item in props.classifyOpts"
@@ -104,22 +162,26 @@ async function handleSave() {
           :value="item.CollectClassifyId"
         ></t-option>
       </t-select>
-      <t-input placeholder="请输入图表名称" style="max-width: 600px">
+      <t-input placeholder="请输入图表名称" v-model="keyword" @change="handleRefreshList" style="max-width: 600px">
         <template #prefixIcon>
           <SearchIcon />
         </template>
       </t-input>
-      <t-checkbox style="flex-shrink: 0" v-model="checkAll">全选</t-checkbox>
+      <t-checkbox 
+        style="flex-shrink: 0" 
+        v-model="checkAll"
+        :indeterminate="indeterminate"
+        @change="handleClickCheckAll"
+      >全选</t-checkbox>
     </div>
     <t-table
-      row-key="ChartCollectId"
+      row-key="ChartInfoId"
       :data="tableData"
       :columns="columns"
       bordered
-      hover
-      max-height="500"
+      max-height="600"
       resizable
-      :selected-row-keys="selectedRowKeys"
+      v-model:selectedRowKeys="selectedRowKeys"
       :pagination="pagination"
       @page-change="onPageChange"
       @select-change="handleTableSelectChange"

+ 14 - 4
src/views/user/favorite/etaChart.vue

@@ -3,6 +3,7 @@ import {SearchIcon} from 'tdesign-icons-vue-next'
 import ClassifyWrap from './components/ClassifyWrap.vue'
 import {apiETAChartUser} from '@/api/etaChart'
 import ChartDetailPop from '@/views/etaChart/components/ChartDetailPop.vue'
+import { MessagePlugin } from 'tdesign-vue-next'
 
 let classifyId=0
 const SysUserIds=ref([])
@@ -37,7 +38,6 @@ function refreshList(){
 }
 function handleClassifyChange(e){
   classifyId=e
-  console.log('gafkdsf');
   refreshList()
 }
 
@@ -49,6 +49,16 @@ function handleShowChartDetail(e){
   showChartDetailPop.value=true
 }
 
+// 取消收藏
+async function handleCancelCollect(item,index){
+  const res=await apiETAChartUser.chartCollectCancel({
+    ChartInfoId:item.ChartInfoId
+  })
+  if(res.Ret!==200) return
+  MessagePlugin.success('取消成功')
+  chartList.value.splice(index,1)
+}
+
 </script>
 
 <template>
@@ -79,10 +89,10 @@ function handleShowChartDetail(e){
       <empty-wrap v-if="finished&&chartList.length===0" />
       <div class="chart-list-wrap" v-else>
         <ul class="flex chart-list">
-          <li class="bg-white chart-item" v-for="item in chartList" :key="item.ChartCollectId">
+          <li class="bg-white chart-item" v-for="item,index in chartList" :key="item.ChartCollectId">
             <div class="flex chart-name">
               <div class="text-ellipsis--l1 name">{{item.ChartName}}</div>
-              <svg-icon name="star_fill" style="font-size:20px;cursor: pointer;"></svg-icon>
+              <svg-icon name="star_fill" style="font-size:20px;cursor: pointer;" @click="handleCancelCollect(item,index)"></svg-icon>
               <svg-icon name="full_screen" style="font-size:20px;margin-left:20px;cursor: pointer;" @click="handleShowChartDetail(item)"></svg-icon>
             </div>
             <img class="chart-img" :src="item.ChartImage" alt="">
@@ -105,7 +115,7 @@ function handleShowChartDetail(e){
   </div>
 
   <!-- 图表详情弹窗 -->
-  <ChartDetailPop v-model:show="showChartDetailPop" :chartInfoId="activeChartInfo?.ChartInfoId"/>
+  <ChartDetailPop v-model:show="showChartDetailPop" :chartInfoId="activeChartInfo?.ChartInfoId" @collectChange="refreshList()"/>
 </template>
 
 <style lang="scss" scoped>