项目申报 仪器想请

jeecgboot-vue3/.env.development

@@ -6,10 +6,10 @@ VITE_PUBLIC_PATH = /
 
 
 # 跨域代理，您可以配置多个 ,请注意，没有换行符
-VITE_PROXY = [["/jeecgboot","http://localhost:18086/jeecg-boot"],["/upload","http://localhost:3300/upload"]]
+VITE_PROXY = [["/jeecgboot","http://10.121.2.107:18086/jeecg-boot"],["/upload","http://localhost:3300/upload"]]
 
 #后台接口全路径地址(必填)
-VITE_GLOB_DOMAIN_URL=http://localhost:18086/jeecg-boot
+VITE_GLOB_DOMAIN_URL=http://10.121.2.107:18086/jeecg-boot
 
 #后台接口父地址(必填)
 VITE_GLOB_API_URL=/jeecgboot

jeecgboot-vue3/src/router/helper/mainOut.ts

@@ -35,6 +35,8 @@ export const mainOutRoutes: AppRouteModule[] = [
         meta: {
           title: '首页',
           ignoreAuth: true,
+          hidden: false
+
         },
       },
       {
@@ -44,6 +46,8 @@ export const mainOutRoutes: AppRouteModule[] = [
         meta: {
           title: '仪器共享',
           ignoreAuth: true,
+          hidden: false
+
         },
       },
       {
@@ -53,6 +57,8 @@ export const mainOutRoutes: AppRouteModule[] = [
         meta: {
           title: '项目申报',
           ignoreAuth: true,
+          hidden: false
+
         },
       },
       {
@@ -62,6 +68,8 @@ export const mainOutRoutes: AppRouteModule[] = [
         meta: {
           title: '专家管理',
           ignoreAuth: true,
+          hidden: false
+
         },
       },
       {
@@ -71,6 +79,8 @@ export const mainOutRoutes: AppRouteModule[] = [
         meta: {
           title: '新闻列表',
           ignoreAuth: true,
+          hidden: false
+
         },
       },
       {
@@ -80,6 +90,8 @@ export const mainOutRoutes: AppRouteModule[] = [
         meta: {
           title: '新闻详情',
           ignoreAuth: true,
+          hidden: false
+
         },
       },
       {
@@ -89,6 +101,8 @@ export const mainOutRoutes: AppRouteModule[] = [
         meta: {
           title: '栏目管理',
           ignoreAuth: true,
+          hidden: false
+
         },
       },
       {
@@ -98,6 +112,18 @@ export const mainOutRoutes: AppRouteModule[] = [
         meta: {
           title: '文章管理',
           ignoreAuth: true,
+          hidden: false
+
+        },
+      },
+      {
+        path: '/main-home/instrumentInfo',
+        name: 'InstrumentInfo',
+        component: () => import('/@/views/demo/main-home/components/instrumentInfo/index.vue'),
+        meta: {
+          title: '',
+          ignoreAuth: true,
+          hidden:true
         },
       },
     ],

jeecgboot-vue3/src/views/demo/main-home/components/instrumentInfo/index.vue

@@ -0,0 +1,250 @@
+<template>
+    <div class="container">
+        <div class="small">
+            <ul>
+                <li>首页</li>
+                <li>|</li>
+                <li>仪器共享</li>
+                <li>|</li>
+                <li>科研校园</li>
+            </ul>
+        </div>
+        <div class="header">
+            <div class="headerLeft">
+                <img src="@/assets/images/mainHome/aa.png" alt="">
+            </div>
+            <div class="headerRight">
+                <h3>组合型四级杆轨道离子阱质谱仪 Q Exactive Plus Hybrid <br>Quadrupole-Orbitrap Mass<br>Spectrometer</h3>
+                <div class="b">
+                    <div class="bb">
+                        <p>状态<br>型号<br>仪器分类<br>生产厂商<br>仪器类别</p>
+                    </div>
+                    <div class="bbb">-<br>Q Exactive Plus<br>分析仪器-质谱仪器-有机质谱仪器<br>杭州成功仪器质量高高科技有限公司<br>专用</div>
+                </div>
+                <div class="bbbb">
+                    <div class="bbbbb">所在地点&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp*&nbsp黄淮国际教育学院实验室</div>
+                    <button>立即预约</button>
+                </div>
+            </div>
+        </div>
+        <div class="center">
+            <div class="box1">技术指标</div>
+            <div class="box2">
+                1&nbsp离子源<br>1.1&nbsp配有独立的电喷雾式离子源(ESI)、大气压化学离子源(APCI)<br>1.2&nbsp插拔式可互换ESI及APCI喷针，无需任何工具可实现ESI源及APCI源快速更换<br>1.3&nbspESI&nbsp流速范围：确保敏捷度不损失的前提下，无需分流，流速可达到2.5mL/min以上。<br>1.4&nbsp离子源温度：离子源内两路加热雾化气，辅助加热器温度不低于700℃，该最大温度可以在软件<br>界面下设置并运行
+            </div>
+            <div class="box1">2&nbsp离子源接口及传输系统</div>
+            <div class="box2">
+                2.1&nbsp离子传输通道(Q0)采用锥孔结构和饭吹气技术，无毛细管类设计装置，不会堵塞，且能有效防止<br>生物样本中中性分子与不发挥缓冲盐由于真空压力梯度进入四级杆，终身不必更换锥孔，节约清洗离<br>子传输通道的毛细管类组件的费用<br>2.2&nbsp离子传输系统拥有高压离子聚焦技术，压力至少达7.5mtorr,确保最佳的离子聚焦效果和离子传输<br>效率有效去除“记忆效应”和“交叉感染”
+            </div>
+            <div class="box1">主要功能：</div>
+            <div class="box2">
+                基于液相色谱-质谱联用技术，以液相色谱作为分离系统，质谱作为监测系统，与配套的检测试剂共同使用，在临床上用于对来源于人体样本<br>(如全血、血浆、血清、尿液样本)中的内源性物质和外源性物质(如维生素、激素)进行定性或定量检测<br>
+                服务内容：<br>有机化合物成分定量分析(如内源性代谢产物；药代动力学；毒物分析等)；血样、组织、细胞等的靶向代谢组学和靶向脂质分析；成分分离分<br>析；方法开发等
+            </div>
+            <div class="box1">用户须知</div>
+            <div class="box2">预约时间为周一至周五上午8:00-12:00,下午2:30(3:00)-5:30(6:00)</div>
+            <div class="box1">参考收费标准</div>
+            <div class="box2">协议收费</div>
+        </div>
+        <div class="btn">
+            <div class="btnTop">
+                <h3>留言交流</h3>
+                <button>我要留言</button>
+            </div>
+            <div class="btnBtn">
+                <div class="left">
+                    <div class="box">
+                        <img width="90px" src="@/assets/images/mainHome/h.png" alt="">
+                    </div>
+                    游客123456
+                </div>
+                <div class="right">
+                    <p>什么时候仪器空闲，</p>
+                    <p>麻烦联系123456789，谢谢</p>
+                    <div class="time">发布时间：2024.10.16&nbsp&nbsp17:26</div>
+                </div>
+            </div>
+
+
+            <div class="btnBtn">
+                <div class="left">
+                    <div class="box">
+                        <img width="90px" src="@/assets/images/mainHome/h.png" alt="">
+                    </div>
+                    游客123456
+                </div>
+                <div class="right">
+                    <p>什么时候仪器空闲，</p>
+                    <p>麻烦联系123456789，谢谢</p>
+                    <div class="time">发布时间：2024.10.16&nbsp&nbsp17:26</div>
+                </div>
+            </div>
+            <div class="btnBtn">
+                <div class="left">
+                    <div class="box">
+                        <img width="90px" src="@/assets/images/mainHome/h.png" alt="">
+                    </div>
+                    游客123456
+                </div>
+                <div class="right">
+                    <p>什么时候仪器空闲，</p>
+                    <p>麻烦联系123456789，谢谢</p>
+                    <div class="time">发布时间：2024.10.16&nbsp&nbsp17:26</div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+<script setup>
+import { ref } from 'vue';
+</script>
+<style lang="less" scoped>
+.container {
+    width: 1200px;
+    margin: 0 auto;
+    margin-top: 5px;
+
+    .small {
+        height: 35px;
+        line-height: 35px;
+        font-size: 11px;
+    }
+
+    .small li {
+        display: inline-block;
+        padding: 0 10px;
+    }
+
+    .header {
+        width: 100%;
+        height: 450px;
+        background-color: #ffffff;
+        display: flex;
+        justify-content: space-between;
+        padding: 60px 45px;
+
+        .headerLeft {
+            width: 310px;
+            background-color: #f3f6fb;
+        }
+
+        .headerRight {
+            width: 750px;
+        }
+
+        .headerRight h3 {
+            font-weight: 900;
+            font-size: 23px;
+            color: #333333;
+        }
+
+        .b {
+            margin-top: 20px;
+            width: 380px;
+            height: 160px;
+            display: flex;
+            justify-content: space-between;
+            color: #3f3f3f;
+            border: none;
+        }
+
+        .bb {
+            width: 80px;
+        }
+
+        .bbb {
+            width: 290px;
+
+        }
+
+        .bbbb {
+            width: 600px;
+            display: flex;
+            justify-content: space-between;
+        }
+
+        .bbbbb {
+            color: #7e7e7e;
+        }
+
+        button {
+            width: 170px;
+            height: 40px;
+            background-color: #002e97;
+            right: 30px;
+            color: #ffffff;
+            border-radius: 0.3cap;
+            font-size: 14px;
+        }
+    }
+
+    .center {
+        width: 100%;
+        height: 1050px;
+        background-color: #ffffff;
+        padding: 50px;
+        border-top: #ebebeb 1px solid;
+        border-bottom: #ebebeb 1px solid;
+    }
+
+    .box1 {
+        font-weight: 900;
+        color: #000000;
+        margin-bottom: 40px;
+    }
+
+    .box2 {
+        color: #1e1e1e;
+        margin-bottom: 40px;
+    }
+
+    .btn {
+        height: 500px;
+
+        padding: 20px 0px 10px 30px;
+        .btnTop{
+            display: flex;
+            justify-content: space-between;
+            margin-bottom: 25px;
+            h3{
+                font-weight: 900;
+                font-size: 19px;
+                color: #000000;
+            }
+                        button {
+                            width: 170px;
+                            height: 40px;
+                            background-color: #002e97;
+                            right: 30px;
+                            color: #ffffff;
+                            border-radius: 0.4cap;
+                            font-size: 14px;
+                            font-weight: 300;
+                        }
+        }
+    }
+    .btnBtn{
+        height: 110px;
+        width: 1170px;
+        display: flex;
+        justify-content: space-between;
+        margin-bottom: 20px;
+        .left{
+            width: 100px;
+        }
+        .right{
+            position: relative;
+            width: 1000px;
+            height: 110px;
+            background-color: #ffffff;
+            padding: 10px 10px 10px 30px;
+            .time{
+                position: absolute;
+                right: 20px;
+                bottom: 10px;
+                color: #b2b2b2;
+            }
+        }
+    }
+}
+</style>

jeecgboot-vue3/src/views/demo/main-home/components/projectDeclaration/index.vue

@@ -1,52 +1,178 @@
 <template>
   <div class="container">
     <div class="top-filter">
-      <div :class="activeIndex === index ? 'active item' : 'item'" @click="activeIndex = index" class="item " v-for="(item, index) in filterList" :key="index"
+      <div :class="activeIndex === index ? 'active item' : 'item'" @click="activeIndex = index" class="item "
-        ><component :is="item.icon"></component><div style="margin-left: 10px">{{ item.label }}</div></div
+        v-for="(item, index) in filterList" :key="index">
-      >
+        <component :is="item.icon"></component>
+        <div style="margin-left: 10px">{{ item.label }}</div>
+      </div>
+    </div>
+    <div class="mainTop">
+      <div class="resultShow">
+        <div class="top">
+          <div class="a">结果公示</div>
+          <div class="aa">更多</div>
+        </div>
+        <div class="buttom">
+          <ul>
+            <li>浙江省科学技术厅2023年度浙江省科学技术奖提名受理情况公示</li>
+            <li>浙江省科学技术厅关于绍兴黄酒重大科技项目立项</li>
+            <li>浙江省科学技术厅关于拟下达2024年浙江省中央引导地方科技发展资金...</li>
+            <li>关于浙江省人民政府重大委托课题确定中标对象的公示</li>
+            <li>省级部门2023年度预期尚未支付中小企业款项信息公开公示</li>
+            <li>浙江省科学技术厅关于2023年度省级新型研发机构拟认定名单的公示</li>
+            <li>浙江省科学技术厅关于2023年省级新产品试制计划(第二批)拟立项目...</li>
+          </ul>
+        </div>
+      </div>
+      <div class="userInto">
+        <h2>用户登录</h2>
+        <div class="more">个人登录</div>
+        <div class="more">法人登录</div>
+        <div class="more">主管部门登录</div>
+        <div class="more">省科技厅登录</div>
+      </div>
+    </div>
+    <div class="mainCenter">
+      <h2>项目申报流程</h2>
+      <img src="@/assets/images/mainHome/process.png" alt="">
+    </div>
+    <div class="mainCenter1">
+      <h2>计划项目及申报流程示意图</h2>
+      <img src="@/assets/images/mainHome/declare.png" alt="">
     </div>
   </div>
 </template>
 
 <script setup>
-  import { ref } from 'vue';
+import { ref } from 'vue';
-  import { PartitionOutlined, DollarCircleOutlined } from '@ant-design/icons-vue';
+import { PartitionOutlined, DollarCircleOutlined } from '@ant-design/icons-vue';
-  const activeIndex = ref(0);
+const activeIndex = ref(0);
-  const filterList = ref([
+const filterList = ref([
-    { label: '科技省厅', icon: PartitionOutlined },
+  { label: '科技省厅', icon: PartitionOutlined },
-    { label: '管理制度', icon: DollarCircleOutlined },
+  { label: '管理制度', icon: DollarCircleOutlined },
-    { label: '申报项目', icon: DollarCircleOutlined },
+  { label: '申报项目', icon: DollarCircleOutlined },
-    { label: '项目受理', icon: DollarCircleOutlined },
+  { label: '项目受理', icon: DollarCircleOutlined },
-    { label: '立项信息', icon: DollarCircleOutlined },
+  { label: '立项信息', icon: DollarCircleOutlined },
-    { label: '验收情况', icon: DollarCircleOutlined },
+  { label: '验收情况', icon: DollarCircleOutlined },
-    { label: '创新券', icon: DollarCircleOutlined },
+  { label: '创新券', icon: DollarCircleOutlined },
-  ]);
+]);
 </script>
 
 <style scoped lang="less">
-  .container {
+.container {
-    width: 1200px;
+  width: 1200px;
-    margin: 0 auto;
+  margin: 0 auto;
-    margin-top: 20px;
+  margin-top: 20px;
-    .top-filter {
+
+  .top-filter {
+    display: flex;
+    justify-content: space-between;
+
+    .item {
+      display: flex;
+      justify-content: center;
+      width: 167px;
+      height: 70px;
+      text-align: center;
+      line-height: 70px;
+      cursor: pointer;
+      border-radius: 8px;
+      box-shadow: 1px 0px 9px 0px rgba(100, 100, 111, 0.1);
+    }
+
+    .active {
+      color: #fff;
+      background-color: #002e97;
+    }
+  }
+}
+
+.mainTop {
+  width: 1200px;
+  height: 315px;
+  margin: 25px auto;
+  margin-top: 40px;
+  display: flex;
+  justify-content: space-between;
+
+  .resultShow {
+    height: 100%;
+    width: 770px;
+
+    .top{
+      height: 40px;
+      line-height: 40PX;
+      padding: 0 20px;
       display: flex;
       justify-content: space-between;
-      .item {
+      border-bottom: 1px solid #dbdcdd;
-        display: flex;
+    }
-        justify-content: center;
+    .buttom{
-
+      margin:10px 0 0 25px ;
-        width: 167px;
-        height: 70px;
-        text-align: center;
-        line-height: 70px;
-        cursor: pointer;
-        border-radius: 8px;
-        box-shadow: 1px 0px 9px 0px rgba(100, 100, 111, 0.1);
-      }
-      .active {
-        color: #fff;
-        background-color: #002e97;
-      }
     }
+    .buttom ul li{
+      padding: 5px 0 ;
+      list-style-type:disc;
+    }
+  }
+
+  .userInto {
+    height: 100%;
+    width: 350px;
+    background-color: #ffffff;
+    border-radius: 1.5cap;
+
+    h2 {
+      margin-top: 20px;
+      font-weight: 900;
+      text-align: center;
+    }
+
+    .more {
+      text-align: center;
+      width: 240px;
+      height: 40px;
+      line-height: 40px;
+      background-color: #0763e4;
+      color: #e3ebf8;
+      border-radius: 1cap;
+      margin: 15px 58px;
+    }
+  }
+}
+.mainCenter{
+  width: 1200px;
+  height: 350px;
+  background-color: #fff;
+  text-align: center;
+  padding-top:30px ;
+  h2{
+    font-weight: 900;
+    font-size: 30px;
+    color: #333333;
+
+  }
+  img{
+    width: 900px;
+  }
+}
+.mainCenter1{
+  width: 1200px;
+  height: 800px;
+background-color: #f3f6fb;
+  text-align: center;
+  padding-top: 50px;
+
+  h2 {
+    font-weight: 900;
+    font-size: 30px;
+    color: #333333;
+margin-bottom: 30px;
+  }
+
+  img {
+    width: 1100px;
   }
+}
 </style>

jeecgboot-vue3/src/views/demo/main-home/index.vue

@@ -36,7 +36,7 @@
       <div class="shortcut">
         <div class="wrapper">
           <ul>
-            <li :class="activeIndex === index ? 'active' : ''" @click="goTo(item,index)" v-for="(item, index) in mainOutRoutes[1].children" :key="index">{{ item.meta.title }}</li>
+            <li :class="activeIndex === index ? 'active' : ''" @click="goTo(item,index)" v-for="(item, index) in navList"  :key="index">{{ item.meta.title }}</li>
             <!-- <li>仪器共享</li>
             <li>项目申报</li>
             <li>专家管理</li>
@@ -98,6 +98,9 @@
     activeIndex.value = index;
     router.push(item.path);
   };
+const navList = mainOutRoutes[1].children?.filter(item => !item.meta.hidden)
+console.log(navList,'navList');
+
 </script>
 
 <style lang="less" scoped>

jeecgboot-vue3/vite.config.ts

@@ -67,7 +67,7 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
       https: false,
       port: VITE_PORT,
       // Load proxy configuration from .env
-      proxy: createProxy(VITE_PROXY),
+      // proxy: createProxy(VITE_PROXY),
     },
     build: {
       minify: 'esbuild',

package.json

@@ -0,0 +1,5 @@
+{
+	"dependencies": {
+		"vue3-scroll-seamless": "^1.0.6"
+	}
+}