feat: dashbord

components/cwg-charts.vue

@@ -457,7 +457,7 @@ export default {
         this.mixinDatacomLoading = false;
         this.showchart = true;
         this.checkData(this.chartData);
-      } else if (this.localdata.length > 0) {
+      } else if (this.localdata?.length > 0) {
         this.mixinDatacomLoading = false;
         this.showchart = true;
         this.localdataInit(this.localdata);
@@ -641,7 +641,7 @@ export default {
         .select('#ChartBoxId' + this.cid)
         .boundingClientRect(data => {
           this.showchart = true;
-          if (data.width > 0 && data.height > 0) {
+          if (data?.width > 0 && data?.height > 0) {
             if (data.width !== this.cWidth || data.height !== this.cHeight) {
               this.checkData(this.drawData)
             }
@@ -653,17 +653,17 @@ export default {
       if (this.mixinDatacomLoading == true) {
         return;
       }
-      this.mixinDatacomLoading = true;
-      this.mixinDatacomGet()
-        .then(res => {
-          this.mixinDatacomResData = res.result.data;
-          this.localdataInit(this.mixinDatacomResData);
-        })
-        .catch(err => {
-          this.mixinDatacomLoading = false;
-          this.showchart = false;
-          this.mixinDatacomErrorMessage = '请求错误：' + err;
-        });
+      // this.mixinDatacomLoading = true;
+      // this.mixinDatacomGet()
+      //   .then(res => {
+      //     this.mixinDatacomResData = res.result.data;
+      //     this.localdataInit(this.mixinDatacomResData);
+      //   })
+      //   .catch(err => {
+      //     this.mixinDatacomLoading = false;
+      //     this.showchart = false;
+      //     this.mixinDatacomErrorMessage = '请求错误：' + err;
+      //   });
     },
     onMixinDatacomPropsChange(needReset, changed) {
       if (needReset == true && this.collection !== '') {

pages/customer/dashboard.vue

@@ -2,8 +2,8 @@
   <cwg-page-wrapper class="create-page" :isHeaderFixed="true">
     <view class="header">
       <view class="title">
-        <view class="mb-3">{{t('Home.msg.Custom')}}</view>
-        <view class="">{{dateWeek}}</view>
+        <view class="mb-3">{{ t('Home.msg.Custom') }}</view>
+        <view class="">{{ dateWeek }}</view>
       </view>
 
       <button type="button" class="btn  btn-secondary  btn-shadow waves-effect"
@@ -16,7 +16,7 @@
     </view>
     <uni-loading v-if="loading" />
     <uni-row v-else class="demo-uni-row uni-row1" :gutter="20">
-      <uni-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" >
+      <uni-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
         <uni-row :gutter="10">
           <uni-col :xs="24" :sm="12" :md="12" :lg="6" :xl="6">
             <view class="card position-relative">
@@ -27,8 +27,10 @@
                 <view class="flex-1">
                   <view class="d-flex justify-between items-start mb-1">
                     <text class="text-muted text-sm">Total Balance</text>
-                    <text :class="['growth-rate', compareData.totalBalanceGrowthRate||0 >= 0 ? 'rate-up' : 'rate-down']">
-                      {{ compareData.totalBalanceGrowthRate||0 >= 0 ? '+' : '' }}{{ compareData.totalBalanceGrowthRate || 0 }}%
+                    <text
+                      :class="['growth-rate', compareData.totalBalanceGrowthRate||0 >= 0 ? 'rate-up' : 'rate-down']">
+                      {{ compareData.totalBalanceGrowthRate || 0 >= 0 ? '+' : ''
+                      }}{{ compareData.totalBalanceGrowthRate || 0 }}%
                     </text>
                   </view>
                   <view class="fw-bold text-lg">${{ numberFormat(compareData.totalBalance || '0') }}</view>
@@ -46,7 +48,8 @@
                   <view class="d-flex justify-between items-start mb-1">
                     <text class="text-muted text-sm">Equity</text>
                     <text :class="['growth-rate', compareData.totalEquityGrowthRate ||0>= 0 ? 'rate-up' : 'rate-down']">
-                      {{ compareData.totalEquityGrowthRate||0 >= 0 ? '+' : '' }}{{ compareData.totalEquityGrowthRate|| 0 }}%
+                      {{ compareData.totalEquityGrowthRate || 0 >= 0 ? '+' : ''
+                      }}{{ compareData.totalEquityGrowthRate || 0 }}%
                     </text>
                   </view>
                   <view class="fw-bold text-lg">${{ numberFormat(compareData.totalEquity || '0') }}</view>
@@ -63,8 +66,10 @@
                 <view class="flex-1">
                   <view class="d-flex justify-between items-start mb-1">
                     <text class="text-muted text-sm">Total deposit</text>
-                    <text :class="['growth-rate', compareData.totalDepositAmountGrowthRate ||0 >= 0 ? 'rate-up' : 'rate-down']">
-                      {{ compareData.totalDepositAmountGrowthRate||0 >= 0 ? '+' : '' }}{{ compareData.totalDepositAmountGrowthRate|| 0 }}%
+                    <text
+                      :class="['growth-rate', compareData.totalDepositAmountGrowthRate ||0 >= 0 ? 'rate-up' : 'rate-down']">
+                      {{ compareData.totalDepositAmountGrowthRate || 0 >= 0 ? '+' : ''
+                      }}{{ compareData.totalDepositAmountGrowthRate || 0 }}%
                     </text>
                   </view>
                   <view class="fw-bold text-lg">${{ numberFormat(compareData.totalDepositAmount || '0') }}</view>
@@ -81,8 +86,10 @@
                 <view class="flex-1">
                   <view class="d-flex justify-between items-start mb-1">
                     <text class="text-muted text-sm">Total withdrawal</text>
-                    <text :class="['growth-rate', compareData.totalWithdrawalAmountGrowthRate||0 >= 0 ? 'rate-up' : 'rate-down']">
-                      {{ compareData.totalWithdrawalAmountGrowthRate||0 >= 0 ? '+' : '' }}{{ compareData.totalWithdrawalAmountGrowthRate|| 0 }}%
+                    <text
+                      :class="['growth-rate', compareData.totalWithdrawalAmountGrowthRate||0 >= 0 ? 'rate-up' : 'rate-down']">
+                      {{ compareData.totalWithdrawalAmountGrowthRate || 0 >= 0 ? '+' : ''
+                      }}{{ compareData.totalWithdrawalAmountGrowthRate || 0 }}%
                     </text>
                   </view>
                   <view class="fw-bold text-lg">${{ numberFormat(compareData.totalWithdrawalAmount || '0') }}</view>
@@ -96,38 +103,52 @@
         <uni-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
           <view class="chart-box crm-border-radius">
             <view class="chart-title">
-              <view class="time" @click="toReload">
-                <cwg-icon name="crm-refresh" :size="16" color="#666" />
-                <text class="crm-cursor"> GMT+3 {{ time }}</text>
-              </view>
-              <view class="title">
-                <view class="name">
-                  <text v-if="chartForm.chartType == 4">{{ t('Custom.Index.TradingVolumeStatistics') }}</text>
-                  <text v-if="chartForm.chartType == 2">{{ t('Custom.Index.DepositStatistical') }}</text>
-                  <text v-if="chartForm.chartType == 3">{{ t('Custom.Index.WithdrawalsStatistical') }}</text>
-                  <text v-if="chartForm.chartType == 6">{{ t('Custom.Index.ProfitLoss') }}</text>
-                </view>
-                <view class="account" v-if="chartForm.login">
-                  <text>{{ t('Custom.Index.TradingAccount') }}</text>
-                  <text> — </text>
-                  <text>{{ chartForm.login }}</text>
-                </view>
-                <view class="date">
-                  <uni-datetime-picker
-                    v-model="isDate"
-                    type="daterange"
-                    :placeholder="t('placeholder.Start') + ' - ' + t('placeholder.End')"
-                    @change="getSearchDate"
-                  />
-                </view>
-              </view>
-              <view class="operation" @click="isChart = true">
-                <text style="font-size: 14px">{{ t('Custom.Index.Parameter') }}</text>
-                <cwg-icon name="iconcanshu" :size="16" color="#666" />
-              </view>
+              <uni-row>
+                <uni-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                  <view class="time" @click="toReload">
+                    <cwg-icon name="crm-refresh" :size="16" color="#666" />
+                    <text class="crm-cursor"> GMT+3 {{ time }}</text>
+                  </view>
+                </uni-col>
+                <uni-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                  <view class="title">
+                    <view class="name">
+                      <text v-if="chartForm.chartType == 4">{{ t('Custom.Index.TradingVolumeStatistics') }}</text>
+                      <text v-if="chartForm.chartType == 2">{{ t('Custom.Index.DepositStatistical') }}</text>
+                      <text v-if="chartForm.chartType == 3">{{ t('Custom.Index.WithdrawalsStatistical') }}</text>
+                      <text v-if="chartForm.chartType == 6">{{ t('Custom.Index.ProfitLoss') }}</text>
+                    </view>
+                    <view class="account" v-if="chartForm.login">
+                      <text>{{ t('Custom.Index.TradingAccount') }}</text>
+                      <text> —</text>
+                      <text>{{ chartForm.login }}</text>
+                    </view>
+                    <view class="date">
+                      <uni-datetime-picker
+                        v-model="isDate"
+                        type="daterange"
+                        :placeholder="t('placeholder.Start') + ' - ' + t('placeholder.End')"
+                        @change="getSearchDate"
+                      />
+                    </view>
+                  </view>
+                </uni-col>
+                <uni-col :xs="24" :sm="24" :md="8" :lg="8" :xl="8">
+                  <view class="operation" @click="isChart = true">
+                    <text style="font-size: 14px">{{ t('Custom.Index.Parameter') }}</text>
+                    <cwg-icon name="iconcanshu" :size="16" color="#666" />
+                  </view>
+                </uni-col>
+              </uni-row>
             </view>
+            {{isMobile}}
             <view class="chart-container">
-              <cwg-charts type="line" :chartData="chartData" />
+              <cwg-match-media :max-width="991">
+              <cwg-charts type="line" :chartData="chartData" :opts="chartOpts" tooltipFormat="tooltipCustom" ontouch />
+              </cwg-match-media>
+              <cwg-match-media :min-width="991">
+              <cwg-charts type="line" :chartData="chartData" :opts="chartOpts" tooltipFormat="tooltipCustom"  />
+              </cwg-match-media>
             </view>
           </view>
         </uni-col>
@@ -135,7 +156,8 @@
     </uni-row>
     <cwg-improve-popup v-model:visible="dialogCheck" @confirm="confirm" />
 
-    <cwg-popup v-model:visible="isChart" type="center" :mask-click="false" :show-footers="true" :title="t('Custom.Index.ChartSet')">
+    <cwg-popup v-model:visible="isChart" type="center" :mask-click="false" :show-footers="true"
+               :title="t('Custom.Index.ChartSet')">
       <view class="dia-content">
         <uni-forms ref="chartFormRef" labelWidth="160">
           <uni-forms-item :label="t('Label.ChartType') + ':'" prop="chartType">
@@ -173,739 +195,804 @@
 </template>
 
 <script setup>
-import { ref, computed, watch, onMounted, nextTick } from 'vue'
-import { useI18n } from 'vue-i18n'
-import dayjs from 'dayjs'
-import useRouter from '@/hooks/useRouter'
-import { ibApi } from '@/service/ib'
-import config from '@/config/index'
-import useUserStore from '@/stores/use-user-store'
-import { useStorage } from '@/hooks/useStorage'
-import QrCode from '@/components/QrCode.vue'
-import { useFilters } from '@/composables/useFilters'
-import { isAfterJuly28 } from '@/utils/dateUtils'
-import { documentaryApi } from '@/service/documentary'
-import { customApi } from '@/service/custom'
-import { userApi } from '@/api/user'
-
-const { t, locale } = useI18n()
-const loading = ref(false)
-const router = useRouter()
-const { Code } = config
-const userStore = useUserStore();
-const { numberFormat } = useFilters()
-const listApi = ref(documentaryApi.followDailySubscribeProfit)
-
-
-const loginOptions = ref([])
-const ChartSetDate = ref({})
-const isDealLogin = ref(false)
-const dealDate = ref({})
-const SubscribeProfitDate = ref([])
-const compareData = ref({})
-
-const isChart = ref(false)
-const isDate = ref(['', ''])
-const time = ref('')
-const chartData = ref({ categories: [], series: [] })
-const dropDown = ref([])
-const chartFormRef = ref(null)
-
-const chartForm = ref({
-  chartType: '',
-  platform: '',
-  login: ''
-})
-
-const chartTypeOptions = ref([
-  { text: 'Trading Volume Statistics', value: 4 },
-  { text: 'Deposit Statistical', value: 2 },
-  { text: 'Withdrawals Statistical', value: 3 },
-  { text: 'Profit Loss', value: 6 }
-])
-
-const platformOptions = [
-  { text: 'MT4', value: 'MT4' },
-  { text: 'MT5', value: 'MT5' }
-]
-
-const getLocalTime = () => {
-  const now = new Date()
-  const year = now.getFullYear()
-  const month = String(now.getMonth() + 1).padStart(2, '0')
-  const day = String(now.getDate()).padStart(2, '0')
-  const hh = String(now.getHours()).padStart(2, '0')
-  const mm = String(now.getMinutes()).padStart(2, '0')
-  time.value = `${year}/${month}/${day} ${hh}:${mm}`
-}
-
-const toReload = () => {
-  getLocalTime()
-  fetchChartData()
-}
-
-const getSearchDate = (val) => {
-  if (Array.isArray(val)) {
-    isDate.value = val
-  }
-  fetchChartData()
-}
-
-const onPlatformChange = (val) => {
-  console.log('Platform changed:', val)
-}
-
-const handleChartConfirm = async () => {
-  try {
-    const params = {
-      type: chartForm.value.chartType || 4,
-      platform: chartForm.value.platform,
-      login: chartForm.value.login,
-      startDate: isDate.value[0],
-      endDate: isDate.value[1]
+  import { ref, computed, watch, onMounted, nextTick,onUnmounted } from 'vue'
+  import { useI18n } from 'vue-i18n'
+  import dayjs from 'dayjs'
+  import useRouter from '@/hooks/useRouter'
+  import config from '@/config/index'
+  import useUserStore from '@/stores/use-user-store'
+  import { useStorage } from '@/hooks/useStorage'
+  import { useFilters } from '@/composables/useFilters'
+  import { documentaryApi } from '@/service/documentary'
+  import { customApi } from '@/service/custom'
+  import { userApi } from '@/api/user'
+
+  const { t, locale } = useI18n()
+  const loading = ref(false)
+  const router = useRouter()
+  const { Code } = config
+  const userStore = useUserStore()
+  const { numberFormat } = useFilters()
+  const listApi = ref(documentaryApi.followDailySubscribeProfit)
+
+
+  const loginOptions = ref([])
+  const ChartSetDate = ref({})
+  const isDealLogin = ref(false)
+  const dealDate = ref({})
+  const SubscribeProfitDate = ref([])
+  const compareData = ref({})
+
+  const isChart = ref(false)
+  const isDate = ref(['', ''])
+  const time = ref('')
+  const chartData = ref({ categories: [], series: [] })
+  const chartOpts = ref({
+    color: ['#1890FF', '#91CB74', '#FAC858', '#EE6666', '#73C0DE', '#3CA272', '#FC8452', '#9A60B4', '#ea7ccc'],
+    padding: [15, 10, 0, 15],
+    enableScroll: true,
+    legend: {
+      show: false,
+    },
+    xAxis: {
+      // disableGrid: true,
+      scrollShow: true,
+      itemCount: 4,
+    },
+    tooltipFormat: 'tooltipCustom',
+    extra: {
+      line: {
+        type: 'straight',
+        width: 2,
+        activeType: 'hollow',
+      },
+      tooltip: {
+        legendShow: false,
+        // showCategory: true,
+        formatter: 'tooltipCustom',
+      },
+    },
+  })
+  const dropDown = ref([])
+  const chartFormRef = ref(null)
+
+  const chartForm = ref({
+    chartType: 4,
+    platform: '',
+    login: '',
+  })
+
+  const chartTypeOptions = ref([
+    { text: 'Trading Volume Statistics', value: 4 },
+    { text: 'Deposit Statistical', value: 2 },
+    { text: 'Withdrawals Statistical', value: 3 },
+    { text: 'Profit Loss', value: 6 },
+  ])
+
+  const platformOptions = [
+    { text: 'MT4', value: 'MT4' },
+    { text: 'MT5', value: 'MT5' },
+  ]
+
+  const getLocalTime = () => {
+    let timezone = 2 //目标时区时间，东2区   东时区正数 西市区负数
+    let offset_GMT = new Date().getTimezoneOffset() // 本地时间和格林威治的时间差，单位为分钟
+    let nowDate = new Date().getTime() // 本地时间距 1970 年 1 月 1 日午夜（GMT 时间）之间的毫秒数
+    let now = new Date(
+      nowDate + offset_GMT * 60 * 1000 + timezone * 60 * 60 * 1000,
+    )
+
+    //当前时间
+    let month = now.getMonth() + 1 //月
+    let day = now.getDate() //日
+    let hh = now.getHours() //时
+    let mm = now.getMinutes() //分
+    let clock
+    if (month < 10) {
+      month = '0' + month
     }
-    const res = await customApi.getChartInfo(params)
-    if (res.code === Code.StatusOK) {
-      if (res.data) {
-        let categories = []
-        let seriesData = []
-        res.data.forEach((item) => {
-          categories.push(item.date.split(' ')[0])
-          seriesData.push(item.amount !== null ? item.amount : item.doubleAmount)
-        })
-        chartData.value = { categories, series: seriesData }
-      } else {
-        chartData.value = { categories: [], series: [] }
+    if (day < 10) {
+      day = '0' + day
+    }
+    if (hh < 10) {
+      hh = '0' + hh
+    }
+    if (mm < 10) {
+      mm = '0' + mm
+    }
+    clock = '  ' + hh + ':' + mm + '  ' + month + '/' + day
+    time.value = clock
+  }
+
+  const toReload = () => {
+    goTime()
+  }
+
+  const getSearchDate = (val) => {
+    if (Array.isArray(val)) {
+      isDate.value = val
+    }
+    fetchChartData()
+  }
+
+  const onPlatformChange = (val) => {
+    console.log('Platform changed:', val)
+  }
+
+  const handleChartConfirm = async () => {
+    try {
+      const params = {
+        type: chartForm.value.chartType || 4,
+        platform: chartForm.value.platform,
+        login: chartForm.value.login,
+        startDate: isDate.value[0],
+        endDate: isDate.value[1],
+      }
+      const res = await customApi.getChartInfo(params)
+      if (res.code === Code.StatusOK) {
+        if (res.data) {
+          let categories = []
+          let seriesData = []
+          res.data.forEach((item) => {
+            categories.push(item.date.split(' ')[0])
+            seriesData.push(item.amount)
+          })
+          chartData.value = { categories, series: [{ name: '', data: seriesData }] }
+        } else {
+          chartData.value = { categories: [], series: [] }
+        }
       }
+      isChart.value = false
+    } catch (error) {
+      console.error('获取图表数据失败', error)
+      isChart.value = false
     }
-    isChart.value = false
-  } catch (error) {
-    console.error('获取图表数据失败', error)
-    isChart.value = false
-  }
-}
-
-const fetchChartData = async () => {
-  try {
-    const params = {
-      type: chartForm.value.chartType || 4,
-      platform: chartForm.value.platform,
-      login: chartForm.value.login,
-      startDate: isDate.value[0],
-      endDate: isDate.value[1]
+  }
+
+  const fetchChartData = async () => {
+    try {
+      const params = {
+        type: chartForm.value.chartType || 4,
+        platform: chartForm.value.platform,
+        login: chartForm.value.login,
+        startDate: isDate.value[0],
+        endDate: isDate.value[1],
+      }
+      const res = await customApi.getChartInfo(params)
+      if (res.code === Code.StatusOK) {
+        if (res.data) {
+          let categories = []
+          let seriesData = []
+          res.data.forEach((item) => {
+            categories.push(item.date.split(' ')[0])
+            seriesData.push(item.amount)
+          })
+          chartData.value = { categories, series: [{ name: '', data: seriesData }] }
+        } else {
+          chartData.value = { categories: [], series: [] }
+        }
+      }
+    } catch (error) {
+      console.error('获取图表数据失败', error)
     }
-    const res = await customApi.getChartInfo(params)
-    if (res.code === Code.StatusOK) {
-      if (res.data) {
-        let categories = []
-        let seriesData = []
-        res.data.forEach((item) => {
-          categories.push(item.date.split(' ')[0])
-          seriesData.push(item.amount !== null ? item.amount : item.doubleAmount)
-        })
-        chartData.value = { categories, series: seriesData }
-      } else {
-        chartData.value = { categories: [], series: [] }
+  }
+
+  const getDropDown = async () => {
+    try {
+      const res = await customApi.CustomDropdown()
+      if (res.code === Code.StatusOK) {
+        dropDown.value = res.data || []
+        loginOptions.value = (res.data || []).map(item => ({
+          text: item.login,
+          value: item.login,
+        }))
       }
+    } catch (error) {
+      console.error('获取账户列表失败', error)
     }
-  } catch (error) {
-    console.error('获取图表数据失败', error)
   }
-}
 
-const getDropDown = async () => {
-  try {
-    const res = await customApi.CustomDropdown()
-    if (res.code === Code.StatusOK) {
-      dropDown.value = res.data || []
-      loginOptions.value = (res.data || []).map(item => ({
-        text: item.login,
-        value: item.login
-      }))
+
+  const groupTypeName = (type) => {
+    if (!type) return '--'
+    if (type == 1) return t('AccountType.ClassicAccount')
+    if (type == 2) return t('AccountType.SeniorAccount')
+    if (type == 5) return t('AccountType.SpeedAccount')
+    if (type == 6) return t('AccountType.SpeedAccount')
+    if (type == 7) return t('AccountType.StandardAccount')
+    if (type == 8) return t('AccountType.CentAccount')
+    return type
+  }
+
+  const groupCurrency = (type) => {
+    console.log(type, 'usd')
+    if (type == 'GBP') {
+      return ': £'
+    } else if (type == 'USD') {
+      return ': $'
+    } else if (type == 'EUR') {
+      return ': €'
+    } else if (type == 'USC') {
+      return ': ￠'
+    } else {
+      return ': $'
     }
-  } catch (error) {
-    console.error('获取账户列表失败', error)
-  }
-}
-
-
-const groupTypeName = (type) => {
-  if (!type) return '--'
-  if (type == 1) return t('AccountType.ClassicAccount')
-  if (type == 2) return t('AccountType.SeniorAccount')
-  if (type == 5) return t('AccountType.SpeedAccount')
-  if (type == 6) return t('AccountType.SpeedAccount')
-  if (type == 7) return t('AccountType.StandardAccount')
-  if (type == 8) return t('AccountType.CentAccount')
-  return type
-}
-
-const groupCurrency = (type) => {
-  console.log(type, 'usd')
-  if (type == 'GBP') {
-    return ': £'
-  } else if (type == 'USD') {
-    return ': $'
-  } else if (type == 'EUR') {
-    return ': €'
-  } else if (type == 'USC') {
-    return ': ￠'
-  } else {
-    return ': $'
-  }
-}
-
-const groupCurrency1 = (type) => {
-  if (type == "GBP") {
-    return "£";
-  } else if (type == "USD") {
-    return "$";
-  } else if (type == "EUR") {
-    return "€";
-  } else if (type == "USC") {
-    return "￠";
-  } else {
-    return "$";
-  }
-}
-
-// 今日时间
-const dateWeek = computed(() => {
-  const now = dayjs()
-  const isChinese = locale.value === 'cn' || locale.value === 'zhHant'
-  
-  if (isChinese) {
-    const weekDays = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
-    const months = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
-    return `${weekDays[now.day()]}, ${months[now.month()]}${now.date()}日, ${now.year()}`
-  } else {
-    return now.format('ddd, MMMD, YYYY')
-  }
-})
-
-
-const createAccount = () => {
-  getCustomLoginInfo()
-}
-// 获取客户登录信息
-const dialogCheck = ref(false)
-async function getCustomLoginInfo() {
-  try {
-    const res = await userApi.getUserInfo();
-    userStore.saveUserInfo(res.data);
-    if (res.code === 200) {
-      if (
-        res.data.customInfo.status == 2 &&
-        res.data.customInfo.applyRealStatus == 2
-      ) {
-        router.push(`/pages/customer/account-select?server=${cativeIndex.value}`)
-      } else {
-        dialogCheck.value = true;
+  }
+
+  const groupCurrency1 = (type) => {
+    if (type == 'GBP') {
+      return '£'
+    } else if (type == 'USD') {
+      return '$'
+    } else if (type == 'EUR') {
+      return '€'
+    } else if (type == 'USC') {
+      return '￠'
+    } else {
+      return '$'
+    }
+  }
+
+  // 今日时间
+  const dateWeek = computed(() => {
+    const now = dayjs()
+    const isChinese = locale.value === 'cn' || locale.value === 'zhHant'
+
+    if (isChinese) {
+      const weekDays = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']
+      const months = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
+      return `${weekDays[now.day()]}, ${months[now.month()]}${now.date()}日, ${now.year()}`
+    } else {
+      return now.format('ddd, MMMD, YYYY')
+    }
+  })
+
+
+  const createAccount = () => {
+    getCustomLoginInfo()
+  }
+  // 获取客户登录信息
+  const dialogCheck = ref(false)
+
+  async function getCustomLoginInfo() {
+    try {
+      const res = await userApi.getUserInfo()
+      userStore.saveUserInfo(res.data)
+      if (res.code === 200) {
+        if (
+          res.data.customInfo.status == 2 &&
+          res.data.customInfo.applyRealStatus == 2
+        ) {
+          router.push(`/pages/customer/account-select?server=${cativeIndex.value}`)
+        } else {
+          dialogCheck.value = true
+        }
       }
+    } catch (error) {
+      //  console.log(error, 111);
     }
-  } catch (error) {
-    //  console.log(error, 111);
-  }
-}
-const confirm = () => {
-  dialogCheck.value = false;
-  router.push(`/pages/mine/improveImmediately`)
-}
-
-const handleCommand = ({ value }) => {
-  const data = { ...value.value }
-  console.log(123, data)
-
-  isDealLogin.value = data.isDealLogin
-  ChartSet.value = {
-    login: data.login,
-    leverage: '1:' + data.leverage,
-    platform: data.platform,
-    groupTypeName: data.groupTypeName,
-    type: data.type,
-    balance: data.balance,
-    currency: data.currency || '',
-  }
-}
-
-const getDailyCompare = async (login) => {
-  const res = await documentaryApi.followDailyCompare({ login })
-  if (res.code === Code.StatusOK) {
-    ChartSetDate.value = res.data ?? {}
-  } else {
-    uni.showToast({ title: res.msg, icon: 'none' })
-  }
-}
-
-const getDailyDeal = async (login) => {
-  const res = await documentaryApi.followDailyDeal({ login })
-  if (res.code === Code.StatusOK) {
-    dealDate.value = res.data ?? {}
-  } else {
-    uni.showToast({ title: res.msg, icon: 'none' })
-  }
-}
-
-const getDailySubscribeProfit = async (login) => {
-  const res = await documentaryApi.followDailySubscribeProfit({ login })
-  if (res.code === Code.StatusOK) {
-    SubscribeProfitDate.value = res.data?.data ?? []
-  } else {
-    uni.showToast({ title: res.msg, icon: 'none' })
-  }
-}
-watch(() => ChartSet.value.login, async (login) => {
-  await getDailyCompare(login)
-  if (isDealLogin.value) {
-    await getDailyDeal(login)
-  } else {
-    await getDailySubscribeProfit(login)
-  }
-})
-
-
-const toDocumentary1 = () => {
-  router.push({ path: '/pages/follow/trading-center' })
-}
-
-const isApplySignalVisible = ref(false)
-const onApplySignalConfirm = () => {
-  isApplySignalVisible.value = false
-}
-
-const getData = async () => {
-  try{
-    const res = await customApi.customDailyCompare()
+  }
+
+  const confirm = () => {
+    dialogCheck.value = false
+    router.push(`/pages/mine/improveImmediately`)
+  }
+
+  const getDailyCompare = async (login) => {
+    const res = await documentaryApi.followDailyCompare({ login })
+    if (res.code === Code.StatusOK) {
+      ChartSetDate.value = res.data ?? {}
+    } else {
+      uni.showToast({ title: res.msg, icon: 'none' })
+    }
+  }
+
+  const getDailyDeal = async (login) => {
+    const res = await documentaryApi.followDailyDeal({ login })
     if (res.code === Code.StatusOK) {
-      compareData.value = res.data
+      dealDate.value = res.data ?? {}
+    } else {
+      uni.showToast({ title: res.msg, icon: 'none' })
     }
-  }catch (e) {
-    console.log(e)
   }
-}
 
-onMounted(async () => {
-  loading.value = true
-  getLocalTime()
-  await getData()
-  await getDropDown()
-  await fetchChartData()
-  loading.value = false
-})
+  const getDailySubscribeProfit = async (login) => {
+    const res = await documentaryApi.followDailySubscribeProfit({ login })
+    if (res.code === Code.StatusOK) {
+      SubscribeProfitDate.value = res.data?.data ?? []
+    } else {
+      uni.showToast({ title: res.msg, icon: 'none' })
+    }
+  }
+  watch(() => chartForm.value.login, async (login) => {
+    await getDailyCompare(login)
+    if (isDealLogin.value) {
+      await getDailyDeal(login)
+    } else {
+      await getDailySubscribeProfit(login)
+    }
+  })
+
+  const getData = async () => {
+    try {
+      const res = await customApi.customDailyCompare()
+      if (res.code === Code.StatusOK) {
+        compareData.value = res.data
+      }
+    } catch (e) {
+      console.log(e)
+    }
+  }
+  const goTime = () => {
+    getLocalTime()
+    let timezone = 2 //目标时区时间，东2区   东时区正数 西市区负数
+    let offset_GMT = new Date().getTimezoneOffset() // 本地时间和格林威治的时间差，单位为分钟
+    let nowDate = new Date().getTime() // 本地时间距 1970 年 1 月 1 日午夜（GMT 时间）之间的毫秒数
+    let data = new Date(
+      nowDate + offset_GMT * 60 * 1000 + timezone * 60 * 60 * 1000,
+    )
+    //当月第一天和最后一天
+    let mon1 = data.setDate(1) //当月第一天
+    let mon2 = data.setMonth(data.getMonth() + 1) //下月
+    let y1 = new Date(mon1).getFullYear()
+    let m1 = new Date(mon1).getMonth() + 1
+    let d1 = new Date(mon1).getDate()
+    let y2 = new Date(mon2).getFullYear()
+    let m2 = new Date(mon2).getMonth() + 1
+    let d2 = 1
+
+    isDate.value = [
+      y1 + '-' + (m1 < 10 ? '0' + m1 : m1) + '-' + (d1 < 10 ? '0' + d1 : d1),
+      y2 + '-' + (m2 < 10 ? '0' + m2 : m2) + '-' + (d2 < 10 ? '0' + d2 : d2),
+    ]
+    fetchChartData()
+  }
+  const isMobile = ref(false)
+  onUnmounted(() => {
+    // #ifdef H5
+    window.removeEventListener('resize', handleResize)
+    // #endif
+  })
+  const chartShow = ref(true)
+  // 监听窗口大小变化（仅 H5）
+  // #ifdef H5
+  const handleResize = () => {
+    checkIsMobile()
+  }
+  // #endif
+  const checkIsMobile = () => {
+    // 适配 uni-app 环境
+    chartShow.value = false
+    const width = window.innerWidth
+    console.log(width)
+    isMobile.value = width < 991
+    chartShow.value = true
+    // #ifndef H5
+    chartShow.value = false
+    const systemInfo = uni.getSystemInfoSync()
+    isMobile.value = systemInfo.windowWidth < 991
+    chartShow.value = true
+    // #endif
+  }
+  onMounted(async () => {
+    loading.value = true
+    goTime()
+    await getData()
+    await getDropDown()
+    // await fetchChartData()
+    loading.value = false
+  })
 
 </script>
 
 <style lang="scss" scoped>
-@import "@/uni.scss";
-
-.header{
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: px2rpx(20);
-  .title{
-    font-size: px2rpx(24);
+  @import "@/uni.scss";
+
+  .header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: px2rpx(20);
+
+    .title {
+      font-size: px2rpx(24);
+      font-weight: bold;
+    }
+  }
+
+  .demo-uni-row {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: stretch;
+    margin: 0 auto !important;
+  }
+
+  .uni-col-left {
+    //display: flex;
+    //flex-direction: column;
+  }
+
+  .uni-col-right {
+    display: flex;
+  }
+
+  .dashboard-container {
+    min-height: 10vh;
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+  }
+
+  /* 卡片通用样式 */
+  .card {
+    background: var(--color-white);
+    color: var(--bs-heading-color);
+    border-radius: 4px;
+    margin-bottom: px2rpx(20);
+    box-shadow: 0 px2rpx(4) px2rpx(12) rgba(0, 0, 0, 0.2);
+  }
+
+  .card-body {
+    padding: px2rpx(16);
+  }
+
+  .icon-placeholder {
+    width: px2rpx(48);
+    height: px2rpx(48);
+    border-radius: px2rpx(24);
+    background: linear-gradient(135deg, #f5f7fa 0%, #e4e8ec 100%);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-shrink: 0;
+  }
+
+  .icon-text {
+    font-size: px2rpx(20);
     font-weight: bold;
+    color: #6c757d;
   }
-}
-
-.demo-uni-row {
-  display: flex;
-  flex-wrap: wrap;
-  align-items: stretch;
-  margin: 0 auto !important;
-}
-
-.uni-col-left {
-  //display: flex;
-  //flex-direction: column;
-}
-
-.uni-col-right {
-  display: flex;
-}
-
-.dashboard-container {
-  min-height: 10vh;
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-}
-
-/* 卡片通用样式 */
-.card {
-  background: var(--color-white);
-  color: var(--bs-heading-color);
-  border-radius: 4px;
-  margin-bottom: px2rpx(20);
-  box-shadow: 0 px2rpx(4) px2rpx(12) rgba(0, 0, 0, 0.2);
-}
-
-.card-body {
-  padding: px2rpx(16);
-}
-
-.icon-placeholder {
-  width: px2rpx(48);
-  height: px2rpx(48);
-  border-radius: px2rpx(24);
-  background: linear-gradient(135deg, #f5f7fa 0%, #e4e8ec 100%);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  flex-shrink: 0;
-}
-
-.icon-text {
-  font-size: px2rpx(20);
-  font-weight: bold;
-  color: #6c757d;
-}
-
-.growth-rate {
-  font-size: px2rpx(12);
-  font-weight: 500;
-  padding: px2rpx(2) px2rpx(8);
-  border-radius: px2rpx(2);
-}
-
-.growth-rate.rate-up {
-  color: #10b981;
-  background: rgba(16, 185, 129, 0.1);
-}
-
-.growth-rate.rate-down {
-  color: #ef4444;
-  background: rgba(239, 68, 68, 0.1);
-}
-
-.custom-number,
-.custom-money {
-  background: var(--bs-body-bg);
-  border: 1px solid var(--bs-border-color);
-  padding: 15px;
-
-  border-radius: 4px;
-  margin-bottom: 20px;
-  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-  min-height: px2rpx(125);
-}
-
-.custom-number .title,
-.custom-money .left .tit,
-.custom-money .right .tit {
-  font-size: 14px;
-  color: var(--bs-heading-color);
-  margin-bottom: 10px;
-}
-
-.custom-number .title {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.custom-money {
-  display: flex;
-  flex-direction: column;
-}
-
-.custom-money .left,
-.custom-money .right {
-  flex: 1;
-}
-
-.custom-money .num {
-  font-size: 20px;
-  font-weight: bold;
-  color: var(--bs-heading-color);
-}
-
-.custom-money .num.red {
-  color: #eb3f57;
-}
-
-.el-dropdown-link {
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  color: #6c8595;
-  font-size: 12px;
-}
-
-.account-info1 {
-  margin-bottom: 20px;
-}
-
-.custom-money-left .header,
-.custom-money-right .header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: px2rpx(15);
-}
-
-.custom-money-left .tab,
-.custom-money-right .tab {
-  font-size: px2rpx(16);
-  font-weight: 600;
-  color: var(--bs-heading-color);
-}
-
-.bottomCol {
-  font-size: 16px;
-  color: #868686;
-
-  .bo-left1 {
-    margin: 20px 0;
-    padding: 20px 0;
-    border-right: 1px dashed #989898;
-    text-align: center;
-    font-size: 16px;
+
+  .growth-rate {
+    font-size: px2rpx(12);
+    font-weight: 500;
+    padding: px2rpx(2) px2rpx(8);
+    border-radius: px2rpx(2);
   }
 
+  .growth-rate.rate-up {
+    color: #10b981;
+    background: rgba(16, 185, 129, 0.1);
+  }
 
-  .bo-right1 {
-    margin: 20px 0px;
-    padding: 20px 0;
-    text-align: center;
+  .growth-rate.rate-down {
+    color: #ef4444;
+    background: rgba(239, 68, 68, 0.1);
+  }
+
+  .custom-number,
+  .custom-money {
+    background: var(--bs-body-bg);
+    border: 1px solid var(--bs-border-color);
+    padding: 15px;
+
+    border-radius: 4px;
+    margin-bottom: 20px;
+    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+    min-height: px2rpx(125);
+  }
+
+  .custom-number .title,
+  .custom-money .left .tit,
+  .custom-money .right .tit {
+    font-size: 14px;
+    color: var(--bs-heading-color);
+    margin-bottom: 10px;
+  }
+
+  .custom-number .title {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+
+  .custom-money {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .custom-money .left,
+  .custom-money .right {
+    flex: 1;
+  }
+
+  .custom-money .num {
+    font-size: 20px;
+    font-weight: bold;
+    color: var(--bs-heading-color);
+  }
+
+  .custom-money .num.red {
+    color: #eb3f57;
+  }
+
+  .el-dropdown-link {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    color: #6c8595;
+    font-size: 12px;
+  }
+
+  .account-info1 {
+    margin-bottom: 20px;
+  }
+
+  .custom-money-left .header,
+  .custom-money-right .header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: px2rpx(15);
+  }
+
+  .custom-money-left .tab,
+  .custom-money-right .tab {
+    font-size: px2rpx(16);
+    font-weight: 600;
+    color: var(--bs-heading-color);
+  }
+
+  .bottomCol {
     font-size: 16px;
+    color: #868686;
+
+    .bo-left1 {
+      margin: 20px 0;
+      padding: 20px 0;
+      border-right: 1px dashed #989898;
+      text-align: center;
+      font-size: 16px;
+    }
+
+
+    .bo-right1 {
+      margin: 20px 0px;
+      padding: 20px 0;
+      text-align: center;
+      font-size: 16px;
+
+    }
+  }
+
+  .blue-font {
+    margin-top: px2rpx(15);
+    color: #007aff;
+    font-weight: 600;
+    font-size: px2rpx(24);
+  }
+
+  .subscribe-table {
+    width: 100%;
+    border: 1px solid #ebeef5;
+    border-radius: 6px;
+    overflow: hidden;
+  }
 
+  .subscribe-row {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr 1fr;
+    border-top: 1px solid #ebeef5;
   }
-}
-
-.blue-font {
-  margin-top: px2rpx(15);
-  color: #007aff;
-  font-weight: 600;
-  font-size: px2rpx(24);
-}
-
-.subscribe-table {
-  width: 100%;
-  border: 1px solid #ebeef5;
-  border-radius: 6px;
-  overflow: hidden;
-}
-
-.subscribe-row {
-  display: grid;
-  grid-template-columns: 1fr 1fr 1fr 1fr;
-  border-top: 1px solid #ebeef5;
-}
-
-.subscribe-head {
-  background: #f5f7fa;
-  border-top: none;
-}
-
-.subscribe-cell {
-  padding: 10px 8px;
-  font-size: 12px;
-  color: var(--bs-heading-color);
-  text-align: center;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.custom-dialog-content {
-  padding: px2rpx(20);
-
-  .info-text {
+
+  .subscribe-head {
+    background: #f5f7fa;
+    border-top: none;
+  }
+
+  .subscribe-cell {
+    padding: 10px 8px;
+    font-size: 12px;
     color: var(--bs-heading-color);
+    text-align: center;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .custom-dialog-content {
+    padding: px2rpx(20);
+
+    .info-text {
+      color: var(--bs-heading-color);
+      font-size: px2rpx(14);
+      line-height: px2rpx(36);
+    }
+  }
+
+  .card-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: px2rpx(12);
+  }
+
+  .header-left {
+    display: flex;
+    align-items: center;
+    gap: 12rpx;
+  }
+
+  .header-title {
     font-size: px2rpx(14);
-    line-height: px2rpx(36);
-  }
-}
-
-.card-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: px2rpx(12);
-}
-
-.header-left {
-  display: flex;
-  align-items: center;
-  gap: 12rpx;
-}
-
-.header-title {
-  font-size: px2rpx(14);
-  font-weight: 600;
-}
-
-.header-right {
-  display: flex;
-  align-items: center;
-}
-
-.action-btn {
-  background: #ffde02;
-  border: none;
-  border-radius: 50%;
-  width: px2rpx(32);
-  height: px2rpx(32);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0;
-  margin: 0;
-
-  &:after {
+    font-weight: 600;
+  }
+
+  .header-right {
+    display: flex;
+    align-items: center;
+  }
+
+  .action-btn {
+    background: #ffde02;
     border: none;
+    border-radius: 50%;
+    width: px2rpx(32);
+    height: px2rpx(32);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 0;
+    margin: 0;
+
+    &:after {
+      border: none;
+    }
+  }
+
+  .dia-content {
+    padding: 20rpx;
+  }
+
+  .content {
+    display: flex;
+    flex-direction: column;
+    gap: 20rpx;
+  }
+
+  .label {
+    font-weight: 500;
+    margin-bottom: 8rpx;
   }
-}
-
-.dia-content {
-  padding: 20rpx;
-}
-
-.content {
-  display: flex;
-  flex-direction: column;
-  gap: 20rpx;
-}
-
-.label {
-  font-weight: 500;
-  margin-bottom: 8rpx;
-}
-
-.btn {
-  text-align: center;
-  background-color: rgb(var(--bs-danger-rgb));
-  font-size: px2rpx(16);
-  color: #fff;
-  padding: px2rpx(10) px2rpx(20);
-  border-radius: px2rpx(24);
-  margin: 0;
-}
-
-.crm-cursor {
-  cursor: pointer;
-}
-
-.link {
-  display: flex;
-  margin-top: 20rpx;
 
   .btn {
+    text-align: center;
+    background-color: rgb(var(--bs-danger-rgb));
+    font-size: px2rpx(16);
+    color: #fff;
+    padding: px2rpx(10) px2rpx(20);
+    border-radius: px2rpx(24);
+    margin: 0;
+  }
+
+  .crm-cursor {
+    cursor: pointer;
+  }
+
+  .link {
+    display: flex;
+    margin-top: 20rpx;
+
+    .btn {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      height: px2rpx(35);
+      margin: 0 px2rpx(10);
+    }
+  }
+
+  .chart-box {
+    background: var(--color-white);
+    border-radius: 8px;
+    padding: px2rpx(16);
+    box-shadow: 0 px2rpx(4) px2rpx(12) rgba(0, 0, 0, 0.2);
+  }
+
+  .chart-title {
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-start;
+    margin-bottom: px2rpx(16);
+    padding-bottom: px2rpx(16);
+    border-bottom: 1px solid #f0f0f0;
+  }
+
+  .chart-title .time {
     display: flex;
     align-items: center;
-    justify-content: center;
-    height: px2rpx(35);
-    margin: 0 px2rpx(10);
-  }
-}
-
-.qrCode {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 16rpx;
-}
-
-.chart-box {
-  background: var(--color-white);
-  border-radius: 8px;
-  padding: px2rpx(16);
-  box-shadow: 0 px2rpx(4) px2rpx(12) rgba(0, 0, 0, 0.2);
-}
-
-.chart-title {
-  display: flex;
-  justify-content: space-between;
-  align-items: flex-start;
-  margin-bottom: px2rpx(16);
-  padding-bottom: px2rpx(16);
-  border-bottom: 1px solid #f0f0f0;
-}
-
-.chart-title .time {
-  display: flex;
-  align-items: center;
-  gap: px2rpx(8);
-  font-size: px2rpx(12);
-  color: #999;
-}
-
-.chart-title .title {
-  flex: 1;
-  margin: 0 px2rpx(16);
-}
-
-.chart-title .title .name {
-  font-size: px2rpx(14);
-  font-weight: 600;
-  color: var(--bs-heading-color);
-  margin-bottom: px2rpx(8);
-}
-
-.chart-title .title .account {
-  font-size: px2rpx(12);
-  color: #999;
-  margin-bottom: px2rpx(8);
-}
-
-.chart-title .title .date {
-  display: flex;
-}
-
-.chart-title .date-picker {
-  font-size: px2rpx(12);
-  color: #666;
-  padding: px2rpx(6) px2rpx(12);
-  background: #f5f5f5;
-  border-radius: 4px;
-}
-
-.chart-title .operation {
-  display: flex;
-  align-items: center;
-  gap: px2rpx(4);
-  color: #666;
-  cursor: pointer;
-}
-
-.chart-container {
-  height: px2rpx(300);
-}
-
-.popup-content .form {
-  padding: px2rpx(16);
-}
-
-.popup-content .form-item {
-  margin-bottom: px2rpx(20);
-}
-
-.popup-content .form-label {
-  display: block;
-  font-size: px2rpx(14);
-  color: #666;
-  margin-bottom: px2rpx(8);
-}
-
-.popup-content .picker-value {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding: px2rpx(12);
-  background: #f5f5f5;
-  border-radius: 4px;
-  font-size: px2rpx(14);
-  color: #333;
-}
-
-.crm-cursor {
-  cursor: pointer;
-}
-
-.crm-border-radius {
-  border-radius: 8px;
-}
+    gap: px2rpx(8);
+    font-size: px2rpx(20);
+    margin-bottom: px2rpx(10);
+    color: #999;
+  }
+
+  .chart-title .title {
+    flex: 1;
+    margin: 0;
+    margin-bottom: px2rpx(10);
+  }
+
+  .chart-title .title .name {
+    font-size: px2rpx(20);
+    font-weight: 600;
+    color: var(--bs-heading-color);
+    margin-bottom: px2rpx(8);
+  }
+
+  .chart-title .title .account {
+    font-size: px2rpx(20);
+    color: #999;
+    margin-bottom: px2rpx(8);
+  }
+
+  .chart-title .title .date {
+    display: flex;
+  }
+
+  .chart-title .date-picker {
+    font-size: px2rpx(12);
+    color: #666;
+    padding: px2rpx(6) px2rpx(12);
+    background: #f5f5f5;
+    border-radius: 4px;
+  }
+
+  .chart-title .operation {
+    display: flex;
+    align-items: center;
+    gap: px2rpx(4);
+    color: #666;
+    margin-bottom: px2rpx(10);
+    cursor: pointer;
+  }
+
+  .chart-container {
+    height: px2rpx(300);
+  }
+
+  .popup-content .form {
+    padding: px2rpx(16);
+  }
+
+  .popup-content .form-item {
+    margin-bottom: px2rpx(20);
+  }
+
+  .popup-content .form-label {
+    display: block;
+    font-size: px2rpx(14);
+    color: #666;
+    margin-bottom: px2rpx(8);
+  }
+
+  .popup-content .picker-value {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: px2rpx(12);
+    background: #f5f5f5;
+    border-radius: 4px;
+    font-size: px2rpx(14);
+    color: #333;
+  }
+
+  .crm-cursor {
+    cursor: pointer;
+  }
+
+  .crm-border-radius {
+    border-radius: 8px;
+  }
 </style>

static/js/u-charts/config-ucharts.js

@@ -53,6 +53,9 @@ const cfu = {
         return series[index].name+'：'+series[index].data+'元'
       }
     },
+    "tooltipCustom":function(item, category, index, opts){
+      return item.data
+    }
   },
   //这里演示了自定义您的图表类型的option，可以随意命名，之后在组件上 type="demotype" 后，组件会调用这个花括号里的option，如果组件上还存在opts参数，会将demotype与opts中option合并后渲染图表。
   "demotype":{

static/js/u-charts/u-charts.js

@@ -85,7 +85,7 @@ function getH5Offset(e) {
 // hex 转 rgba
 function hexToRgb(hexValue, opc) {
   var rgx = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
-  var hex = hexValue.replace(rgx, function(m, r, g, b) {
+  var hex = hexValue?.replace(rgx, function(m, r, g, b) {
     return r + r + g + g + b + b;
   });
   var rgb = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);