Merge branch 'pre' into zz-dev

src/components/base/WorkingBox/index.vue

+<template>
+  <div class="normal-box" :class="{ 'box-glow': isBorderActive }">
+    <div class="content-box">
+      <slot></slot>
+    </div>
+
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  isBorderActive: {
+    type: Boolean,
+    default: false,
+  }
+})
+
+</script>
+
+
+<style lang="scss" scoped>
+.normal-box {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  border-radius: 16px;
+  // border: 2px solid var(--bg-black-5);
+  background: var(--color-primary-2);
+
+  .content-box {
+    position: absolute;
+    z-index: 2;
+    top: 10px;
+    left: 10px;
+    width: calc(100% - 20px);
+    height: calc(100% - 20px);
+  }
+
+}
+
+/* 霓虹发光效果变体 */
+.box-glow {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  border-radius: 16px;
+  // background: #1a1a1a;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  overflow: hidden;
+  background: var(--bg-black-5);
+  // border: 2px solid transparent !important;
+  border: none;
+
+  .content-box {
+    position: absolute;
+    z-index: 2;
+    top: 10px;
+    left: 10px;
+    width: calc(100% - 20px);
+    height: calc(100% - 20px);
+  }
+}
+
+.box-glow::before {
+  content: '';
+  position: absolute;
+  width: 150%;
+  height: 250%;
+  background: conic-gradient(from 0deg,
+      #85B2FF 0deg 180deg,
+      #B685FF 180deg 360deg);
+  animation: rotate 3s linear infinite;
+  filter: blur(10px);
+}
+
+.box-glow::after {
+  content: '';
+  position: absolute;
+  inset: 3px;
+  background: #fff;
+  border-radius: 12px;
+}
+
+// .glow-layer {
+//   position: absolute;
+//   inset: -2px;
+//   background: conic-gradient(from 0deg,
+//       #85B2FF 0deg 180deg,
+//       #B685FF 180deg 360deg);
+//   animation: rotate 3s linear infinite;
+//   filter: blur(20px);
+//   opacity: 0.5;
+// }
+</style>

src/components/base/messageBubble/index.vue

@@ -10,8 +10,8 @@
 			</div>
 			<!-- <div class="more" @click="handleToMoreNews">{{ "更多 +" }}</div> -->
 		</div>
-		<div class="msg-bubble-main" ref="scrollContainer">
-			<div class="message-bubble" v-for="(item, index) in displayList" :key="index" @click="handleClickPerson(item)">
+		<div class="msg-bubble-main" ref="scrollContainer" @mouseenter="pauseScroll" @mouseleave="resumeScroll">
+			<div class="message-bubble" v-for="(item, index) in infiniteList" :key="index" @click="handleClickPerson(item)">
 				<div class="avatar-container">
 					<img :src="item[props.imageUrl] || avatarUser" :alt="item[props.name]" class="avatar" />
 					<div class="avatar-containerOne" v-if="isRepublicanParty">
@@ -39,7 +39,7 @@
 </template>
 
 <script setup>
-import { ref, computed, onMounted, onBeforeUnmount } from "vue";
+import { ref, computed, watch, nextTick, onMounted, onBeforeUnmount, onUnmounted } from "vue";
 import avatarUser from "@/assets/images/avatar_user.png";
 
 const emit = defineEmits(["click", "info-click"]);
@@ -135,30 +135,164 @@ const displayList = computed(() => {
 	return list
 })
 
+
+const scrollSpeed = ref(30)
+const autoStart = ref(true)
+const copyCount = ref(3)
+
+// 创建无限列表（复制多份）
+const infiniteList = computed(() => {
+  if (!displayList.value || displayList.value.length === 0) return []
+  
+  const result = []
+  for (let i = 0; i < copyCount.value; i++) {
+    result.push(...displayList.value)
+  }
+  return result
+})
+
+// 状态
+let animationId = null
+let lastTimestamp = 0
+let isPaused = ref(false)
+let isScrolling = ref(false)
+
+// 滚动动画函数（使用 requestAnimationFrame）
+const scrollAnimation = (timestamp) => {
+  if (!scrollContainer.value || isPaused.value) {
+    if (!isPaused.value) {
+      animationId = requestAnimationFrame(scrollAnimation)
+    }
+    return
+  }
+
+  if (!lastTimestamp) {
+    lastTimestamp = timestamp
+    animationId = requestAnimationFrame(scrollAnimation)
+    return
+  }
+
+  // 计算时间差（秒）
+  const deltaTime = Math.min(0.033, (timestamp - lastTimestamp) / 1000) // 限制最大33ms
+  if (deltaTime <= 0) {
+    lastTimestamp = timestamp
+    animationId = requestAnimationFrame(scrollAnimation)
+    return
+  }
+
+  const container = scrollContainer.value
+  const scrollHeight = container.scrollHeight
+  const clientHeight = container.clientHeight
+  
+  // 计算滚动步长
+  const step = scrollSpeed.value * deltaTime
+  let newScrollTop = container.scrollTop + step
+  
+  // 检查是否滚动到底部
+  const maxScrollTop = scrollHeight - clientHeight
+  
+  if (newScrollTop >= maxScrollTop - 1) {
+    // 到达底部，无缝跳转到顶部
+    container.scrollTop = 0
+    // 重置时间戳避免跳跃
+    lastTimestamp = timestamp
+  } else {
+    container.scrollTop = newScrollTop
+  }
+  
+  lastTimestamp = timestamp
+  animationId = requestAnimationFrame(scrollAnimation)
+}
+
 // 开始滚动
 const startScroll = () => {
-	if (timer) clearInterval(timer)
-	timer = setInterval(() => {
-		currentIndex.value = (currentIndex.value + 1) % props.messageList.length
-	}, 2000) // 每秒滚动一条
+  if (animationId) {
+    cancelAnimationFrame(animationId)
+    animationId = null
+  }
+  if (isPaused.value) return
+  
+  lastTimestamp = 0
+  isScrolling.value = true
+  animationId = requestAnimationFrame(scrollAnimation)
 }
 
 // 停止滚动
 const stopScroll = () => {
-	if (timer) {
-		clearInterval(timer)
-		timer = null
+  if (animationId) {
+    cancelAnimationFrame(animationId)
+    animationId = null
   }
+  lastTimestamp = 0
+  isScrolling.value = false
+}
+
+// 暂停滚动
+const pauseScroll = () => {
+  if (isPaused.value) return
+  isPaused.value = true
+  stopScroll()
 }
 
-onMounted(() => {
-	if (props.messageList.length > 3) {
+// 恢复滚动
+const resumeScroll = () => {
+  if (!isPaused.value) return
+  isPaused.value = false
+  if (autoStart.value) {
     startScroll()
   }
+}
 
+// 重置滚动位置（可选方法）
+const resetScrollPosition = () => {
+  if (scrollContainer.value) {
+    scrollContainer.value.scrollTop = 0
+  }
+}
+
+// 监听 displayList 变化
+watch(
+  () => displayList.value,
+  async (newVal, oldVal) => {
+    if (newVal && newVal.length > 0) {
+      await nextTick()
+      // 如果列表内容变化，重置滚动位置并重新开始
+      if (scrollContainer.value) {
+        const wasPaused = isPaused.value
+        stopScroll()
+        scrollContainer.value.scrollTop = 0
+        if (!wasPaused && autoStart.value) {
+          isPaused.value = false
+          startScroll()
+        }
+      }
+    }
+  },
+  { deep: true, immediate: false }
+)
+
+// 监听 scrollSpeed 变化
+watch(
+  () => scrollSpeed.value,
+  () => {
+    if (isScrolling.value && !isPaused.value) {
+      // 重新启动滚动以应用新速度
+      stopScroll()
+      startScroll()
+    }
+  }
+)
+
+// 组件挂载
+onMounted(async () => {
+  await nextTick()
+  if (autoStart.value && displayList.value && displayList.value.length > 0) {
+    startScroll()
+  }
 })
 
-onBeforeUnmount(() => {
+// 组件卸载
+onUnmounted(() => {
   stopScroll()
 })
 

src/components/base/moduleHeader/index.vue

 <template>
 	<div class="module-header-wrapper">
-		<div class="nav-content">
+		<div class="nav-content" :class="{ 'nav-content-library': isShowDataLibrary }">
 			<div class="nav-left" :class="{ 'flex-start': isShowSearchBar }">
 				<div class="icon">
 					<img v-show="!isShowSearchBar" src="@/assets/icons/overview/logo.png" alt="" />
@@ -489,6 +489,11 @@ const handleUserCommand = async (command) => {
 	}
 };
 
+const isShowDataLibrary = computed(() => {
+	const isShowLibrary = route.fullPath.includes('/dataLibrary')
+	return isShowLibrary
+})
+
 onMounted(() => {
 	handleGetPersonType();
 	handleGetSsoUserInfo();
@@ -506,6 +511,11 @@ onMounted(() => {
 	background: linear-gradient(180deg, rgba(246, 250, 255, 0.8) 0%, rgba(255, 255, 255, 0.8) 100%);
 	padding: 12px 0;
 
+	.nav-content-library {
+		width: calc(100% - 24px - 37px) !important;
+		margin: 0 37px 0 24px !important;
+	}
+
 	.nav-content {
 		width: 1600px;
 		margin: 0 auto;

src/stores/tagsView.js

@@ -12,7 +12,7 @@ const useTagsViewStore = defineStore('tags-view', {
       this.addCachedView(view)
     },
     addVisitedView(view) {
-      this.visitedViews = localStorage.getItem('visitedViews') && JSON.parse(localStorage.getItem('visitedViews')) || []
+      this.visitedViews = sessionStorage.getItem('visitedViews') && JSON.parse(sessionStorage.getItem('visitedViews')) || []
       this.visitedViews.forEach(item => {
         item.active = false
       })
@@ -24,7 +24,7 @@ const useTagsViewStore = defineStore('tags-view', {
           ...view,
           title: view.meta?.title || '未命名'
         })
-        localStorage.setItem('visitedViews', JSON.stringify(this.visitedViews))
+        sessionStorage.setItem('visitedViews', JSON.stringify(this.visitedViews))
       } else {
         this.visitedViews.forEach(v => {
           if (v.path === view.path) {
@@ -50,7 +50,7 @@ const useTagsViewStore = defineStore('tags-view', {
         if (index !== -1) {
           this.visitedViews.splice(index, 1)
         }
-        localStorage.setItem('visitedViews', JSON.stringify(this.visitedViews))
+        sessionStorage.setItem('visitedViews', JSON.stringify(this.visitedViews))
         resolve([...this.visitedViews])
       })
     },
@@ -66,7 +66,7 @@ const useTagsViewStore = defineStore('tags-view', {
     },
 
     loadVisitedViewFromLocalStorage() {
-      const saved = localStorage.getItem('visitedViews')
+      const saved = sessionStorage.getItem('visitedViews')
       if (saved) {
         this.items = JSON.parse(saved)
       }

src/styles/components/WorkingBox/index.vue

+<template>
+  <el-row class="wrapper layout-grid-line">
+    <el-col :span="span">
+      <pre>
+        {{
+          `
+      import WorkingBox from '@/components/base/WorkingBox/index.vue'
+      <div class="outer-box">
+        <WorkingBox>
+            <div class="content">我是内容区域</div>
+        </WorkingBox>
+      </div>
+  `
+        }}
+      </pre>
+      <div class="outer-box">
+        <WorkingBox :is-border-active="isBorderActive">
+          <div class="content">我是内容区域</div>
+        </WorkingBox>
+
+        <div class="btn-box">
+          <el-button type="primary" @click="handleChangeBorderActiveStatus(true)">激活</el-button>
+          <el-button type="plain" @click="handleChangeBorderActiveStatus(false)">恢复</el-button>
+        </div>
+      </div>
+
+
+    </el-col>
+  </el-row>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import '@/styles/common.scss'
+import WorkingBox from '@/components/base/WorkingBox/index.vue'
+const span = 12
+
+const isBorderActive = ref(false)
+
+const handleChangeBorderActiveStatus = (isActive) => {
+  isBorderActive.value = isActive
+}
+
+</script>
+
+<style lang="scss" scoped>
+.outer-box {
+  width: 600px;
+  height: 300px;
+  margin: 50px 20px;
+
+  .content {
+    width: 100%;
+    height: 100%;
+    background: #e3e3e3;
+  }
+  .btn-box{
+    margin-top: 10px;
+  }
+}
+</style>
\ No newline at end of file

src/styles/components/index.vue

@@ -70,6 +70,9 @@
                         <el-tab-pane label="引力关系图" lazy>
                             <RelationForceChart />
                         </el-tab-pane>
+                        <el-tab-pane label="激活工作框" lazy>
+                            <WorkingBox />
+                        </el-tab-pane>
                     </el-tabs>
                 </div>
             </el-space>
@@ -103,6 +106,7 @@ import AiSummary from './Ai/AiSummary/index.vue'
 import RelationChart from './RelationChart/index.vue'
 import RelationCenterChart from './RelationCenterChart/index.vue'
 import RelationForceChart from './RelationForceChart/index.vue'
+import WorkingBox from './WorkingBox/index.vue'
 </script>
 
 <style lang="scss" scoped>

src/views/dataLibrary/bill/countryBill/index.vue

@@ -42,7 +42,7 @@
     <div class="chart-main-box" v-if="isShowChart">
       <div class="info-box">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -52,8 +52,8 @@
         <div class="content-header">
           <ChartHeader :list="staticsDemensionList" @clickItem="handleClickDemensionItem">
             <template #chart-header-right>
-              <el-select v-model="selectedTime" placeholder="选择时间" style="width: 150px"
-                v-show="curDemension === '提案时间'" @change="handleChangeTime">
+              <el-select v-model="selectedTime" placeholder="选择时间" style="width: 150px" v-show="curDemension === '提案时间'"
+                @change="handleChangeTime">
                 <el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value" />
               </el-select>
 
@@ -77,7 +77,7 @@
     <div class="data-main-box" v-else>
       <div class="data-main-box-header">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -106,7 +106,7 @@
               </el-select>
             </div>
             <div class="header-right-item3 item3">
-              <el-select v-model="isSort" placeholder="发布时间" style="width: 166px" @change="handlePxChange">
+              <el-select v-model="isSort" placeholder="提案时间" style="width: 166px" @change="handlePxChange">
                 <template #prefix>
                   <div style="display: flex; align-items: center; height: 100%">
                     <img src="../../assets/icons/desc-icon.svg" style="width: 14px; height: 14px" />
@@ -162,6 +162,7 @@ import PieChart from '../../components/PieChart/index.vue'
 import BarChart from '../../components/BarChart/index.vue'
 import RaderChart from '../../components/RadarChart/idnex.vue'
 import SelectBox from '../../components/SelectBox/index.vue'
+import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
 import { useRoute } from "vue-router";
 import router from '@/router'
 
@@ -286,9 +287,9 @@ const handleClickDemensionItem = (val) => {
   curDemension.value = val.name
   timer2.value = setTimeout(() => {
     activeChart.value = val.chartTypeList[0]
-    if (curDemension.value === '发布时间' && selectedTime.value === '按年度统计') {
+    if (curDemension.value === '提案时间' && selectedTime.value === '按年度统计') {
       curChartData.value = val.yearData
-    } else if (curDemension.value === '发布时间' && selectedTime.value === '按季度统计') {
+    } else if (curDemension.value === '提案时间' && selectedTime.value === '按季度统计') {
       curChartData.value = val.quatarData
     } else {
       curChartData.value = val.data
@@ -823,11 +824,11 @@ const tableData = ref([
 
 const releaseTimeList = ref([
   {
-    label: "按发布时间倒序",
+    label: "按提案时间倒序",
     value: true
   },
   {
-    label: "按发布时间升序",
+    label: "按提案时间升序",
     value: false
   }
 ]);
@@ -921,7 +922,17 @@ const fetchTableData = async () => {
 
     timer3.value = setTimeout(() => {
       activeChart.value = curDemensionItem.chartTypeList[0]
+      if (curDemension.value === '提案时间') {
+        if (selectedTime.value === '按月度统计') {
+          curChartData.value = curDemensionItem.data
+        } else if (selectedTime.value === '按季度统计') {
+          curChartData.value = curDemensionItem.quatarData
+        } else {
+          curChartData.value = curDemensionItem.yearData
+        }
+      } else {
         curChartData.value = curDemensionItem.data
+      }
     })
 
   } catch (error) {
@@ -1288,24 +1299,26 @@ onBeforeUnmount(() => {
   }
 
   .chart-main-box {
+    width: 1568px;
+    height: 809px;
+    margin: 0 auto;
+    background: rgba(255, 255, 255);
+    border: 1px solid var(--bg-black-5);
+    border-radius: 10px;
+
     .info-box {
       margin: 0 auto;
-      width: 1568px;
+      margin-top: 16px;
+      width: 1520px;
       height: 30px;
       display: flex;
       justify-content: space-between;
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
-
-        img {
-          width: 100%;
-          height: 100%;
-        }
       }
 
       .num-box {
@@ -1316,14 +1329,13 @@ onBeforeUnmount(() => {
     .content-box {
       margin: 0 auto;
       margin-top: 16px;
-      width: 1568px;
-      height: 766px;
-      border-radius: 10px;
-      background: rgba(255, 255, 255);
-      border: 1px solid var(--bg-black-5);
+      width: 1520px;
+      height: 726px;
+      border: none;
+
 
       .content-header {
-        margin: 16px 24px;
+        margin: 16px 0;
         width: 1520px;
         height: 28px;
       }
@@ -1353,15 +1365,9 @@ onBeforeUnmount(() => {
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        border: none;
+        height: 28px;
         cursor: pointer;
-
-        img {
-          width: 100%;
-          height: 100%;
-        }
       }
 
       .num-box {

src/views/dataLibrary/components/ChartContainer/index.vue

@@ -88,7 +88,7 @@ const chartItemList = computed(() => {
   let arr = []
   props.chartTypeList.forEach(item => {
     defaultChartTypeList.forEach(val => {
-      if (val.name === item) {
+      if (val.name === item || val.name === item.name) {
         arr.push(val)
       }
     })

src/views/dataLibrary/components/dataChartSwitchBox/chart-active.svg

+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none">
+	<rect id="icon_图表1 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="矢量 461" d="M11.9004 5.50781C11.4904 5.50781 11.1504 5.84781 11.1504 6.25781L11.1504 14.2578C11.1504 14.6678 11.4904 15.0078 11.9004 15.0078C12.3104 15.0078 12.6504 14.6678 12.6504 14.2578L12.6504 6.25781C12.6504 5.84781 12.3104 5.50781 11.9004 5.50781ZM8.00039 2.50781C7.59039 2.50781 7.25039 2.84781 7.25039 3.25781L7.25039 14.2578C7.25039 14.6678 7.59039 15.0078 8.00039 15.0078C8.41039 15.0078 8.75039 14.6678 8.75039 14.2578L8.75039 3.25781C8.75039 2.84781 8.41039 2.50781 8.00039 2.50781L8.00039 2.50781ZM3.90039 7.50781C3.49039 7.50781 3.15039 7.84781 3.15039 8.25781L3.15039 14.2578C3.15039 14.6678 3.49039 15.0078 3.90039 15.0078C4.31039 15.0078 4.65039 14.6678 4.65039 14.2578L4.65039 8.25781C4.65039 7.84781 4.31039 7.50781 3.90039 7.50781Z" fill="rgb(255,255,255)" fill-rule="nonzero" />
+</svg>

src/views/dataLibrary/components/dataChartSwitchBox/chart.svg

+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none">
+	<rect id="icon_图表1 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="矢量 461" d="M11.9004 5.50781C11.4904 5.50781 11.1504 5.84781 11.1504 6.25781L11.1504 14.2578C11.1504 14.6678 11.4904 15.0078 11.9004 15.0078C12.3104 15.0078 12.6504 14.6678 12.6504 14.2578L12.6504 6.25781C12.6504 5.84781 12.3104 5.50781 11.9004 5.50781ZM8.00039 2.50781C7.59039 2.50781 7.25039 2.84781 7.25039 3.25781L7.25039 14.2578C7.25039 14.6678 7.59039 15.0078 8.00039 15.0078C8.41039 15.0078 8.75039 14.6678 8.75039 14.2578L8.75039 3.25781C8.75039 2.84781 8.41039 2.50781 8.00039 2.50781L8.00039 2.50781ZM3.90039 7.50781C3.49039 7.50781 3.15039 7.84781 3.15039 8.25781L3.15039 14.2578C3.15039 14.6678 3.49039 15.0078 3.90039 15.0078C4.31039 15.0078 4.65039 14.6678 4.65039 14.2578L4.65039 8.25781C4.65039 7.84781 4.31039 7.50781 3.90039 7.50781Z" fill="rgb(5,95,194)" fill-rule="nonzero" />
+</svg>

src/views/dataLibrary/components/dataChartSwitchBox/data-acitve.svg

+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none">
+	<rect id="表格(1) 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="矢量 462" d="M13.1 3L2.9 3C2.84091 3 2.78238 3.006 2.72442 3.01801C2.66646 3.03002 2.61018 3.04781 2.55559 3.07136C2.50099 3.09492 2.44912 3.1238 2.39999 3.158C2.35085 3.1922 2.30539 3.23106 2.2636 3.27459C2.22182 3.31811 2.18451 3.36547 2.15168 3.41665C2.11885 3.46784 2.09112 3.52186 2.06851 3.57873C2.04589 3.63561 2.02882 3.69423 2.01729 3.7546C2.00576 3.81498 2 3.87594 2 3.9375L2 12.0625C2 12.1241 2.00576 12.185 2.01729 12.2454C2.02882 12.3058 2.04589 12.3644 2.06851 12.4213C2.09112 12.4781 2.11885 12.5322 2.15168 12.5833C2.18451 12.6345 2.22182 12.6819 2.2636 12.7254C2.30539 12.7689 2.35085 12.8078 2.39999 12.842C2.44912 12.8762 2.50099 12.9051 2.55558 12.9286C2.61018 12.9522 2.66646 12.97 2.72442 12.982C2.78238 12.994 2.84091 13 2.9 13L13.1 13C13.1591 13 13.2176 12.994 13.2756 12.982C13.3335 12.97 13.3898 12.9522 13.4444 12.9286C13.499 12.9051 13.5509 12.8762 13.6 12.842C13.6491 12.8078 13.6946 12.7689 13.7364 12.7254C13.7782 12.6819 13.8155 12.6345 13.8483 12.5833C13.8812 12.5322 13.9089 12.4781 13.9315 12.4213C13.9541 12.3644 13.9712 12.3058 13.9827 12.2454C13.9942 12.185 14 12.1241 14 12.0625L14 3.9375C14 3.87594 13.9942 3.81498 13.9827 3.7546C13.9712 3.69423 13.9541 3.63561 13.9315 3.57873C13.9089 3.52186 13.8812 3.46784 13.8483 3.41665C13.8155 3.36547 13.7782 3.31811 13.7364 3.27459C13.6946 3.23106 13.6491 3.1922 13.6 3.158C13.5509 3.1238 13.499 3.09492 13.4444 3.07136C13.3898 3.04781 13.3335 3.03002 13.2756 3.01801C13.2176 3.006 13.1591 3 13.1 3ZM2.9 5.03125L5.75 5.03125L5.75 6.75L2.9 6.75L2.9 5.03125ZM2.9 7.6875L5.75 7.6875L5.75 9.40625L2.9 9.40625L2.9 7.6875ZM9.35 10.3438L9.35 12.0625L6.65 12.0625L6.65 10.3438L9.35 10.3438ZM6.65 9.40625L6.65 7.6875L9.35 7.6875L9.35 9.40625L6.65 9.40625ZM9.35 6.75L6.65 6.75L6.65 5.03125L9.35 5.03125L9.35 6.75ZM10.25 7.6875L13.1 7.6875L13.1 9.40625L10.25 9.40625L10.25 7.6875ZM10.25 6.75L10.25 5.03125L13.1 5.03125L13.1 6.75L10.25 6.75ZM2.9 10.3438L5.75 10.3438L5.75 12.0625L2.9 12.0625L2.9 10.3438ZM10.25 12.0625L10.25 10.3438L13.1 10.3438L13.1 12.0625L10.25 12.0625Z" fill="rgb(255,255,255)" fill-rule="nonzero" />
+</svg>

src/views/dataLibrary/components/dataChartSwitchBox/data.svg

+<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none">
+	<rect id="表格(1) 1" width="16.000000" height="16.000000" x="0.000000" y="0.000000" />
+	<path id="矢量 462" d="M13.1 3L2.9 3C2.84091 3 2.78238 3.006 2.72442 3.01801C2.66646 3.03002 2.61018 3.04781 2.55559 3.07136C2.50099 3.09492 2.44912 3.1238 2.39999 3.158C2.35085 3.1922 2.30539 3.23106 2.2636 3.27459C2.22182 3.31811 2.18451 3.36547 2.15168 3.41665C2.11885 3.46784 2.09112 3.52186 2.06851 3.57873C2.04589 3.63561 2.02882 3.69423 2.01729 3.7546C2.00576 3.81498 2 3.87594 2 3.9375L2 12.0625C2 12.1241 2.00576 12.185 2.01729 12.2454C2.02882 12.3058 2.04589 12.3644 2.06851 12.4213C2.09112 12.4781 2.11885 12.5322 2.15168 12.5833C2.18451 12.6345 2.22182 12.6819 2.2636 12.7254C2.30539 12.7689 2.35085 12.8078 2.39999 12.842C2.44912 12.8762 2.50099 12.9051 2.55558 12.9286C2.61018 12.9522 2.66646 12.97 2.72442 12.982C2.78238 12.994 2.84091 13 2.9 13L13.1 13C13.1591 13 13.2176 12.994 13.2756 12.982C13.3335 12.97 13.3898 12.9522 13.4444 12.9286C13.499 12.9051 13.5509 12.8762 13.6 12.842C13.6491 12.8078 13.6946 12.7689 13.7364 12.7254C13.7782 12.6819 13.8155 12.6345 13.8483 12.5833C13.8812 12.5322 13.9089 12.4781 13.9315 12.4213C13.9541 12.3644 13.9712 12.3058 13.9827 12.2454C13.9942 12.185 14 12.1241 14 12.0625L14 3.9375C14 3.87594 13.9942 3.81498 13.9827 3.7546C13.9712 3.69423 13.9541 3.63561 13.9315 3.57873C13.9089 3.52186 13.8812 3.46784 13.8483 3.41665C13.8155 3.36547 13.7782 3.31811 13.7364 3.27459C13.6946 3.23106 13.6491 3.1922 13.6 3.158C13.5509 3.1238 13.499 3.09492 13.4444 3.07136C13.3898 3.04781 13.3335 3.03002 13.2756 3.01801C13.2176 3.006 13.1591 3 13.1 3ZM2.9 5.03125L5.75 5.03125L5.75 6.75L2.9 6.75L2.9 5.03125ZM2.9 7.6875L5.75 7.6875L5.75 9.40625L2.9 9.40625L2.9 7.6875ZM9.35 10.3438L9.35 12.0625L6.65 12.0625L6.65 10.3438L9.35 10.3438ZM6.65 9.40625L6.65 7.6875L9.35 7.6875L9.35 9.40625L6.65 9.40625ZM9.35 6.75L6.65 6.75L6.65 5.03125L9.35 5.03125L9.35 6.75ZM10.25 7.6875L13.1 7.6875L13.1 9.40625L10.25 9.40625L10.25 7.6875ZM10.25 6.75L10.25 5.03125L13.1 5.03125L13.1 6.75L10.25 6.75ZM2.9 10.3438L5.75 10.3438L5.75 12.0625L2.9 12.0625L2.9 10.3438ZM10.25 12.0625L10.25 10.3438L13.1 10.3438L13.1 12.0625L10.25 12.0625Z" fill="rgb(5,95,194)" fill-rule="nonzero" />
+</svg>

src/views/dataLibrary/components/dataChartSwitchBox/index.vue

+<template>
+  <div class="data-chart-switch-box-wrapper">
+    <div class="item" :class="{ 'item-acitve': isShowData }">
+      <div class="icon">
+        <img src="./data-acitve.svg" alt="" v-if="isShowData">
+        <img src="./data.svg" alt="" v-else>
+      </div>
+      <div class="text text-tip-1" :class="{ 'text-active': isShowData }">{{ "数据" }}</div>
+    </div>
+    <div class="item" :class="{ 'item-acitve': !isShowData }">
+      <div class="icon">
+        <img src="./chart.svg" alt="" v-if="isShowData">
+        <img src="./chart-active.svg" alt="" v-else>
+      </div>
+      <div class="text text-tip-1" :class="{ 'text-active': !isShowData }">{{ "图表" }}</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+
+const props = defineProps({
+  isShowData: {
+    type: Boolean,
+    default: true
+  }
+})
+
+
+</script>
+
+<style lang="scss" scoped>
+.data-chart-switch-box-wrapper {
+  width: 160px;
+  height: 28px;
+  border: 1px solid var(--color-primary-100);
+  display: flex;
+  border-radius: 20px;
+  overflow: hidden;
+
+  .item-acitve {
+    background: var(--color-primary-100);
+  }
+
+  .item {
+    width: 80px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+
+
+    .icon {
+      width: 16px;
+      height: 16px;
+
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+
+    .text {
+      color: var(--color-primary-100);
+    }
+
+    .text-active {
+      color: var(--bg-white-100) !important;
+    }
+  }
+}
+</style>
\ No newline at end of file

src/views/dataLibrary/decree/index.vue

@@ -47,7 +47,7 @@
     <div class="chart-main-box" v-if="isShowChart">
       <div class="info-box">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -82,7 +82,7 @@
     <div class="data-main-box" v-else>
       <div class="data-main-box-header">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -177,6 +177,7 @@ import PieChart from '../components/PieChart/index.vue'
 import BarChart from '../components/BarChart/index.vue'
 import RaderChart from '../components/RadarChart/idnex.vue'
 import SelectBox from '../components/SelectBox/index.vue'
+import DataChartSwitchBox from '../components/dataChartSwitchBox/index.vue'
 import { useRoute } from "vue-router";
 import router from '@/router'
 
@@ -773,7 +774,17 @@ const fetchTableData = async () => {
 
     setTimeout(() => {
       activeChart.value = curDemensionItem.chartTypeList[0]
+      if (curDemension.value === '发布时间') {
+        if (selectedTime.value === '按月度统计') {
           curChartData.value = curDemensionItem.data
+        } else if (selectedTime.value === '按季度统计') {
+          curChartData.value = curDemensionItem.quatarData
+        } else {
+          curChartData.value = curDemensionItem.yearData
+        }
+      } else {
+        curChartData.value = curDemensionItem.data
+      }
     })
 
   } catch (error) {
@@ -1117,18 +1128,25 @@ onMounted(async () => {
   }
 
   .chart-main-box {
+    width: 1568px;
+    height: 809px;
+    margin: 0 auto;
+    background: rgba(255, 255, 255);
+    border: 1px solid var(--bg-black-5);
+    border-radius: 10px;
+
     .info-box {
       margin: 0 auto;
-      width: 1568px;
+      margin-top: 16px;
+      width: 1520px;
       height: 30px;
       display: flex;
       justify-content: space-between;
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
 
         img {
@@ -1145,14 +1163,13 @@ onMounted(async () => {
     .content-box {
       margin: 0 auto;
       margin-top: 16px;
-      width: 1568px;
-      height: 766px;
-      border-radius: 10px;
-      background: rgba(255, 255, 255);
-      border: 1px solid var(--bg-black-5);
+      width: 1520px;
+      height: 726px;
+      border: none;
+
 
       .content-header {
-        margin: 16px 24px;
+        margin: 16px 0;
         width: 1520px;
         height: 28px;
       }
@@ -1182,9 +1199,8 @@ onMounted(async () => {
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
 
         img {

src/views/dataLibrary/exportControl/commerceControlList/index.vue

@@ -29,7 +29,7 @@
     <div class="chart-main-box" v-if="isShowChart">
       <div class="info-box">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -64,7 +64,7 @@
     <div class="data-main-box" v-else>
       <div class="data-main-box-header">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -153,6 +153,7 @@ import BarChart from '../../components/BarChart/index.vue'
 import RaderChart from '../../components/RadarChart/idnex.vue'
 import SelectBox from '../../components/SelectBox/index.vue'
 import InputBox from '../../components/InputBox/index.vue'
+import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
 import { useRoute } from "vue-router";
 import router from '@/router'
 
@@ -682,7 +683,17 @@ const fetchTableData = async () => {
 
     setTimeout(() => {
       activeChart.value = curDemensionItem.chartTypeList[0]
+      if (curDemension.value === '制裁时间') {
+        if (selectedTime.value === '按月度统计') {
           curChartData.value = curDemensionItem.data
+        } else if (selectedTime.value === '按季度统计') {
+          curChartData.value = curDemensionItem.quatarData
+        } else {
+          curChartData.value = curDemensionItem.yearData
+        }
+      } else {
+        curChartData.value = curDemensionItem.data
+      }
     })
     loading.value = false
   } catch (error) {
@@ -1015,18 +1026,25 @@ onMounted(async () => {
   }
 
   .chart-main-box {
+    width: 1568px;
+    height: 809px;
+    margin: 0 auto;
+    background: rgba(255, 255, 255);
+    border: 1px solid var(--bg-black-5);
+    border-radius: 10px;
+
     .info-box {
       margin: 0 auto;
-      width: 1568px;
+      margin-top: 16px;
+      width: 1520px;
       height: 30px;
       display: flex;
       justify-content: space-between;
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
 
         img {
@@ -1043,14 +1061,13 @@ onMounted(async () => {
     .content-box {
       margin: 0 auto;
       margin-top: 16px;
-      width: 1568px;
-      height: 766px;
-      border-radius: 10px;
-      background: rgba(255, 255, 255);
-      border: 1px solid var(--bg-black-5);
+      width: 1520px;
+      height: 726px;
+      border: none;
+
 
       .content-header {
-        margin: 16px 24px;
+        margin: 16px 0;
         width: 1520px;
         height: 28px;
       }
@@ -1080,9 +1097,8 @@ onMounted(async () => {
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
 
         img {

src/views/dataLibrary/exportControl/commerceControlListEvent/index.vue

@@ -24,15 +24,15 @@
             @close="handleCloseCurTag(tag, index)" />
         </div>
         <div class="header-footer-right">
-          <HeaderBtnBox :isShowAll="isFolderAll" :isShowAllBtn="false" @show-all="handleSwitchFolderAll" @clear="handleClear"
-            @confirm="handleConfirm" />
+          <HeaderBtnBox :isShowAll="isFolderAll" :isShowAllBtn="false" @show-all="handleSwitchFolderAll"
+            @clear="handleClear" @confirm="handleConfirm" />
         </div>
       </div>
     </div>
     <div class="chart-main-box" v-if="isShowChart">
       <div class="info-box">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -66,7 +66,7 @@
     <div class="data-main-box" v-else>
       <div class="data-main-box-header">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -144,6 +144,7 @@ import PieChart from '../../components/PieChart/index.vue'
 import BarChart from '../../components/BarChart/index.vue'
 import RaderChart from '../../components/RadarChart/idnex.vue'
 import SelectBox from '../../components/SelectBox/index.vue'
+import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
 import { useRoute } from "vue-router";
 import router from '@/router'
 
@@ -611,7 +612,17 @@ const fetchTableData = async () => {
 
     setTimeout(() => {
       activeChart.value = curDemensionItem.chartTypeList[0]
+      if (curDemension.value === '制裁时间') {
+        if (selectedTime.value === '按月度统计') {
           curChartData.value = curDemensionItem.data
+        } else if (selectedTime.value === '按季度统计') {
+          curChartData.value = curDemensionItem.quatarData
+        } else {
+          curChartData.value = curDemensionItem.yearData
+        }
+      } else {
+        curChartData.value = curDemensionItem.data
+      }
     })
     loading.value = false
   } catch (error) {
@@ -940,18 +951,25 @@ onMounted(async () => {
   }
 
   .chart-main-box {
+    width: 1568px;
+    height: 809px;
+    margin: 0 auto;
+    background: rgba(255, 255, 255);
+    border: 1px solid var(--bg-black-5);
+    border-radius: 10px;
+
     .info-box {
       margin: 0 auto;
-      width: 1568px;
+      margin-top: 16px;
+      width: 1520px;
       height: 30px;
       display: flex;
       justify-content: space-between;
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
 
         img {
@@ -968,14 +986,13 @@ onMounted(async () => {
     .content-box {
       margin: 0 auto;
       margin-top: 16px;
-      width: 1568px;
-      height: 766px;
-      border-radius: 10px;
-      background: rgba(255, 255, 255);
-      border: 1px solid var(--bg-black-5);
+      width: 1520px;
+      height: 726px;
+      border: none;
+
 
       .content-header {
-        margin: 16px 24px;
+        margin: 16px 0;
         width: 1520px;
         height: 28px;
       }
@@ -1005,9 +1022,8 @@ onMounted(async () => {
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
 
         img {

src/views/dataLibrary/exportControl/entityList/index.vue

@@ -49,7 +49,7 @@
     <div class="chart-main-box" v-if="isShowChart">
       <div class="info-box">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -84,7 +84,7 @@
     <div class="data-main-box" v-else>
       <div class="data-main-box-header">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -179,6 +179,8 @@ import PieChart from '../../components/PieChart/index.vue'
 import BarChart from '../../components/BarChart/index.vue'
 import RaderChart from '../../components/RadarChart/idnex.vue'
 import SelectBox from '../../components/SelectBox/index.vue'
+import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
+
 import { useRoute } from "vue-router";
 import router from '@/router'
 
@@ -860,7 +862,17 @@ const fetchTableData = async () => {
 
     setTimeout(() => {
       activeChart.value = curDemensionItem.chartTypeList[0]
+      if (curDemension.value === '制裁时间') {
+        if (selectedTime.value === '按月度统计') {
+          curChartData.value = curDemensionItem.data
+        } else if (selectedTime.value === '按季度统计') {
+          curChartData.value = curDemensionItem.quatarData
+        } else {
+          curChartData.value = curDemensionItem.yearData
+        }
+      } else {
         curChartData.value = curDemensionItem.data
+      }
     })
     loading.value = false
   } catch (error) {
@@ -1206,24 +1218,26 @@ onMounted(async () => {
   }
 
   .chart-main-box {
+    width: 1568px;
+    height: 809px;
+    margin: 0 auto;
+    background: rgba(255, 255, 255);
+    border: 1px solid var(--bg-black-5);
+    border-radius: 10px;
+
     .info-box {
       margin: 0 auto;
-      width: 1568px;
+      margin-top: 16px;
+      width: 1520px;
       height: 30px;
       display: flex;
       justify-content: space-between;
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
-
-        img {
-          width: 100%;
-          height: 100%;
-        }
       }
 
       .num-box {
@@ -1234,14 +1248,13 @@ onMounted(async () => {
     .content-box {
       margin: 0 auto;
       margin-top: 16px;
-      width: 1568px;
-      height: 766px;
-      border-radius: 10px;
-      background: rgba(255, 255, 255);
-      border: 1px solid var(--bg-black-5);
+      width: 1520px;
+      height: 726px;
+      border: none;
+
 
       .content-header {
-        margin: 16px 24px;
+        margin: 16px 0;
         width: 1520px;
         height: 28px;
       }
@@ -1271,15 +1284,9 @@ onMounted(async () => {
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
-
-        img {
-          width: 100%;
-          height: 100%;
-        }
       }
 
       .num-box {

src/views/dataLibrary/exportControl/entityListEvent/index.vue

@@ -24,15 +24,15 @@
             @close="handleCloseCurTag(tag, index)" />
         </div>
         <div class="header-footer-right">
-          <HeaderBtnBox :isShowAll="isFolderAll" :isShowAllBtn="false" @show-all="handleSwitchFolderAll" @clear="handleClear"
-            @confirm="handleConfirm" />
+          <HeaderBtnBox :isShowAll="isFolderAll" :isShowAllBtn="false" @show-all="handleSwitchFolderAll"
+            @clear="handleClear" @confirm="handleConfirm" />
         </div>
       </div>
     </div>
     <div class="chart-main-box" v-if="isShowChart">
       <div class="info-box">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/chart-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -66,7 +66,7 @@
     <div class="data-main-box" v-else>
       <div class="data-main-box-header">
         <div class="switch-box" @click="handleSwitchChartData">
-          <img src="@/views/dataLibrary/assets/icons/data-active.svg" alt="">
+          <DataChartSwitchBox :is-show-data="!isShowChart" />
         </div>
         <div class="num-box text-title-3-bold">
           {{ `共 ${totalNum} 条数据` }}
@@ -144,6 +144,8 @@ import PieChart from '../../components/PieChart/index.vue'
 import BarChart from '../../components/BarChart/index.vue'
 import RaderChart from '../../components/RadarChart/idnex.vue'
 import SelectBox from '../../components/SelectBox/index.vue'
+import DataChartSwitchBox from '../../components/dataChartSwitchBox/index.vue'
+
 import { useRoute } from "vue-router";
 import router from '@/router'
 
@@ -611,7 +613,17 @@ const fetchTableData = async () => {
 
     setTimeout(() => {
       activeChart.value = curDemensionItem.chartTypeList[0]
+      if (curDemension.value === '制裁时间') {
+        if (selectedTime.value === '按月度统计') {
           curChartData.value = curDemensionItem.data
+        } else if (selectedTime.value === '按季度统计') {
+          curChartData.value = curDemensionItem.quatarData
+        } else {
+          curChartData.value = curDemensionItem.yearData
+        }
+      } else {
+        curChartData.value = curDemensionItem.data
+      }
     })
     loading.value = false
   } catch (error) {
@@ -956,18 +968,25 @@ onMounted(async () => {
   }
 
   .chart-main-box {
+    width: 1568px;
+    height: 809px;
+    margin: 0 auto;
+    background: rgba(255, 255, 255);
+    border: 1px solid var(--bg-black-5);
+    border-radius: 10px;
+
     .info-box {
       margin: 0 auto;
-      width: 1568px;
+      margin-top: 16px;
+      width: 1520px;
       height: 30px;
       display: flex;
       justify-content: space-between;
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
 
         img {
@@ -984,14 +1003,13 @@ onMounted(async () => {
     .content-box {
       margin: 0 auto;
       margin-top: 16px;
-      width: 1568px;
-      height: 766px;
-      border-radius: 10px;
-      background: rgba(255, 255, 255);
-      border: 1px solid var(--bg-black-5);
+      width: 1520px;
+      height: 726px;
+      border: none;
+
 
       .content-header {
-        margin: 16px 24px;
+        margin: 16px 0;
         width: 1520px;
         height: 28px;
       }
@@ -1021,9 +1039,8 @@ onMounted(async () => {
 
       .switch-box {
         width: 160px;
-        border-radius: 20px;
-        border: 1px solid var(--color-primary-100);
-        height: 30px;
+        height: 28px;
+        border: none;
         cursor: pointer;
 
         img {