登录注册

src/App.vue

@@ -1,11 +1,7 @@
-<script setup>
-import zhCN from 'ant-design-vue/es/locale/zh_CN'
-</script>
+<script setup></script>
 
 <template>
-  <a-config-provider :locale="zhCN">
-    <router-view />
-  </a-config-provider>
+  <router-view />
 </template>
 
 <style lang="scss">

src/components/AdaptiveView/index.vue

@@ -9,7 +9,7 @@ export default {
   props: {
     width: {
       type: String,
-      default: window.innerWidth - 17
+      default: window.innerWidth
     },
     height: {
       type: String,

src/components/custom/custom-layout.vue

@@ -0,0 +1,298 @@
+<template>
+  <div id="c-layout">
+    <div class="header" height="120px">
+      <el-col :span="24" class="header_1">
+        <div class="left">
+          <el-image class="image" :src="siteInfo.logoUrl" fit="fill" />
+          <div class="content">
+            <text class="title">{{ siteInfo.zhTitle }}</text>
+          </div>
+        </div>
+        <div class="right">
+          <span @click="toLogin('0')">注册</span>
+          <span>|</span>
+          <span @click="toLogin('1')">登录</span>
+        </div>
+      </el-col>
+      <el-col :span="24" class="header_2">
+        <el-col :span="24" class="list">
+          <div
+            class="text"
+            v-for="(item, index) in data"
+            :key="index"
+            @click="selectMenu(item.route)"
+            :style="{
+              backgroundColor: item.hover ? '#1073ff' : 'transparent',
+              color: item.hover ? '#ffffff' : ''
+            }"
+            @mouseover="handleMouseOver(index)"
+            @mouseleave="handleMouseLeave(index)"
+          >
+            <div>{{ item.title }}</div>
+          </div>
+        </el-col>
+        <div v-if="info && info.children" class="info">
+          <el-row v-if="info.key == '3'" style="justify-content: center; margin: 10px 0 0 0">
+            <el-col :span="11" class="list_1" v-for="(item, index) in info.children" :key="index">
+              <div class="title">{{ item.title }}</div>
+              <div class="list_1_1">
+                <div
+                  v-for="(tag, indexs) in item.children"
+                  :key="indexs"
+                  class="title1"
+                  @click="selectMenu(tag.route)"
+                >
+                  {{ tag.title }}
+                </div>
+              </div>
+            </el-col>
+          </el-row>
+          <el-row v-else>
+            <el-col :span="24" class="list_2">
+              <div
+                v-for="(item, index) in info.children"
+                :key="index"
+                class="title1"
+                @click="selectMenu(item.route)"
+              >
+                {{ item.title }}
+              </div>
+            </el-col>
+          </el-row>
+        </div>
+      </el-col>
+    </div>
+    <div class="main">
+      <slot></slot>
+    </div>
+    <div class="footer" v-if="is_foot" height="235px">
+      <div class="footer_1">
+        <div class="left">
+          <el-image class="image" :src="footInfo.Logo" fit="fill" />
+          <div class="title">电话：{{ footInfo.Phone }}</div>
+          <div class="title">邮箱：{{ footInfo.Email }}</div>
+          <div class="title">地址：{{ footInfo.Address }}</div>
+        </div>
+        <div class="right">
+          <el-image class="image" :src="footInfo.Code" fit="fill" />
+          <div class="title">关于我们</div>
+        </div>
+      </div>
+      <div class="footer_2">
+        {{ footInfo.Copyright }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { siteInfo, footInfo, menuList } from '@/layout/site'
+// 接口
+import { DesignStore } from '@/store/api/platform/design'
+const designStore = DesignStore()
+const router = useRouter()
+const route = useRoute()
+const $checkRes = inject('$checkRes')
+const props = defineProps({
+  is_foot: { type: Boolean, default: () => true }
+})
+const configInfo = ref({})
+const data = ref([])
+const info = ref({})
+// 请求
+onMounted(async () => {
+  search()
+})
+const search = async () => {
+  for (const val of menuList) {
+    if (route.name === val.route) val.hover = true
+    else val.hover = false
+  }
+  data.value = menuList
+  // 基础设置
+  const result = await designStore.query({})
+  if ($checkRes(result)) configInfo.value = result.data[0] || {}
+}
+// 登录|注册
+const toLogin = (status) => {
+  router.push({ path: '/login', query: { status } })
+}
+const selectMenu = (item, query) => {
+  for (const val of data.value) {
+    if (route.name === val.route) val.hover = true
+    else val.hover = false
+  }
+  router.push({ path: `/${item}`, query })
+}
+const handleMouseOver = (index) => {
+  console.log(index)
+}
+const handleMouseLeave = (index) => {
+  console.log(index)
+}
+</script>
+
+<style lang="scss" scoped>
+#c-layout {
+  .header {
+    padding: 0;
+    position: sticky;
+    top: 0;
+    z-index: 1000;
+    background: $global-color-fff;
+    .header_1 {
+      display: flex;
+      justify-content: space-between;
+      .left {
+        display: flex;
+        .image {
+          height: 60px;
+          width: 240px;
+          margin: 0 5px 0 0;
+        }
+        .content {
+          padding: 10px 0 0 0;
+          font-size: $global-font-size-34;
+          font-family: 'Comic Sans MS', cursive;
+        }
+      }
+      .right {
+        display: flex;
+        padding: 10px 0 0 0;
+        font-size: $global-font-size-20;
+        color: $global-color-107;
+        span {
+          margin: 0 10px;
+        }
+      }
+    }
+    .header_2 {
+      .list {
+        display: flex;
+        justify-content: space-around;
+        .text {
+          text-align: center;
+          width: 145px;
+          height: 58px;
+          padding: 10px 0;
+          font-family: Microsoft YaHei;
+          font-size: $global-font-size-24;
+          color: #333333;
+          cursor: pointer; /* 改变鼠标样式为手形 */
+        }
+      }
+      .info {
+        width: 100%;
+        position: absolute;
+        left: 0;
+        background: #ffffff;
+        padding: 10px 0;
+        .list_1 {
+          margin: 0 10px 0 0;
+          border: #e4e4e4 1px dashed;
+          .title {
+            margin: 5px 0;
+            font-size: $global-font-size-18;
+            font-weight: 600;
+            text-align: center;
+            color: #252f49;
+          }
+          .title::before {
+            content: '';
+            position: absolute;
+            transform: translateY(-50%);
+            top: 15px;
+            margin-left: -70px;
+            width: 40px;
+            height: 1px;
+            border-bottom: 1px #252f49 solid;
+          }
+          .title::after {
+            content: '';
+            position: absolute;
+            transform: translateY(-50%);
+            top: 15px;
+            margin-left: 30px;
+            width: 40px;
+            height: 1px;
+            border-bottom: 1px #252f49 solid;
+          }
+          .list_1_1 {
+            display: flex;
+            flex-wrap: wrap;
+            justify-content: center;
+            margin: 5px 0;
+            .title1 {
+              width: 110px;
+              margin: 8px;
+              padding: 5px;
+              text-align: center;
+              border: 1px #fff solid;
+              background-image: linear-gradient(to bottom, #f8f3ff 0%, #e0e8fe 100%);
+              border-radius: 4px;
+            }
+            .title1:hover {
+              background: #2280ff;
+              color: #ffffff;
+            }
+          }
+        }
+        .list_2 {
+          display: flex;
+          flex-wrap: wrap;
+          justify-content: center;
+          margin: 5px 0;
+          .title1 {
+            width: 110px;
+            margin: 8px;
+            padding: 5px;
+            text-align: center;
+            border: 1px #fff solid;
+            background-image: linear-gradient(to bottom, #f8f3ff 0%, #e0e8fe 100%);
+            border-radius: 4px;
+          }
+          .title1:hover {
+            background: #2280ff;
+            color: #ffffff;
+          }
+        }
+      }
+    }
+  }
+  .main {
+    padding: 0;
+  }
+  .footer {
+    padding: 0;
+    background-color: $global-color-2D2;
+    color: $global-color-fff;
+    font-size: $global-font-size-18;
+    .footer_1 {
+      padding: 10px 0;
+      display: flex;
+      justify-content: space-between;
+      border-bottom: 1px solid $global-color-bbb;
+      .left {
+        .title {
+          margin: 5px 0 0 0;
+        }
+      }
+      .right {
+        text-align: center;
+        .title {
+          margin: 5px 0 0 0;
+        }
+      }
+    }
+    .footer_2 {
+      padding: 10px 0 0 0;
+    }
+  }
+}
+@media screen and (min-width: 1921px) {
+  // #c-layout {
+  //   width: 1200px;
+  //   margin: 0 auto;
+  // }
+}
+</style>

src/components/dataV/myMain.vue

@@ -40,7 +40,7 @@ export default {
       this.allWidth = width
       this.allHeight = height
 
-      dom.style.width = `${width - 20}px`
+      dom.style.width = `${width}px`
       dom.style.height = `${height}px`
     },
     setAppScale() {

src/layout/site.js

@@ -1,5 +1,6 @@
 // 图片引入
 import logo from '/images/logo.png'
+import Logo from '/images/logoFoot.png'
 import Code from '/images/code.jpg'
 // 网站基本设置
 export const siteInfo = {
@@ -16,6 +17,7 @@ export const footInfo = {
   Address: '吉林省长春市汽车经济技术开发区兴顺路1366号',
   Copyright: 'Copyright ©2022  吉林省工业技术研究院集团有限公司  All Rights Reserved ',
   Company: '吉林省工业技术研究院集团有限公司',
+  Logo,
   Code
 }
 // 目录设置

src/router/index.js

@@ -6,13 +6,91 @@ const router = createRouter({
   routes: [
     {
       path: '/',
-      redirect: '/home'
+      redirect: '/one'
     },
     {
-      path: '/home',
-      name: 'home',
+      path: '/one',
+      name: 'one',
       meta: { title: '产学研用协同创新数字化平台' },
-      component: () => import('@/views/home/index.vue')
+      component: () => import('@/views/one/index.vue')
+    },
+    {
+      path: '/two',
+      name: 'two',
+      meta: { title: '产学研用协同创新数字化平台-信息发布' },
+      component: () => import('@/views/two/index.vue')
+    },
+    {
+      path: '/thr',
+      name: 'thr',
+      meta: { title: '产学研用协同创新数字化平台-创新中心' },
+      component: () => import('@/views/thr/index.vue')
+    },
+    {
+      path: '/four',
+      name: 'four',
+      meta: { title: '产学研用协同创新数字化平台-信息检索' },
+      component: () => import('@/views/four/index.vue')
+    },
+    {
+      path: '/five',
+      name: 'five',
+      meta: { title: '产学研用协同创新数字化平台-双创活动' },
+      component: () => import('@/views/five/index.vue')
+    },
+    {
+      path: '/six',
+      name: 'six',
+      meta: { title: '产学研用协同创新数字化平台-中试平台' },
+      component: () => import('@/views/six/index.vue')
+    },
+    {
+      path: '/seven',
+      name: 'seven',
+      meta: { title: '产学研用协同创新数字化平台-服务支撑' },
+      component: () => import('@/views/seven/index.vue')
+    },
+    {
+      path: '/eight',
+      name: 'eight',
+      meta: { title: '产学研用协同创新数字化平台-产业集群' },
+      component: () => import('@/views/eight/index.vue')
+    },
+    {
+      path: '/nine',
+      name: 'nine',
+      meta: { title: '产学研用协同创新数字化平台-成果展示' },
+      component: () => import('@/views/nine/index.vue')
+    },
+    {
+      path: '/ten',
+      name: 'ten',
+      meta: { title: '产学研用协同创新数字化平台-信息库' },
+      component: () => import('@/views/ten/index.vue')
+    },
+    {
+      path: '/eleven',
+      name: 'eleven',
+      meta: { title: '产学研用协同创新数字化平台-孵化器' },
+      component: () => import('@/views/eleven/index.vue')
+    },
+    {
+      path: '/twelve',
+      name: 'twelve',
+      meta: { title: '产学研用协同创新数字化平台-产业孵化大脑' },
+      component: () => import('@/views/twelve/index.vue')
+    },
+    {
+      path: '/thirteen',
+      name: 'thirteen',
+      meta: { title: '产学研用协同创新数字化平台-行研产研' },
+      component: () => import('@/views/thirteen/index.vue')
+    },
+    {
+      path: '/login',
+      name: 'login',
+      meta: { title: '产学研用协同创新数字化平台' },
+      component: () => import('@/views/login/index.vue')
     },
     {
       path: '/loading',

src/styles/variables.scss

@@ -13,7 +13,17 @@ $global-font-size-23: 23px;
 $global-font-size-24: 24px;
 $global-font-size-25: 25px;
 $global-font-size-26: 26px;
+$global-font-size-28: 28px;
 $global-font-size-30: 30px;
+$global-font-size-34: 34px;
+$global-font-size-36: 36px;
+$global-font-size-46: 46px;
+$global-font-size-48: 48px;
+$global-color-107: #1073ff;
+$global-color-2D2: #2d2d2d;
+$global-color-fff: #ffffff;
+$global-color-bbb: #bbbbbb;
+
 /* 全局覆盖antd表格表头样式 */
 .ant-table-thead > tr > th {
   font-size: 18px; /* 设置表头字体大小 */

src/views/eight/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/home/index.vue

@@ -2,14 +2,15 @@
   <div class="main">
     <el-row>
       <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
-        首页
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
       </el-col>
     </el-row>
   </div>
 </template>
 
 <script setup>
-import { siteInfo, footInfo, menuList } from '@/layout/site'
 import { UserStore } from '@/store/user'
 const userStore = UserStore()
 const user = computed(() => userStore.user)

src/views/five/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/four/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/login/index.vue

@@ -0,0 +1,118 @@
+<template>
+  <div id="index">
+    <el-row>
+      <el-col :span="24" class="main animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout :is_foot="false">
+          <el-col :span="24" class="one">
+            <div v-if="status === '0'" class="one_1">
+              <register></register>
+            </div>
+            <div v-else class="one_2">
+              <login></login>
+            </div>
+          </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+    <el-dialog v-model="dialog" title="使用协议">
+      <div v-html="configInfo.agreement"></div>
+    </el-dialog>
+  </div>
+</template>
+<script setup>
+// 接口
+import { DictDataStore } from '@/store/api/system/dictData'
+import { DesignStore } from '@/store/api/platform/design'
+import { RoleStore } from '@/store/api/system/role'
+const dictDataStore = DictDataStore()
+const designStore = DesignStore()
+const roleStore = RoleStore()
+const $checkRes = inject('$checkRes')
+// 组件
+import login from './parts/login.vue'
+import register from './parts/register.vue'
+// 加载中
+const loading = ref(false)
+const route = useRoute()
+const dialog = ref(false)
+const configInfo = ref({})
+const status = ref('0')
+// 字典
+const typeList = ref([])
+const genderList = ref([])
+const roleList = ref([])
+// 请求
+onMounted(async () => {
+  loading.value = true
+  await search()
+  await searchOther()
+  loading.value = false
+})
+const search = async () => {
+  if (route.query.status) {
+    status.value = route.query.status
+  }
+}
+const searchOther = async () => {
+  let result
+  // 性别
+  result = await dictDataStore.query({ code: 'gender', is_use: '0' })
+  if ($checkRes(result)) genderList.value = result.data
+  // 用户类型
+  result = await dictDataStore.query({ code: 'userType', is_use: '0' })
+  if ($checkRes(result)) typeList.value = result.data
+  // 用户角色
+  result = await roleStore.query({ is_use: '0', is_admin_role: '0' })
+  if ($checkRes(result)) roleList.value = result.data
+  // 基础设置
+  result = await designStore.query({})
+  if ($checkRes(result)) configInfo.value = result.data[0] || {}
+}
+watch(
+  route,
+  (newVal) => {
+    if (newVal && newVal.query) {
+      if (newVal.query?.status) status.value = route.query.status
+    }
+  },
+  {
+    immediate: true //初始化立即执行
+  }
+)
+provide('configInfo', configInfo)
+// 字典
+provide('typeList', typeList)
+provide('genderList', genderList)
+provide('roleList', roleList)
+</script>
+<style scoped lang="scss">
+.main {
+  .one {
+    position: relative;
+    background-image: url(/images/bg_login.jpg);
+    background-position: center center;
+    background-repeat: no-repeat;
+    height: calc(100vh - 13.1vh);
+    width: 100%;
+    background-size: cover;
+    .one_1 {
+      width: 600px;
+      position: absolute;
+      top: 5%;
+      right: 10%;
+      background-color: $global-color-fff;
+      padding: 10px;
+      border-radius: 20px;
+    }
+    .one_2 {
+      width: 450px;
+      position: absolute;
+      top: 20%;
+      right: 15%;
+      background-color: $global-color-fff;
+      padding: 10px;
+      border-radius: 20px;
+    }
+  }
+}
+</style>

src/views/login/parts/login.vue

@@ -0,0 +1,188 @@
+<template>
+  <div class="register">
+    <div class="one">登录</div>
+    <div class="two">
+      <el-col :span="24" class="tab">
+        <el-col
+          :span="9"
+          class="title"
+          @click="toTab(0)"
+          :class="[activeName == '0' ? 'tab0' : 'tab1']"
+          >用户名密码登录</el-col
+        >
+        <el-col
+          :span="9"
+          class="title"
+          @click="toTab(1)"
+          :class="[activeName == '1' ? 'tab0' : 'tab1']"
+          >短信快捷登录</el-col
+        >
+      </el-col>
+      <el-form
+        ref="ruleFormRef"
+        :model="form"
+        :rules="rules"
+        label-width="100px"
+        class="form"
+        label-position="left"
+      >
+        <el-col :span="24" class="content">
+          <el-form-item label="账号" prop="account">
+            <el-input clearable v-model="form.account" placeholder="请输入账号">
+              <template #prefix>
+                <el-icon>
+                  <User />
+                </el-icon>
+              </template>
+            </el-input>
+          </el-form-item>
+          <el-form-item label="密码" prop="password">
+            <el-input
+              v-model="form.password"
+              type="password"
+              show-password
+              placeholder="请输入登录密码"
+            >
+              <template #prefix>
+                <el-icon>
+                  <Unlock />
+                </el-icon>
+              </template>
+            </el-input>
+          </el-form-item>
+          <el-col :span="24" class="remark">
+            <span>忘记密码?</span>
+          </el-col>
+          <el-col :span="24" class="button">
+            <el-button type="primary" @click="submitForm(ruleFormRef)">登录</el-button>
+          </el-col>
+          <el-col :span="24" class="text">
+            <span>没有账号</span>
+            <span @click="toRegister">立即注册</span>
+          </el-col>
+        </el-col>
+      </el-form>
+    </div>
+  </div>
+</template>
+<script setup>
+// 基础
+import { cloneDeep } from 'lodash-es'
+// 接口
+import { LoginStore } from '@/store/api/login'
+const loginStore = LoginStore()
+// 路由
+const router = useRouter()
+const activeName = ref(0)
+// 加载中
+const form = ref({})
+const ruleFormRef = ref()
+const rules = reactive({
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }]
+})
+// 选择
+const toTab = async (active) => {
+  activeName.value = active
+  form.value = {}
+}
+// 登录
+const submitForm = async (formEl) => {
+  if (!formEl) return
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      const data = cloneDeep(form.value)
+      data.type = 'User'
+      const res = await loginStore.login(data)
+      if (res.errcode == '0') {
+        ElMessage({ message: `登录成功`, type: 'success' })
+        localStorage.setItem('token', res.data)
+        // 路由
+        router.push({ path: '/' })
+      } else {
+        ElMessage({ message: `${res.errmsg}`, type: 'error' })
+      }
+    } else {
+      console.log('error submit!', fields)
+    }
+  })
+}
+// 去注册
+const toRegister = () => {
+  router.push({ path: '/login', query: { status: '0' } })
+}
+</script>
+<style scoped lang="scss">
+.register {
+  .one {
+    text-align: center;
+    font-size: $global-font-size-24;
+    font-weight: bold;
+    padding: 5px 0 10px 0;
+  }
+  .two {
+    .tab {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin: 10px;
+
+      .title {
+        text-align: center;
+        margin: 0 40px;
+        font-family: PingFangSC-Semibold !important;
+        font-size: $global-font-size-20;
+        letter-spacing: -0.14px;
+        line-height: 32px;
+        font-weight: bold;
+      }
+
+      .tab0 {
+        color: #1492ff;
+        border-bottom: 2px solid;
+        border-bottom-color: #1492ff;
+        padding-bottom: 10px;
+      }
+
+      .tab1 {
+        color: #333333;
+        padding-bottom: 10px;
+      }
+    }
+    .content {
+      padding: 20px;
+      .remark {
+        text-align: right;
+        margin: 10px 0;
+        color: #9a9a9a;
+      }
+      .button {
+        text-align: center;
+        padding: 10px 0;
+
+        :deep(.el-button) {
+          width: 100px !important;
+          height: 44px !important;
+          border: 0 !important;
+          border-radius: 50px !important;
+          color: #f8f8f8 !important;
+          font-size: $global-font-size-18 !important;
+          text-align: center !important;
+          line-height: 40px !important;
+          cursor: pointer !important;
+          font-family: PingFangSC-Regular !important;
+          background-color: $global-color-107 !important;
+        }
+      }
+      .text {
+        text-align: center;
+        font-size: $global-font-size-18;
+        span:last-child {
+          color: $global-color-107;
+          margin: 0 0 0 2px;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/login/parts/register.vue

@@ -0,0 +1,235 @@
+<template>
+  <div class="register">
+    <div class="one">注册</div>
+    <div class="two">
+      <el-form
+        ref="ruleFormRef"
+        :model="form"
+        :rules="rules"
+        label-width="100px"
+        class="form"
+        label-position="left"
+      >
+        <el-form-item label="注册类型" prop="type">
+          <el-radio-group v-model="form.type">
+            <el-radio label="普通用户" value="0"></el-radio>
+            <el-radio label="角色用户" value="1"></el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="角色选择" prop="role" v-if="form.type === '1'">
+          <el-checkbox-group v-model="form.role">
+            <el-checkbox
+              v-for="(item, index) in roleList"
+              :key="index"
+              :value="item.code"
+              name="type"
+              >{{ item.name }}</el-checkbox
+            >
+          </el-checkbox-group>
+        </el-form-item>
+        <el-form-item label="板块选择" prop="plate">
+          <el-checkbox-group v-model="form.plate">
+            <el-checkbox
+              v-for="(item, index) in plateList"
+              :key="index"
+              :value="item.value"
+              name="type"
+              >{{ item.label }}</el-checkbox
+            >
+          </el-checkbox-group>
+        </el-form-item>
+        <el-form-item label="姓名" prop="nick_name">
+          <el-input clearable v-model="form.nick_name" placeholder="请输入姓名/单位名称">
+            <template #prefix>
+              <el-icon>
+                <Avatar />
+              </el-icon>
+            </template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="手机号" prop="phone">
+          <el-input clearable v-model="form.phone" placeholder="请输入手机号">
+            <template #prefix>
+              <el-icon>
+                <Iphone />
+              </el-icon>
+            </template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="验证码" prop="checkCode">
+          <el-input
+            class="check-code-box"
+            v-model.number="form.checkCode"
+            placeholder="请输入验证码"
+          >
+            <template #prefix>
+              <el-icon>
+                <Message />
+              </el-icon>
+            </template>
+            <template v-slot:append>
+              <el-button :disabled="codeCd" @click="handleCaptcha('form')"
+                >获取验证码
+                <span v-if="codeCd">({{ long }})</span>
+              </el-button>
+            </template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="密码" prop="password">
+          <el-input
+            v-model="form.password"
+            type="password"
+            show-password
+            placeholder="请输入登录密码"
+          >
+            <template #prefix>
+              <el-icon>
+                <Unlock />
+              </el-icon>
+            </template>
+          </el-input>
+        </el-form-item>
+        <el-col :span="24" class="button">
+          <el-button type="primary" @click="submitForm(ruleFormRef)">注册</el-button>
+        </el-col>
+        <el-col :span="24" class="text">
+          <span>已有账号</span>
+          <span @click="toLogin">去登录</span>
+        </el-col>
+      </el-form>
+    </div>
+  </div>
+</template>
+<script setup>
+import { cloneDeep } from 'lodash-es'
+// 路由
+const router = useRouter()
+// 接口
+import { UsersStore } from '@/store/api/user/user'
+const store = UsersStore()
+const form = ref({ role: ['User'] })
+// 表单验证
+const ruleFormRef = ref()
+const roleList = inject('roleList')
+// 用户协议
+const isAgree = ref(false)
+const plateList = ref([
+  { label: '汽车电子及新型汽车零部件', value: '0' },
+  { label: '精细化工及天然气化工', value: '1' },
+  { label: '农产品加工及绿色食品', value: '2' },
+  { label: '光电子及智能传感器', value: '3' },
+  { label: '车规级芯片及功率半导体器件', value: '4' },
+  { label: '新能源及动力电池', value: '5' },
+  { label: '生物基新材料', value: '6' },
+  { label: '人工智能及智能机器人', value: '7' },
+  { label: '碳纤维及复合材料', value: '8' },
+  { label: '遥感卫星及航天航空技术', value: '9' },
+  { label: '精密仪器及先进装备', value: '10' },
+  { label: '生物医药及先进医疗器械', value: '11' }
+])
+const validatePhoneNumber = (rule, value, callback) => {
+  const reg = /^1[3-9]\d{9}$/
+  if (!value) {
+    return callback(new Error('手机号不能为空'))
+  }
+  if (!reg.test(value)) {
+    return callback(new Error('请输入正确的手机号'))
+  }
+  callback()
+}
+const rules = reactive({
+  nick_name: [{ required: true, message: '请输入昵称', trigger: 'blur' }],
+  phone: [{ required: true, validator: validatePhoneNumber, trigger: 'blur' }],
+  account: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+  password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  type: [{ required: true, message: '请选择注册类型', trigger: 'blur' }],
+  role: [{ required: true, message: '请选择角色', trigger: 'blur' }],
+  plate: [{ required: true, message: '请选择板块', trigger: 'blur' }],
+  checkCode: [{ required: true, message: '请输入验证码', trigger: 'blur' }]
+})
+// 注册
+const submitForm = async (formEl) => {
+  if (!isAgree.value) {
+    ElMessage({
+      message: '请阅读并同意用户协议和隐私政策',
+      type: 'warning'
+    })
+    return
+  }
+  if (!formEl) return
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      const data = cloneDeep(form.value)
+      const user = await store.query({ account: data.nick_name })
+      if (user.total === 0) {
+        data.account = data.nick_name
+        data.gender = '0'
+        if (data.role === 'User') data.role = [data.role]
+        else data.role = ['User', ...[data.role]]
+        delete data.refpassword
+        delete data.checkCode
+        delete data.plate
+        delete data.type
+        const res = await store.create(data)
+        if (res.errcode === 0) {
+          ElMessage({
+            message: '注册用户成功，审核中请稍后登录',
+            type: 'success'
+          })
+          router.push({ path: '/login' })
+        }
+      } else {
+        ElMessage({
+          message: '已有相同姓名或实验室名称 请重新输入！',
+          type: 'warning'
+        })
+      }
+    } else {
+      console.log('error submit!', fields)
+    }
+  })
+}
+// 去登录
+const toLogin = () => {
+  router.push({ path: '/login', query: { status: '1' } })
+}
+</script>
+<style scoped lang="scss">
+.register {
+  .one {
+    text-align: center;
+    font-size: $global-font-size-24;
+    font-weight: bold;
+    padding: 5px 0 10px 0;
+  }
+  .two {
+    padding: 0 20px;
+    .button {
+      text-align: center;
+      padding: 10px 0;
+
+      :deep(.el-button) {
+        width: 100px !important;
+        height: 44px !important;
+        border: 0 !important;
+        border-radius: 50px !important;
+        color: #f8f8f8 !important;
+        font-size: $global-font-size-18 !important;
+        text-align: center !important;
+        line-height: 40px !important;
+        cursor: pointer !important;
+        font-family: PingFangSC-Regular !important;
+        background-color: $global-color-107 !important;
+      }
+    }
+    .text {
+      text-align: center;
+      font-size: $global-font-size-18;
+      span:last-child {
+        color: $global-color-107;
+        margin: 0 0 0 2px;
+      }
+    }
+  }
+}
+</style>

src/views/nine/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/one/index.vue

@@ -0,0 +1,67 @@
+<template>
+  <custom-layout>
+    <el-col :span="24" class="one">
+      <el-carousel height="600px">
+        <el-carousel-item v-for="(item, index) in carouselList" :key="index">
+          <el-image class="image" :src="item.url" fit="fill" />
+        </el-carousel-item>
+      </el-carousel>
+    </el-col>
+    <el-col :span="24" class="two">
+      <div class="two_1">
+        <div class="title">新闻资讯</div>
+      </div>
+    </el-col>
+  </custom-layout>
+</template>
+
+<script setup>
+// 图片引入
+import match_1 from '/images/match_1.jpg'
+import match_2 from '/images/match_2.jpg'
+import match_3 from '/images/match_3.jpg'
+import match_4 from '/images/match_4.jpg'
+import match_5 from '/images/match_5.jpg'
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+const carouselList = ref([
+  { url: match_1 },
+  { url: match_2 },
+  { url: match_3 },
+  { url: match_4 },
+  { url: match_5 }
+])
+</script>
+<style scoped lang="scss">
+.main {
+  .one {
+    .image {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .two {
+    margin: 20px 0;
+    .two_1 {
+      display: flex;
+      justify-content: center;
+      .title {
+        background-image: url(/images/sg-title.png);
+        background-position: center center;
+        background-repeat: no-repeat;
+        background-size: cover;
+        text-align: center;
+        font-size: $global-font-size-46;
+        width: 500px;
+        line-height: 46px;
+        height: 46px;
+      }
+    }
+  }
+}
+</style>

src/views/seven/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/six/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/ten/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/thirteen/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/thr/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/twelve/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>

src/views/two/index.vue

@@ -0,0 +1,25 @@
+<template>
+  <div class="main">
+    <el-row>
+      <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
+        <custom-layout>
+          <el-col :span="24" class="one">首页 </el-col>
+        </custom-layout>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { UserStore } from '@/store/user'
+const userStore = UserStore()
+const user = computed(() => userStore.user)
+// 加载中
+const loading = ref(false)
+// 路由
+const router = useRouter()
+</script>
+<style scoped lang="scss">
+.main {
+}
+</style>