修改字体大小

src/App.vue

@@ -1,10 +1,14 @@
 <script setup>
 import zhCN from 'ant-design-vue/es/locale/zh_CN'
+// import myMain from '@/components/dataV/myMain.vue'
+// import AdaptiveView from '@/components/AdaptiveView/index.vue'
 </script>
 
 <template>
   <a-config-provider :locale="zhCN">
-    <router-view />
+    <AdaptiveView>
+      <router-view />
+    </AdaptiveView>
   </a-config-provider>
 </template>
 

src/assets/icon/iconfont.css

@@ -1,12 +1,13 @@
 @font-face {
-  font-family: "iconfont"; /* Project id 4079354 */
-  src: url('iconfont.woff2?t=1685509924120') format('woff2'),
-       url('iconfont.woff?t=1685509924120') format('woff'),
-       url('iconfont.ttf?t=1685509924120') format('truetype');
+  font-family: 'iconfont'; /* Project id 4079354 */
+  src:
+    url('iconfont.woff2?t=1685509924120') format('woff2'),
+    url('iconfont.woff?t=1685509924120') format('woff'),
+    url('iconfont.ttf?t=1685509924120') format('truetype');
 }
 
 .iconfont {
-  font-family: "iconfont" !important;
+  font-family: 'iconfont' !important;
   font-size: 16px;
   font-style: normal;
   -webkit-font-smoothing: antialiased;
@@ -14,82 +15,81 @@
 }
 
 .icon-dengji:before {
-  content: "\e610";
+  content: '\e610';
 }
 
 .icon-shenhezhong:before {
-  content: "\e682";
+  content: '\e682';
 }
 
 .icon-dkw_shenheweitongguo:before {
-  content: "\e604";
+  content: '\e604';
 }
 
 .icon-shenhetongguo:before {
-  content: "\e668";
+  content: '\e668';
 }
 
 .icon-hearts-fill:before {
-  content: "\e702";
+  content: '\e702';
 }
 
 .icon-xiaoyouhui:before {
-  content: "\e601";
+  content: '\e601';
 }
 
 .icon-youjiantou-copy:before {
-  content: "\e654";
+  content: '\e654';
 }
 
 .icon-6ruxueshijian:before {
-  content: "\e88a";
+  content: '\e88a';
 }
 
 .icon-zhuanyezhuanyeke:before {
-  content: "\e6a1";
+  content: '\e6a1';
 }
 
 .icon-commpany:before {
-  content: "\e612";
+  content: '\e612';
 }
 
 .icon-zhiwuguanli:before {
-  content: "\e60f";
+  content: '\e60f';
 }
 
 .icon-guanzhu:before {
-  content: "\e611";
+  content: '\e611';
 }
 
 .icon-guanzhu1:before {
-  content: "\e600";
+  content: '\e600';
 }
 
 .icon-edu-line:before {
-  content: "\e63a";
+  content: '\e63a';
 }
 
 .icon-gender:before {
-  content: "\e63e";
+  content: '\e63e';
 }
 
 .icon-xingming:before {
-  content: "\e640";
+  content: '\e640';
 }
 
 .icon-jibenxinxi:before {
-  content: "\e67c";
+  content: '\e67c';
 }
 
 .icon-iocn_be_concern:before {
-  content: "\e607";
+  content: '\e607';
 }
 
 .icon-tupianshangchuan:before {
-  content: "\e639";
+  content: '\e639';
 }
 
 .icon-wodeguanzhu:before {
-  content: "\e8bc";
+  content: '\e8bc';
 }
-

src/components/AdaptiveView/index.vue

@@ -0,0 +1,67 @@
+<template>
+  <div class="ScreenAdapter" :style="style">
+    <slot></slot>
+  </div>
+</template>
+<script>
+import { onMounted, reactive } from 'vue'
+export default {
+  props: {
+    width: {
+      type: String,
+      default: window.innerWidth - 17
+    },
+    height: {
+      type: String,
+      default: window.innerHeight
+    }
+  },
+  setup(props) {
+    const style = reactive({
+      width: props.width + 'px',
+      height: props.height + 'px',
+      transform: 'scale(1) translate(-50%, -50%)'
+    })
+    const Debounce = (fn, t) => {
+      const delay = t || 500
+      let timer
+      return function () {
+        const args = arguments
+        if (timer) {
+          clearTimeout(timer)
+        }
+        timer = setTimeout(() => {
+          timer = null
+          fn.apply(args)
+        }, delay)
+      }
+    }
+    // 获取放大缩小比例
+    const getScale = () => {
+      const w = window.innerWidth / props.width
+      const h = window.innerHeight / props.height
+      return w < h ? w : h
+    }
+    // 设置比例
+    const setScale = () => {
+      style.transform = 'scale(' + getScale() + ') translate(-50%, -50%)'
+    }
+    onMounted(() => {
+      setScale()
+      window.onresize = Debounce(setScale, 1000)
+    })
+    return {
+      style
+    }
+  }
+}
+</script>
+<style scoped>
+.ScreenAdapter {
+  transform-origin: 0 0;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  transition: 0.3s;
+}
+</style>

src/components/dataV/mixin/autoResize.js

@@ -0,0 +1,85 @@
+import { debounce, observerDomResize } from '../util/index'
+
+export default {
+  data () {
+    return {
+      dom: '',
+
+      width: 0,
+      height: 0,
+
+      debounceInitWHFun: '',
+
+      domObserver: ''
+    }
+  },
+  methods: {
+    async autoResizeMixinInit () {
+      const { initWH, getDebounceInitWHFun, bindDomResizeCallback, afterAutoResizeMixinInit } = this
+
+      await initWH(false)
+
+      getDebounceInitWHFun()
+
+      bindDomResizeCallback()
+
+      if (typeof afterAutoResizeMixinInit === 'function') afterAutoResizeMixinInit()
+    },
+    initWH (resize = true) {
+      const { $nextTick, $refs, ref, onResize } = this
+
+      return new Promise(resolve => {
+        $nextTick((_) => {
+          const dom = (this.dom = $refs[ref])
+          // this.width = dom ? dom.clientWidth : 0
+          // this.height = dom ? dom.clientHeight : 0
+          this.width = window.innerWidth
+          this.height = window.innerHeight
+
+          if (!dom) {
+            console.warn('DataV: Failed to get dom node, component rendering may be abnormal!')
+          } else if (!this.width || !this.height) {
+            console.warn('DataV: Component width or height is 0px, rendering abnormality may occur!')
+          }
+
+          if (typeof onResize === 'function' && resize) onResize()
+
+          resolve()
+        })
+      })
+    },
+    getDebounceInitWHFun () {
+      const { initWH } = this
+
+      this.debounceInitWHFun = debounce(100, initWH)
+    },
+    bindDomResizeCallback () {
+      const { dom, debounceInitWHFun } = this
+
+      this.domObserver = observerDomResize(dom, debounceInitWHFun)
+
+      window.addEventListener('resize', debounceInitWHFun)
+    },
+    unbindDomResizeCallback () {
+      let { domObserver, debounceInitWHFun } = this
+
+      if (!domObserver) return
+
+      domObserver.disconnect()
+      domObserver.takeRecords()
+      domObserver = null
+
+      window.removeEventListener('resize', debounceInitWHFun)
+    }
+  },
+  mounted () {
+    const { autoResizeMixinInit } = this
+
+    autoResizeMixinInit()
+  },
+  beforeDestroy () {
+    const { unbindDomResizeCallback } = this
+
+    unbindDomResizeCallback()
+  }
+}

src/components/dataV/myMain.vue

@@ -0,0 +1,60 @@
+<template>
+  <div id="dv-full-screen-container" :ref="ref">
+    <template v-if="ready">
+      <slot></slot>
+    </template>
+  </div>
+</template>
+
+<script>
+import autoResize from './mixin/autoResize.js'
+
+export default {
+  name: 'DvFullScreenContainer',
+  mixins: [autoResize],
+  data() {
+    return {
+      ref: 'full-screen-container',
+      allWidth: 0,
+      allHeight: 0,
+      scale: 0,
+      datavRoot: '',
+      ready: false
+    }
+  },
+  methods: {
+    afterAutoResizeMixinInit() {
+      const { initConfig, setAppScale } = this
+
+      initConfig()
+
+      setAppScale()
+
+      this.ready = true
+    },
+    initConfig() {
+      const { dom } = this
+      // const { width } = screen
+      let width = window.innerWidth
+      let height = window.innerHeight
+      this.allWidth = width
+      this.allHeight = height
+
+      dom.style.width = `${width - 20}px`
+      dom.style.height = `${height}px`
+    },
+    setAppScale() {
+      const { allWidth, allHeight, dom } = this
+      const currentWidth = window.outerWidth
+      const currentHeight = window.innerHeight
+      // dom.style.transform = `scale(${currentWidth / allWidth})`
+      dom.style.transform = `scaleY(${currentHeight / allHeight}) scaleX(${currentWidth / allWidth})`
+    },
+    onResize() {
+      const { setAppScale } = this
+
+      setAppScale()
+    }
+  }
+}
+</script>

src/components/dataV/util/index.js

@@ -0,0 +1,47 @@
+export function randomExtend(minNum, maxNum) {
+  if (arguments.length === 1) {
+    return parseInt(Math.random() * minNum + 1, 10)
+  } else {
+    return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10)
+  }
+}
+
+export function debounce(delay, callback) {
+  let lastTime
+
+  return function () {
+    clearTimeout(lastTime)
+
+    const [that, args] = [this, arguments]
+
+    lastTime = setTimeout(() => {
+      callback.apply(that, args)
+    }, delay)
+  }
+}
+
+export function observerDomResize(dom, callback) {
+  const MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver
+
+  const observer = new MutationObserver(callback)
+
+  observer.observe(dom, { attributes: true, attributeFilter: ['style'], attributeOldValue: true })
+
+  return observer
+}
+
+export function getPointDistance(pointOne, pointTwo) {
+  const minusX = Math.abs(pointOne[0] - pointTwo[0])
+
+  const minusY = Math.abs(pointOne[1] - pointTwo[1])
+
+  return Math.sqrt(minusX * minusX + minusY * minusY)
+}
+
+export function uuid(hasHyphen) {
+  return (hasHyphen ? 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx' : 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx').replace(/[xy]/g, function (c) {
+    const r = (Math.random() * 16) | 0
+    const v = c == 'x' ? r : (r & 0x3) | 0x8
+    return v.toString(16)
+  })
+}

src/layout/index.vue

@@ -19,7 +19,7 @@
           </el-col>
           <el-col :span="12" v-if="user && user.id" class="top_2">
             <el-dropdown>
-              <el-button size="small" :icon="User" type="primary">
+              <el-button size="medium" :icon="User" type="primary">
                 {{ user.nick_name || '游客' }}
               </el-button>
               <template #dropdown>
@@ -32,8 +32,8 @@
             </el-dropdown>
           </el-col>
           <el-col :span="12" v-else class="top_2">
-            <el-button @click="toLogin(2)" type="primary" size="small">注册</el-button>
-            <el-button @click="toLogin(1)" type="primary" size="small">登录</el-button>
+            <el-button @click="toLogin(2)" type="primary" size="medium">注册</el-button>
+            <el-button @click="toLogin(1)" type="primary" size="medium">登录</el-button>
           </el-col>
         </el-row>
       </div>
@@ -219,13 +219,13 @@ provide('selectMenu', selectMenu)
 
         .title {
           margin: 0 0 5px 0;
-          font-size: 20px;
+          font-size: $global-font-size-22;
           font-weight: bold;
         }
 
         .english {
           margin: 0 0 0 5px;
-          font-size: 12px;
+          font-size: $global-font-size-14;
           opacity: 0.8;
           color: #1c66e7;
         }
@@ -264,7 +264,7 @@ provide('selectMenu', selectMenu)
   .bottom {
     width: 100%;
     padding: 7px 0;
-    font-size: 18px;
+    font-size: $global-font-size-20;
     background-color: #2e3546;
     color: #f0f2f5;
     font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
@@ -288,7 +288,7 @@ provide('selectMenu', selectMenu)
     }
 
     .footTop {
-      font-size: 18px;
+      font-size: $global-font-size-20;
       margin-bottom: 12px;
     }
   }
@@ -300,14 +300,14 @@ provide('selectMenu', selectMenu)
       padding: 30px 0;
       border-bottom: 1px solid #444444;
       .left {
-        font-size: 18px;
+        font-size: $global-font-size-20;
         font-family: 'Microsoft YaHei';
         color: rgb(255, 255, 255);
       }
       .right {
         color: #cccccc;
         font-family: microsoft yahei;
-        font-size: 15px;
+        font-size: $global-font-size-17;
         font-weight: normal;
         text-decoration: none;
         span {
@@ -326,7 +326,7 @@ provide('selectMenu', selectMenu)
       .left {
         font-family: 'Microsoft YaHei';
         color: rgb(204, 204, 204);
-        font-size: 18px;
+        font-size: $global-font-size-20;
         .left_2 {
           margin: 5px 0 0 0;
         }
@@ -342,7 +342,7 @@ provide('selectMenu', selectMenu)
         }
         .right_2 {
           font-family: 'Microsoft YaHei';
-          font-size: 18px;
+          font-size: $global-font-size-20;
           color: rgb(204, 204, 204);
         }
         .right_2:hover {
@@ -354,7 +354,7 @@ provide('selectMenu', selectMenu)
     .footflex_3 {
       padding: 20px 0;
       font-family: 'Microsoft YaHei';
-      font-size: 18px;
+      font-size: $global-font-size-20;
       color: rgb(204, 204, 204);
     }
   }

src/layout/site.js

@@ -9,7 +9,7 @@ export const siteInfo = {
   zhEnglish: 'Information Technology Incubation Platform',
   zhBrief: '方寸心间 创新无限',
   logoUrl: logo,
-  videoUrl: home
+  vkeyeoUrl: home
 }
 // 网站底部信息
 export const footInfo = {
@@ -30,41 +30,103 @@ export const footInfo = {
 }
 // 菜单设置
 export const menuList = [
-  { _id: '1', title: '首页', href: 'one', English: 'Home', type: '1' },
-  { _id: '2', title: '信息发布', href: 'two', English: 'Information Release', type: '1' },
-  { _id: '3', title: '创新中心', href: 'thr', English: 'News Information', type: '1' },
-  { _id: '4', title: '信息检索', href: 'four', English: 'Expert Tank', type: '1' },
-  { _id: '5', title: '双创活动', href: 'five', English: 'Authorized Operator', type: '1' },
-  { _id: '6', title: '中试平台', href: 'six', English: 'Project Selection', type: '1' },
-  { _id: '7', title: '服务支撑', href: 'seven', English: 'Innovation Competition', type: '1' },
-  { _id: '8', title: '产业集群', href: 'eight', English: 'Innovation Competition', type: '1' },
+  { key: '1', title: '首页', route: 'one', English: 'Home', label: '首页' },
+  { key: '2', title: '信息发布', route: 'two', English: 'Information Release', label: '信息发布' },
   {
-    _id: '9',
+    key: '3',
+    title: '创新中心',
+    route: 'thr',
+    English: 'News Information',
+    label: '创新中心',
+    children: [
+      {
+        key: '3-1',
+        title: '全部',
+        label: '全部',
+        route: 'thr'
+      },
+      {
+        key: '3-2',
+        title: '需求中心',
+        label: '需求中心',
+        children: [
+          { key: '3-2-1', route: 'demand', title: '技术需求', label: '技术需求', value: '0' },
+          { key: '3-2-2', route: 'demand', title: '人才需求', label: '人才需求', value: '1' },
+          { key: '3-2-3', route: 'demand', title: '资金需求', label: '资金需求', value: '2' },
+          { key: '3-2-4', route: 'demand', title: '合作伙伴', label: '合作伙伴', value: '3' },
+          { key: '3-2-5', route: 'demand', title: '知识产权', label: '知识产权', value: '4' },
+          { key: '3-2-6', route: 'demand', title: '市场需求', label: '市场需求', value: '5' },
+          { key: '3-2-7', route: 'demand', title: '政策支持', label: '政策支持', value: '6' },
+          { key: '3-2-8', route: 'demand', title: '其他', label: '其他', value: '7' }
+        ]
+      },
+      {
+        key: '3-3',
+        title: '供方中心',
+        label: '供方中心',
+        children: [
+          { key: '3-3-1', route: 'supply', title: '技术支持', label: '技术支持', value: '0' },
+          { key: '3-3-2', route: 'supply', title: '培训教育', label: '培训教育', value: '1' },
+          { key: '3-3-3', route: 'supply', title: '资金支持', label: '资金支持', value: '2' },
+          { key: '3-3-4', route: 'supply', title: '合作机会', label: '合作机会', value: '3' },
+          {
+            key: '3-3-5',
+            route: 'supply',
+            title: '知识产权管理',
+            label: '知识产权管理',
+            value: '4'
+          },
+          { key: '3-3-6', route: 'supply', title: '市场推广', label: '市场推广', value: '5' },
+          { key: '3-3-7', route: 'supply', title: '政策支持', label: '政策支持', value: '6' },
+          { key: '3-3-8', route: 'supply', title: '其他', label: '其他', value: '7' }
+        ]
+      }
+    ]
+  },
+  { key: '4', title: '信息检索', route: 'four', English: 'Expert Tank', label: '信息检索' },
+  { key: '5', title: '双创活动', route: 'five', English: 'Authorized Operator', label: '双创活动' },
+  { key: '6', title: '中试平台', route: 'six', English: 'Project Selection', label: '中试平台' },
+  {
+    key: '7',
+    title: '服务支撑',
+    route: 'seven',
+    English: 'Innovation Competition',
+    label: '服务支撑'
+  },
+  {
+    key: '8',
+    title: '产业集群',
+    route: 'eight',
+    English: 'Innovation Competition',
+    label: '产业集群'
+  },
+  {
+    key: '9',
     title: '成果展示',
-    href: 'nine',
+    route: 'nine',
     English: 'Innovation Competition',
-    type: '1'
+    label: '成果展示'
   },
   {
-    _id: '10',
+    key: '10',
     title: '信息库',
-    href: 'ten',
+    route: 'ten',
     English: 'Innovation Competition',
-    type: '1'
+    label: '信息库'
   },
-  { _id: '11', title: '孵化器', href: 'eleven', English: 'Achievement Display', type: '1' },
+  { key: '11', title: '孵化器', route: 'eleven', English: 'Achievement Display', label: '孵化器' },
   {
-    _id: '12',
+    key: '12',
     title: '产业孵化大脑',
-    href: 'twelve',
+    route: 'twelve',
     English: 'Achievement Display',
-    type: '1'
+    label: '产业孵化大脑'
   },
   {
-    _id: '13',
+    key: '13',
     title: '行研产研',
-    href: 'thirteen',
+    route: 'thirteen',
     English: 'Research Development',
-    type: '1'
+    label: '行研产研'
   }
 ]

src/styles/variables.scss

@@ -0,0 +1,13 @@
+// 全局变量文件，比如命名为 _variables.scss
+$global-font-size-12: 12px;
+$global-font-size-14: 14px;
+$global-font-size-16: 16px;
+$global-font-size-17: 17px;
+$global-font-size-18: 18px;
+$global-font-size-19: 19px;
+$global-font-size-20: 20px;
+$global-font-size-22: 22px;
+$global-font-size-23: 23px;
+$global-font-size-24: 24px;
+$global-font-size-25: 25px;
+$global-font-size-26: 26px;

vite.config.js

@@ -52,10 +52,7 @@ export default defineConfig(({ mode }) => {
       preprocessorOptions: {
         // 定义全局 SCSS 变量
         scss: {
-          javascriptEnabled: true
-          // additionalData: `
-          //   @use "@/styles/variables.scss" as *;
-          // `
+          additionalData: `@import "@/styles/variables.scss";`
         }
       }
     },