update

src/api/index.ts

@@ -2,6 +2,7 @@ export * from './room'
 export * from './user'
 export * from './instance'
 export * from './scene'
+export * from './statistic'
 
 export type PageResult<T> = {
   pageNum: number

src/api/statistic.ts

@@ -0,0 +1,26 @@
+import axios from './instance'
+
+type top5LabelType = {
+    dataKey: string
+    dataCount: number
+}
+export type HeroStatusType = {
+    roomCount: number
+    visitManCount: number
+    visitCount: number
+    shareCount: number
+}
+
+export interface Top5DataType {
+    takeLookList: top5LabelType[],
+    danmakuList: top5LabelType[],
+}
+export const getHeroStatus = async (): Promise<HeroStatusType> => {
+    return await axios.get<HeroStatusType>('takelook/roomData')
+}
+
+
+export const getTop5 = async (): Promise<Top5DataType> => {
+    const res = await axios.get<Top5DataType>('takelook/takeLookTop5')
+    return res
+}

src/api/user.ts

@@ -23,3 +23,8 @@ export const fetchUser = async (): Promise<User> => {
 }
 
 export const postLogout = () => axios.post('/takelook/fdLogout')
+
+
+export const addAuthUser = async (userName: string): Promise<any> => {
+  return await axios.get<SUser>('takelook/roomUser/addUserCheck', { params: { userName } })
+}

src/components.d.ts

@@ -27,8 +27,6 @@ declare module '@vue/runtime-core' {
     AModal: typeof import('ant-design-vue/es')['Modal']
     APopover: typeof import('ant-design-vue/es')['Popover']
     AppstoreOutlined: typeof import('@ant-design/icons-vue')['AppstoreOutlined']
-    ARadio: typeof import('ant-design-vue/es')['Radio']
-    ARadioGroup: typeof import('ant-design-vue/es')['RadioGroup']
     ARangePicker: typeof import('ant-design-vue/es')['RangePicker']
     ARow: typeof import('ant-design-vue/es')['Row']
     ATable: typeof import('ant-design-vue/es')['Table']

src/store/modules/statistic.ts

@@ -0,0 +1,27 @@
+import { defineStore } from 'pinia'
+import {
+    getTop5,
+    getHeroStatus
+} from '@/api'
+
+import type {
+    Top5DataType,
+    HeroStatusType,
+
+} from '@/api'
+
+export const useStatisticStore = defineStore('statistic', {
+    state: () => ({
+        top5: {} as Top5DataType,
+        roomData: {} as HeroStatusType,
+    }),
+    actions: {
+        async fetchHeroStatus() {
+            this.roomData = await getHeroStatus()
+
+        },
+        async fetchTop() {
+            this.top5 = await getTop5()
+        }
+    }
+})

src/views/room/edit-room/index.vue

@@ -134,7 +134,7 @@
             />
           </a-form-item>
           <a-form-item label="授权" name="scenes" style="margin-bottom: 2px">
-            <a-button type="primary" ghost>
+            <a-button type="primary" ghost @click="authvisible = true">
               <template #icon><plus-outlined /></template>添加用户</a-button
             >
           </a-form-item>
@@ -158,16 +158,33 @@
             </a-input-number>
           </a-form-item>
 
-          <a-form-item label="设置模式" name="mode" style="margin-bottom: 2px">
-            <!-- v-model:value="value" -->
-            <a-radio-group name="radioGroup" v-model:value="current.isRoamMode">
-              <a-radio :value="0">带看</a-radio>
-              <a-radio :value="1">自由观看模式</a-radio>
-            </a-radio-group>
-          </a-form-item>
+          <!-- <a-form-item label="设置模式" name="mode" style="margin-bottom: 2px">
+            <a-checkbox-group
+              v-model:value="current.isRoamMode"
+              :options="[
+                { label: '带看', value: 'Pear' },
+                { label: '自由观看模式', value: 'Apple' }
+              ]"
+            />
+       
+          </a-form-item> -->
         </a-form>
       </div>
     </a-modal>
+
+    <a-modal
+      v-model:visible="authvisible"
+      title="添加用户"
+      centered
+      @ok="handleAuthConfirm"
+    >
+      <a-form-item label="用户账号" name="authTargetUser">
+        <a-input
+          v-model:value="authTargetUser"
+          placeholder="请输入完整的账号"
+        />
+      </a-form-item>
+    </a-modal>
   </a-config-provider>
 </template>
 
@@ -185,6 +202,7 @@ import type { FormInstance } from 'ant-design-vue'
 import { useI18n } from '@/hook/useI18n'
 import { useLocale } from '@/locales/useLocale'
 import dayjs from 'dayjs'
+import { addAuthUser } from '@/api'
 
 // const titleValidator = ref({
 //   validator: (_, value) =>
@@ -199,6 +217,8 @@ export default defineComponent({
   props,
   setup(props) {
     const visible = ref(true)
+    const authvisible = ref(false)
+    const authTargetUser = ref('')
     const { getAntdLocale } = useLocale()
     const roomStore = useRoomStore()
     const { getLocale } = useLocale()
@@ -229,6 +249,13 @@ export default defineComponent({
       if (!current.scenes.length) {
         return message.error(t('room.form.addLeastScene'))
       }
+      if (
+        current.visitPassword?.length &&
+        current.visitPassword.length > 0 &&
+        current.visitPassword.length < 4
+      ) {
+        return message.error('密码缺失，请填写完整！')
+      }
       current.cover = current.scenes[0].cover
       console.log('current', current)
       props.onSave && props.onSave(current)
@@ -251,6 +278,16 @@ export default defineComponent({
       return Promise.resolve('')
     }
 
+    const handleAuthConfirm = async () => {
+      if (unref(authTargetUser)?.length) {
+        const userName = unref(authTargetUser)
+        const res = await addAuthUser(userName)
+        console.log('res', res)
+      } else {
+        message.error('用户账号不能为空！')
+      }
+    }
+
     return {
       handleNickRegex,
       returnLocale,
@@ -265,7 +302,10 @@ export default defineComponent({
       unScenePng,
       getAntdLocale,
       dayjs,
-      otpInput
+      otpInput,
+      authvisible,
+      handleAuthConfirm,
+      authTargetUser
     }
   }
 })

src/views/statistic/tab/tab1.vue

@@ -14,7 +14,7 @@
             ref="counter"
             class="number"
             :startAmount="0"
-            :endAmount="2021"
+            :endAmount="heroStatus.roomCount"
             :duration="2"
             separator=","
             decimalSeparator="."
@@ -30,7 +30,7 @@
             ref="counter"
             class="number"
             :startAmount="0"
-            :endAmount="11122"
+            :endAmount="heroStatus.visitManCount"
             :duration="2"
             separator=","
             decimalSeparator="."
@@ -46,7 +46,7 @@
             ref="counter"
             class="number"
             :startAmount="0"
-            :endAmount="222225"
+            :endAmount="heroStatus.visitCount"
             :duration="2"
             separator=","
             decimalSeparator="."
@@ -62,7 +62,7 @@
             ref="counter"
             class="number"
             :startAmount="0"
-            :endAmount="222225"
+            :endAmount="heroStatus.shareCount"
             :duration="2"
             separator=","
             decimalSeparator="."
@@ -76,44 +76,19 @@
       <a-col :span="12">
         <a-card title="带看次数排行（前5）" :bordered="false">
           <ul class="topic-list">
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
-            </li>
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
-            </li>
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
-            </li>
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
-            </li>
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
+            <li v-for="top in takeLookList" :key="top.dataKey">
+              <p><span>{{ top.dataKey }}</span> <span>{{ top.dataCount }}</span></p>
             </li>
           </ul>
         </a-card>
       </a-col>
       <a-col :span="12">
         <a-card title="留言数排行（前5）" :bordered="false">
-           <ul class="topic-list">
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
-            </li>
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
-            </li>
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
-            </li>
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
-            </li>
-            <li>
-              <p><span>Coffee</span> <span>20,200</span></p>
+          <ul class="topic-list">
+            <li v-for="top in danmakuList" :key="top.dataKey">
+              <p><span>{{ top.dataKey }}</span> <span>{{ top.dataCount }}</span></p>
             </li>
           </ul>
-         
         </a-card>
       </a-col>
     </a-row>
@@ -133,7 +108,17 @@ import { computed, onMounted } from 'vue'
 import Vue3Autocounter from 'vue3-autocounter'
 import * as echarts from 'echarts'
 import type { ECharts } from 'echarts'
-onMounted(() => {
+import { useStatisticStore } from '@/store/modules/statistic'
+
+const statisticStore = useStatisticStore()
+
+const takeLookList = computed(() => statisticStore.top5.takeLookList)
+const danmakuList = computed(() => statisticStore.top5.danmakuList)
+const heroStatus = computed(() => statisticStore.roomData)
+
+onMounted(async () => {
+  await statisticStore.fetchTop()
+  await statisticStore.fetchHeroStatus()
   const chart1 = document.getElementById('chart-1')
   let myChart: ECharts
   if (chart1) {
@@ -202,13 +187,12 @@ onMounted(() => {
     line-height: 20px;
     margin: 15px 0;
     display: flex;
-      flex-direction: row;
+    flex-direction: row;
     > p {
       display: flex;
       flex-direction: row;
       justify-content: space-between;
-      flex:1;
-
+      flex: 1;
     }
     &::before {
       content: '' counter(li-counter) '';