Commit d23b464c authored by chenjiahao's avatar chenjiahao

修改图片路径&图片导入方式;

将进入后台的入口移动至底部
parent d6c8a56f
...@@ -18,7 +18,7 @@ import { setupStore } from '@/store'; ...@@ -18,7 +18,7 @@ import { setupStore } from '@/store';
import App from './App.vue'; import App from './App.vue';
// 默认打包所有静态资源 // 默认打包所有静态资源
import.meta.glob('@/assets/*/*.{png,jpg,gif,svg}', { eager: true }); import.meta.glob('@/assets/**/*.{png,jpg,gif,svg}', { eager: true });
async function bootstrap() { async function bootstrap() {
const app = createApp(App); const app = createApp(App);
......
<template> <template>
<!-- <LoginFormTitle v-show="getShow" class="enter-x" />--> <!-- <LoginFormTitle v-show="getShow" class="enter-x" />-->
<Form <Form
class="p-4 enter-x" class="p-4 enter-x"
:model="formData" :model="formData"
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
class="fix-auto-fill" class="fix-auto-fill"
> >
<template #prefix> <template #prefix>
<img src="@/assets/svg/mallHome/login_yonghu.svg"> <img src="@/assets/svg/mallHome/login_yonghu.svg" />
</template> </template>
</Input> </Input>
</FormItem> </FormItem>
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
:placeholder="t('sys.login.password')" :placeholder="t('sys.login.password')"
> >
<template #prefix> <template #prefix>
<img src="@/assets/svg/mallHome/login_mima.svg"> <img src="@/assets/svg/mallHome/login_mima.svg" />
</template> </template>
</InputPassword> </InputPassword>
</FormItem> </FormItem>
...@@ -44,14 +44,14 @@ ...@@ -44,14 +44,14 @@
</Checkbox> </Checkbox>
</FormItem> </FormItem>
</ACol> </ACol>
<!-- <ACol :span="12">--> <!-- <ACol :span="12">-->
<!-- <FormItem :style="{ 'text-align': 'right' }">--> <!-- <FormItem :style="{ 'text-align': 'right' }">-->
<!-- &lt;!&ndash; No logic, you need to deal with it yourself &ndash;&gt;--> <!-- &lt;!&ndash; No logic, you need to deal with it yourself &ndash;&gt;-->
<!-- <Button type="link" size="small" @click="setLoginState(LoginStateEnum.RESET_PASSWORD)">--> <!-- <Button type="link" size="small" @click="setLoginState(LoginStateEnum.RESET_PASSWORD)">-->
<!-- {{ t('sys.login.forgetPassword') }}--> <!-- {{ t('sys.login.forgetPassword') }}-->
<!-- </Button>--> <!-- </Button>-->
<!-- </FormItem>--> <!-- </FormItem>-->
<!-- </ACol>--> <!-- </ACol>-->
</ARow> </ARow>
<FormItem class="enter-x"> <FormItem class="enter-x">
...@@ -64,12 +64,12 @@ ...@@ -64,12 +64,12 @@
</FormItem> </FormItem>
<ARow class="enter-x"> <ARow class="enter-x">
<ACol :span="12"> <ACol :span="12">
<!-- <FormItem :style="{ 'text-align': 'left' }">--> <!-- <FormItem :style="{ 'text-align': 'left' }">-->
<!-- &lt;!&ndash; No logic, you need to deal with it yourself &ndash;&gt;--> <!-- &lt;!&ndash; No logic, you need to deal with it yourself &ndash;&gt;-->
<!-- <Button type="link" size="small" @click="setLoginState(LoginStateEnum.RESET_PASSWORD)">--> <!-- <Button type="link" size="small" @click="setLoginState(LoginStateEnum.RESET_PASSWORD)">-->
<!-- {{ t('sys.login.forgetPassword') }}--> <!-- {{ t('sys.login.forgetPassword') }}-->
<!-- </Button>--> <!-- </Button>-->
<!-- </FormItem>--> <!-- </FormItem>-->
<slot name="forgetmm"></slot> <slot name="forgetmm"></slot>
</ACol> </ACol>
<!-- <ACol :span="12">--> <!-- <ACol :span="12">-->
...@@ -82,33 +82,33 @@ ...@@ -82,33 +82,33 @@
<!-- </ACol>--> <!-- </ACol>-->
</ARow> </ARow>
<!-- <ARow class="enter-x" :gutter="[16, 16]">--> <!-- <ARow class="enter-x" :gutter="[16, 16]">-->
<!-- <ACol :md="8" :xs="24">--> <!-- <ACol :md="8" :xs="24">-->
<!-- <Button block @click="setLoginState(LoginStateEnum.MOBILE)">--> <!-- <Button block @click="setLoginState(LoginStateEnum.MOBILE)">-->
<!-- {{ t('sys.login.mobileSignInFormTitle') }}--> <!-- {{ t('sys.login.mobileSignInFormTitle') }}-->
<!-- </Button>--> <!-- </Button>-->
<!-- </ACol>--> <!-- </ACol>-->
<!-- <ACol :md="8" :xs="24">--> <!-- <ACol :md="8" :xs="24">-->
<!-- <Button block @click="setLoginState(LoginStateEnum.QR_CODE)">--> <!-- <Button block @click="setLoginState(LoginStateEnum.QR_CODE)">-->
<!-- {{ t('sys.login.qrSignInFormTitle') }}--> <!-- {{ t('sys.login.qrSignInFormTitle') }}-->
<!-- </Button>--> <!-- </Button>-->
<!-- </ACol>--> <!-- </ACol>-->
<!-- <ACol :md="8" :xs="24">--> <!-- <ACol :md="8" :xs="24">-->
<!-- <Button block @click="setLoginState(LoginStateEnum.REGISTER)">--> <!-- <Button block @click="setLoginState(LoginStateEnum.REGISTER)">-->
<!-- {{ t('sys.login.registerButton') }}--> <!-- {{ t('sys.login.registerButton') }}-->
<!-- </Button>--> <!-- </Button>-->
<!-- </ACol>--> <!-- </ACol>-->
<!-- </ARow>--> <!-- </ARow>-->
<!-- <Divider class="enter-x">{{ t('sys.login.otherSignIn') }}</Divider>--> <!-- <Divider class="enter-x">{{ t('sys.login.otherSignIn') }}</Divider>-->
<!-- <div class="flex justify-evenly enter-x" :class="`${prefixCls}-sign-in-way`">--> <!-- <div class="flex justify-evenly enter-x" :class="`${prefixCls}-sign-in-way`">-->
<!-- <GithubFilled />--> <!-- <GithubFilled />-->
<!-- <WechatFilled />--> <!-- <WechatFilled />-->
<!-- <AlipayCircleFilled />--> <!-- <AlipayCircleFilled />-->
<!-- <GoogleCircleFilled />--> <!-- <GoogleCircleFilled />-->
<!-- <TwitterCircleFilled />--> <!-- <TwitterCircleFilled />-->
<!-- </div>--> <!-- </div>-->
</Form> </Form>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
...@@ -130,7 +130,7 @@ ...@@ -130,7 +130,7 @@
import { useUserStore } from '@/store/modules/user'; import { useUserStore } from '@/store/modules/user';
import { LoginStateEnum, useLoginState, useFormRules, useFormValid } from './useLogin'; import { LoginStateEnum, useLoginState, useFormRules, useFormValid } from './useLogin';
import { useDesign } from '@/hooks/web/useDesign'; import { useDesign } from '@/hooks/web/useDesign';
import Icon from "@/components/Icon/Icon.vue"; import Icon from '@/components/Icon/Icon.vue';
//import { onKeyStroke } from '@vueuse/core'; //import { onKeyStroke } from '@vueuse/core';
const ACol = Col; const ACol = Col;
...@@ -170,7 +170,7 @@ ...@@ -170,7 +170,7 @@
username: data.account, username: data.account,
mode: 'none', //不要默认的错误提示 mode: 'none', //不要默认的错误提示
}); });
console.log('userInfo',userInfo) console.log('userInfo', userInfo);
if (userInfo) { if (userInfo) {
notification.success({ notification.success({
message: t('sys.login.loginSuccessTitle'), message: t('sys.login.loginSuccessTitle'),
...@@ -179,7 +179,7 @@ ...@@ -179,7 +179,7 @@
}); });
} }
} catch (error) { } catch (error) {
console.log('error',error) console.log('error', error);
createErrorModal({ createErrorModal({
title: t('sys.api.errorTip'), title: t('sys.api.errorTip'),
content: (error as unknown as Error).message || t('sys.api.networkExceptionMsg'), content: (error as unknown as Error).message || t('sys.api.networkExceptionMsg'),
......
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<span class="login-title-text">用户登录</span> <span class="login-title-text">用户登录</span>
</div> </div>
<LoginForm /> <LoginForm />
<div style="display: flex;justify-content: space-between"> <div style="display: flex; justify-content: space-between">
<a-button type="link">忘记密码</a-button> <a-button type="link">忘记密码</a-button>
<a-button type="link" @click="handleRegister">没有账号, 立即注册</a-button> <a-button type="link" @click="handleRegister">没有账号, 立即注册</a-button>
</div> </div>
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
}, },
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="less">
body { body {
margin: 0; margin: 0;
} }
...@@ -101,7 +101,7 @@ ...@@ -101,7 +101,7 @@
.login-box { .login-box {
width: 100%; width: 100%;
aspect-ratio: 1920 / 863; /* 或者其他的宽高比 */ aspect-ratio: 1920 / 863; /* 或者其他的宽高比 */
background-image: url('src/assets/images/mallHome/login_bg.png'); background-image: url('@/assets/images/mallHome/login_bg.png');
background-size: cover; background-size: cover;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
...@@ -121,8 +121,7 @@ ...@@ -121,8 +121,7 @@
.login-title { .login-title {
margin: 50px 0 30px 16px; margin: 50px 0 30px 16px;
.login-title-text {
.login-title-text{
width: 128px; width: 128px;
height: 48px; height: 48px;
color: #3f3f3f; color: #3f3f3f;
......
...@@ -34,9 +34,9 @@ ...@@ -34,9 +34,9 @@
<span class="table-span">{{ scope.row.address }}</span> <span class="table-span">{{ scope.row.address }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" width="350" label="申请人"> </el-table-column> <el-table-column prop="name" width="350" label="申请人" />
<el-table-column prop="applicationDate" label="申请日期"> </el-table-column> <el-table-column prop="applicationDate" label="申请日期" />
<el-table-column prop="upDate" label="更新日期"> </el-table-column> <el-table-column prop="upDate" label="更新日期" />
</el-table> </el-table>
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="second"> <el-tab-pane name="second">
...@@ -59,9 +59,9 @@ ...@@ -59,9 +59,9 @@
<span class="table-span">{{ scope.row.address }}</span> <span class="table-span">{{ scope.row.address }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" width="350" label="申请人"> </el-table-column> <el-table-column prop="name" width="350" label="申请人" />
<el-table-column prop="applicationDate" label="申请日期"> </el-table-column> <el-table-column prop="applicationDate" label="申请日期" />
<el-table-column prop="upDate" label="更新日期"> </el-table-column> <el-table-column prop="upDate" label="更新日期" />
</el-table> </el-table>
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="third"> <el-tab-pane name="third">
...@@ -84,9 +84,9 @@ ...@@ -84,9 +84,9 @@
<span class="table-span">{{ scope.row.address }}</span> <span class="table-span">{{ scope.row.address }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" width="350" label="申请人"> </el-table-column> <el-table-column prop="name" width="350" label="申请人" />
<el-table-column prop="applicationDate" label="申请日期"> </el-table-column> <el-table-column prop="applicationDate" label="申请日期" />
<el-table-column prop="upDate" label="更新日期"> </el-table-column> <el-table-column prop="upDate" label="更新日期" />
</el-table> </el-table>
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="fourth"> <el-tab-pane name="fourth">
...@@ -109,16 +109,16 @@ ...@@ -109,16 +109,16 @@
<span class="table-span">{{ scope.row.address }}</span> <span class="table-span">{{ scope.row.address }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" width="350" label="申请人"> </el-table-column> <el-table-column prop="name" width="350" label="申请人" />
<el-table-column prop="applicationDate" label="申请日期"> </el-table-column> <el-table-column prop="applicationDate" label="申请日期" />
<el-table-column prop="upDate" label="更新日期"> </el-table-column> <el-table-column prop="upDate" label="更新日期" />
</el-table> </el-table>
</el-tab-pane> </el-tab-pane>
</div> </div>
</el-tabs> </el-tabs>
<el-button-group> <el-button-group>
<el-button plain class="back-button" type="text"> <el-button plain class="back-button" type="text">
查看更多&nbsp;<Icon :size="24" icon="icon-park-solid:right-c"></Icon> 查看更多&nbsp;<Icon :size="24" icon="icon-park-solid:right-c" />
</el-button> </el-button>
</el-button-group> </el-button-group>
</div> </div>
...@@ -129,31 +129,34 @@ ...@@ -129,31 +129,34 @@
</template> </template>
<script> <script>
import Icon from '@/components/Icon/Icon.vue';
import { getToken } from '@/utils/auth';
import cardLogo from '@/assets/images/mallHome/biaoqian.png';
import industryImg from '@/assets/images/mallHome/行业动态.png';
import dynamicImg from '@/assets/images/mallHome/hangyedongtai.png';
import Icon from '@/components/Icon/Icon.vue'; const items = [
import { getToken } from '@/utils/auth';
export default {
name: 'demandHall',
components: { Icon },
data() {
return {
activeName: 'first',
activeName1: 'first',
activeName2: 'first',
cardLogo: 'src/assets/images/mallHome/biaoqian.png',
industryImg: 'src/assets/images/mallHome/行业动态.png',
dynamicImg: 'src/assets/images/mallHome/hangyedongtai.png',
items: [
{ {
id: '1', id: '1',
url: 'src/assets/images/mallHome/banner1.png', url: new URL('@/assets/images/mallHome/banner1.png', import.meta.url).href,
}, },
{ {
id: '2', id: '2',
url: 'src/assets/images/mallHome/banner.png', url: new URL('@/assets/images/mallHome/banner.png', import.meta.url).href,
}, },
], ];
export default {
name: 'DemandHall',
components: { Icon },
data() {
return {
activeName: 'first',
activeName1: 'first',
activeName2: 'first',
cardLogo,
industryImg,
dynamicImg,
items,
tableData: [ tableData: [
{ {
applicationDate: '2016-05-02', applicationDate: '2016-05-02',
...@@ -202,21 +205,21 @@ export default { ...@@ -202,21 +205,21 @@ export default {
// } // }
}, },
}, },
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
/*公共容器 所有子页面共享的css样式*/ /*公共容器 所有子页面共享的css样式*/
.commonContainer { .commonContainer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
/*justify-content: center; !* 垂直居中 *!*/ /*justify-content: center; !* 垂直居中 *!*/
align-items: center; /* 水平居中 */ align-items: center; /* 水平居中 */
text-align: center; text-align: center;
position: relative; position: relative;
} }
/*子页面中文标题样式*/ /*子页面中文标题样式*/
.content-item-h3 { .content-item-h3 {
height: 43px; height: 43px;
font-size: 36px; font-size: 36px;
font-weight: 580; font-weight: 580;
...@@ -225,45 +228,45 @@ export default { ...@@ -225,45 +228,45 @@ export default {
line-height: 43px; line-height: 43px;
letter-spacing: 10px; letter-spacing: 10px;
margin: 60px 0 0 0; margin: 60px 0 0 0;
} }
.title_bottom { .title_bottom {
margin-top: 40px; margin-top: 40px;
font-size: 24px; font-size: 24px;
font-weight: 500; font-weight: 500;
color: #a3a3a3; color: #a3a3a3;
letter-spacing: 4px; letter-spacing: 4px;
} }
.item-content-box { .item-content-box {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
.carouselImg { .carouselImg {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.tab-pane { .tab-pane {
position: relative; position: relative;
margin-top: 80px; margin-top: 80px;
width: 1440px; width: 1440px;
display: flex; display: flex;
} }
//tabs 按钮 //tabs 按钮
.back-button { .back-button {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
font-size: 18px; font-size: 18px;
margin-top: 3px; margin-top: 3px;
color: #3a5cde; color: #3a5cde;
} }
.card-row { .card-row {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
margin-top: 20px; margin-top: 20px;
...@@ -284,14 +287,14 @@ export default { ...@@ -284,14 +287,14 @@ export default {
width: 68%; width: 68%;
color: #3f3f3f; color: #3f3f3f;
} }
} }
.tab-label { .tab-label {
font-size: 24px; font-size: 24px;
font-weight: 700; font-weight: 700;
} }
.card_bottom { .card_bottom {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
...@@ -301,9 +304,9 @@ export default { ...@@ -301,9 +304,9 @@ export default {
color: #1962e2; color: #1962e2;
border: #1962e2 2px solid; border: #1962e2 2px solid;
} }
} }
.industry { .industry {
width: 100%; width: 100%;
margin-top: 100px; margin-top: 100px;
background-color: #eff3fa; background-color: #eff3fa;
...@@ -358,43 +361,41 @@ export default { ...@@ -358,43 +361,41 @@ export default {
} }
} }
} }
} }
.custom-table { .custom-table {
margin-bottom: 72px; margin-bottom: 72px;
} }
.table-span { .table-span {
color: #1962e2; color: #1962e2;
margin-left: 80px; margin-left: 80px;
} }
.table-span-label { .table-span-label {
margin-left: 80px; margin-left: 80px;
} }
.row-footer{ .row-footer {
height: 242px; height: 242px;
opacity: 0.8; opacity: 0.8;
background-color: #1962E2; background-color: #1962e2;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: space-evenly; justify-content: space-evenly;
.footer-title{ .footer-title {
height: 48px; height: 48px;
color: #ffffff; color: #ffffff;
font-size: 32px; font-size: 32px;
font-weight: 500; font-weight: 500;
} }
.footer-button{ .footer-button {
width: 160px; width: 160px;
height: 51px; height: 51px;
font-size: 18px; font-size: 18px;
background-color: #FFFFFF; background-color: #ffffff;
color: #1962E2; color: #1962e2;
}
} }
}
</style> </style>
...@@ -154,7 +154,8 @@ ...@@ -154,7 +154,8 @@
margin-top: 24px; margin-top: 24px;
background-color: #754e9e; background-color: #754e9e;
" "
><img :src="dynamicImg" /></div> ><img :src="dynamicImg"
/></div>
<div class="mt-5 big-event"> <div class="mt-5 big-event">
<el-tag style="font-size: 14px">大事件</el-tag> <el-tag style="font-size: 14px">大事件</el-tag>
<span class="ml-2" style="font-size: 18px">大数据平台上线</span> <span class="ml-2" style="font-size: 18px">大数据平台上线</span>
...@@ -378,14 +379,6 @@ ...@@ -378,14 +379,6 @@
</el-button-group> </el-button-group>
</div> </div>
</div> </div>
<div class="row-footer">
<div class="footer-title">
<span>大数据服务平台上线啦~</span>
</div>
<el-button plain class="footer-button" type="text" @click="toBackstage()">
立即前往<Icon class="ml-3" :size="20" icon="icon-park-solid:right-c" />
</el-button>
</div>
</div> </div>
</div> </div>
</template> </template>
...@@ -394,6 +387,21 @@ ...@@ -394,6 +387,21 @@
import Icon from '@/components/Icon/Icon.vue'; import Icon from '@/components/Icon/Icon.vue';
import { getToken } from '@/utils/auth'; import { getToken } from '@/utils/auth';
import cardLogo from '@/assets/images/mallHome/biaoqian.png';
import industryImg from '@/assets/images/mallHome/行业动态.png';
import dynamicImg from '@/assets/images/mallHome/hangyedongtai.png';
const items = [
{
id: '1',
url: new URL('@/assets/images/mallHome/banner1.png', import.meta.url).href,
},
{
id: '2',
url: new URL('@/assets/images/mallHome/banner.png', import.meta.url).href,
},
];
export default { export default {
name: 'Front', name: 'Front',
components: { Icon }, components: { Icon },
...@@ -402,19 +410,10 @@ ...@@ -402,19 +410,10 @@
activeName: 'first', activeName: 'first',
activeName1: 'first', activeName1: 'first',
activeName2: 'first', activeName2: 'first',
cardLogo: 'src/assets/images/mallHome/biaoqian.png', cardLogo,
industryImg: 'src/assets/images/mallHome/行业动态.png', industryImg,
dynamicImg: 'src/assets/images/mallHome/hangyedongtai.png', dynamicImg,
items: [ items,
{
id: '1',
url: 'src/assets/images/mallHome/banner1.png',
},
{
id: '2',
url: 'src/assets/images/mallHome/banner.png',
},
],
tableData: [ tableData: [
{ {
applicationDate: '2016-05-02', applicationDate: '2016-05-02',
......
...@@ -53,6 +53,15 @@ ...@@ -53,6 +53,15 @@
<router-view /> <router-view />
</div> </div>
<div class="row-footer">
<div class="footer-title">
<span>大数据服务平台上线啦~</span>
</div>
<el-button plain class="footer-button" type="text" @click="toBackstage()">
立即前往<Icon class="ml-3" :size="20" icon="icon-park-solid:right-c" />
</el-button>
</div>
<div class="footer-item-por"> <div class="footer-item-por">
<div>版权所有:<span>天津市融创软通科技股份有限公司</span></div> <div>版权所有:<span>天津市融创软通科技股份有限公司</span></div>
<div class="right-div"> <div class="right-div">
...@@ -82,8 +91,8 @@ ...@@ -82,8 +91,8 @@
{ path: '/aaaFont/font', text: '首页' }, { path: '/aaaFont/font', text: '首页' },
{ path: '/aaaFont/tradingMarket', text: '交易市场' }, { path: '/aaaFont/tradingMarket', text: '交易市场' },
{ path: '/aaaFont/demandHall', text: '需求大厅' }, { path: '/aaaFont/demandHall', text: '需求大厅' },
{ path: '/aaaFont/nationalPolicy', text: '国家政策' },
{ path: '/aaaFont/dataRegistration', text: '数据登记' }, { path: '/aaaFont/dataRegistration', text: '数据登记' },
{ path: '/aaaFont/nationalPolicy', text: '国家政策' },
], ],
// titleNameImage: require('@/assets/tiankai_cup/home/biaoti2.png'), // titleNameImage: require('@/assets/tiankai_cup/home/biaoti2.png'),
// titleNameImage1: require('@/assets/tiankai_cup/home/logo.png'), // titleNameImage1: require('@/assets/tiankai_cup/home/logo.png'),
...@@ -95,7 +104,6 @@ ...@@ -95,7 +104,6 @@
get() { get() {
let currentPath = this.$route.path; //获取当前的路由路径 let currentPath = this.$route.path; //获取当前的路由路径
let activeIndex = undefined; //用于返回期望激活的导航项的index值 let activeIndex = undefined; //用于返回期望激活的导航项的index值
// 判断是否是走进天开园页面
this.showFixed = !(currentPath === '/introduce' || currentPath.startsWith('/introduce/')); this.showFixed = !(currentPath === '/introduce' || currentPath.startsWith('/introduce/'));
for (let nav of this.navs) { for (let nav of this.navs) {
...@@ -437,8 +445,30 @@ ...@@ -437,8 +445,30 @@
font-weight: 500; font-weight: 500;
} }
.row-footer {
height: 242px;
opacity: 0.8;
background-color: #1962e2;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-evenly;
.footer-title {
height: 48px;
color: #ffffff;
font-size: 32px;
font-weight: 500;
}
.footer-button {
width: 160px;
height: 51px;
font-size: 18px;
background-color: #ffffff;
color: #1962e2;
}
}
/*底部版权所有样式*/ /*底部版权所有样式*/
.footer-item-por { .footer-item-por {
......
<template> <template>
<!-- <div v-if="getShow">--> <!-- <div v-if="getShow">-->
<Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef"> <Form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef">
<FormItem name="account" class="enter-x"> <FormItem name="account" class="enter-x">
<Input <Input
...@@ -61,11 +61,11 @@ ...@@ -61,11 +61,11 @@
> >
{{ t('sys.login.registerButton') }} {{ t('sys.login.registerButton') }}
</Button> </Button>
<!-- <Button size="large" block class="mt-4 enter-x" @click="handleBackLogin">--> <!-- <Button size="large" block class="mt-4 enter-x" @click="handleBackLogin">-->
<!-- {{ t('sys.login.backSignIn') }}--> <!-- {{ t('sys.login.backSignIn') }}-->
<!-- </Button>--> <!-- </Button>-->
</Form> </Form>
<!-- </div>--> <!-- </div>-->
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { reactive, ref, unref, computed } from 'vue'; import { reactive, ref, unref, computed } from 'vue';
......
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<div class="register-title"> <div class="register-title">
<span class="register-title-text">欢迎注册</span> <span class="register-title-text">欢迎注册</span>
</div> </div>
<RegisterForm/> <RegisterForm />
</div> </div>
</div> </div>
</div> </div>
...@@ -21,12 +21,12 @@ ...@@ -21,12 +21,12 @@
</template> </template>
<script> <script>
import Icon from '@/components/Icon/Icon.vue'; import Icon from '@/components/Icon/Icon.vue';
import RegisterForm from "./RegisterForm.vue"; import RegisterForm from './RegisterForm.vue';
export default { export default {
name: 'register', name: 'Register',
components: {RegisterForm, Icon }, components: { RegisterForm, Icon },
data() { data() {
return {}; return {};
}, },
...@@ -38,21 +38,20 @@ export default { ...@@ -38,21 +38,20 @@ export default {
this.$router.replace('/aaaFont/font'); this.$router.replace('/aaaFont/font');
}, },
}, },
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
body { body {
margin: 0; margin: 0;
} }
#register { #register {
min-width: 1366px; min-width: 1366px;
width: auto; width: auto;
position: relative; position: relative;
/*transform: translate(0, 0);*/ /*transform: translate(0, 0);*/
background-color: #EFF3FA; background-color: #eff3fa;
}
} .header {
.header {
/*position: fixed;*/ /*position: fixed;*/
z-index: 999; z-index: 999;
width: 100%; width: 100%;
...@@ -71,10 +70,10 @@ body { ...@@ -71,10 +70,10 @@ body {
font-size: 18px; font-size: 18px;
margin-left: 40px; margin-left: 40px;
} }
} }
/*标题样式*/ /*标题样式*/
.official-title { .official-title {
font-size: 24px; font-size: 24px;
font-weight: 600; font-weight: 600;
line-height: 28px; line-height: 28px;
...@@ -83,8 +82,8 @@ body { ...@@ -83,8 +82,8 @@ body {
/*display: flex;*/ /*display: flex;*/
/*justify-content: center;*/ /*justify-content: center;*/
position: relative; position: relative;
} }
.official-title::before { .official-title::before {
content: ''; content: '';
position: absolute; position: absolute;
right: 0; right: 0;
...@@ -92,16 +91,15 @@ body { ...@@ -92,16 +91,15 @@ body {
bottom: 0; bottom: 0;
width: 1px; width: 1px;
background-color: #dce7fb; background-color: #dce7fb;
} }
.register-box { .register-box {
width: 100%; width: 100%;
aspect-ratio: 1920 / 863; /* 或者其他的宽高比 */ aspect-ratio: 1920 / 863; /* 或者其他的宽高比 */
position: relative; position: relative;
.register-win { .register-win {
width: 75%; width: 75%;
height: 75%;
background: #fdfdfd; background: #fdfdfd;
border-radius: 8px; border-radius: 8px;
position: absolute; position: absolute;
...@@ -109,16 +107,14 @@ body { ...@@ -109,16 +107,14 @@ body {
top: 50%; top: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
.win-box {
.win-box{
width: 30%; width: 30%;
margin: 0 auto; margin: 0 auto;
.register-title { .register-title {
margin: 50px 0 30px 16px; margin: 50px 0 30px 16px;
.register-title-text {
.register-title-text{
width: 128px; width: 128px;
height: 48px; height: 48px;
color: #3f3f3f; color: #3f3f3f;
...@@ -127,7 +123,6 @@ body { ...@@ -127,7 +123,6 @@ body {
} }
} }
} }
} }
} }
</style> </style>
...@@ -34,9 +34,9 @@ ...@@ -34,9 +34,9 @@
<span class="table-span">{{ scope.row.address }}</span> <span class="table-span">{{ scope.row.address }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" width="350" label="申请人"> </el-table-column> <el-table-column prop="name" width="350" label="申请人" />
<el-table-column prop="applicationDate" label="申请日期"> </el-table-column> <el-table-column prop="applicationDate" label="申请日期" />
<el-table-column prop="upDate" label="更新日期"> </el-table-column> <el-table-column prop="upDate" label="更新日期" />
</el-table> </el-table>
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="second"> <el-tab-pane name="second">
...@@ -59,9 +59,9 @@ ...@@ -59,9 +59,9 @@
<span class="table-span">{{ scope.row.address }}</span> <span class="table-span">{{ scope.row.address }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" width="350" label="申请人"> </el-table-column> <el-table-column prop="name" width="350" label="申请人" />
<el-table-column prop="applicationDate" label="申请日期"> </el-table-column> <el-table-column prop="applicationDate" label="申请日期" />
<el-table-column prop="upDate" label="更新日期"> </el-table-column> <el-table-column prop="upDate" label="更新日期" />
</el-table> </el-table>
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="third"> <el-tab-pane name="third">
...@@ -84,9 +84,9 @@ ...@@ -84,9 +84,9 @@
<span class="table-span">{{ scope.row.address }}</span> <span class="table-span">{{ scope.row.address }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" width="350" label="申请人"> </el-table-column> <el-table-column prop="name" width="350" label="申请人" />
<el-table-column prop="applicationDate" label="申请日期"> </el-table-column> <el-table-column prop="applicationDate" label="申请日期" />
<el-table-column prop="upDate" label="更新日期"> </el-table-column> <el-table-column prop="upDate" label="更新日期" />
</el-table> </el-table>
</el-tab-pane> </el-tab-pane>
<el-tab-pane name="fourth"> <el-tab-pane name="fourth">
...@@ -109,16 +109,16 @@ ...@@ -109,16 +109,16 @@
<span class="table-span">{{ scope.row.address }}</span> <span class="table-span">{{ scope.row.address }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="name" width="350" label="申请人"> </el-table-column> <el-table-column prop="name" width="350" label="申请人" />
<el-table-column prop="applicationDate" label="申请日期"> </el-table-column> <el-table-column prop="applicationDate" label="申请日期" />
<el-table-column prop="upDate" label="更新日期"> </el-table-column> <el-table-column prop="upDate" label="更新日期" />
</el-table> </el-table>
</el-tab-pane> </el-tab-pane>
</div> </div>
</el-tabs> </el-tabs>
<el-button-group> <el-button-group>
<el-button plain class="back-button" type="text"> <el-button plain class="back-button" type="text">
查看更多&nbsp;<Icon :size="24" icon="icon-park-solid:right-c"></Icon> 查看更多&nbsp;<Icon :size="24" icon="icon-park-solid:right-c" />
</el-button> </el-button>
</el-button-group> </el-button-group>
</div> </div>
...@@ -129,11 +129,24 @@ ...@@ -129,11 +129,24 @@
</template> </template>
<script> <script>
import Icon from '@/components/Icon/Icon.vue';
import { getToken } from '@/utils/auth';
import cardLogo from '@/assets/images/mallHome/biaoqian.png';
import industryImg from '@/assets/images/mallHome/行业动态.png';
import dynamicImg from '@/assets/images/mallHome/hangyedongtai.png';
import Icon from '@/components/Icon/Icon.vue'; const items = [
import { getToken } from '@/utils/auth'; {
id: '1',
url: new URL('@/assets/images/mallHome/banner1.png', import.meta.url).href,
},
{
id: '2',
url: new URL('@/assets/images/mallHome/banner.png', import.meta.url).href,
},
];
export default { export default {
name: 'Front', name: 'Front',
components: { Icon }, components: { Icon },
data() { data() {
...@@ -141,19 +154,10 @@ export default { ...@@ -141,19 +154,10 @@ export default {
activeName: 'first', activeName: 'first',
activeName1: 'first', activeName1: 'first',
activeName2: 'first', activeName2: 'first',
cardLogo: 'src/assets/images/mallHome/biaoqian.png', cardLogo,
industryImg: 'src/assets/images/mallHome/行业动态.png', industryImg,
dynamicImg: 'src/assets/images/mallHome/hangyedongtai.png', dynamicImg,
items: [ items,
{
id: '1',
url: 'src/assets/images/mallHome/banner1.png',
},
{
id: '2',
url: 'src/assets/images/mallHome/banner.png',
},
],
tableData: [ tableData: [
{ {
applicationDate: '2016-05-02', applicationDate: '2016-05-02',
...@@ -202,21 +206,21 @@ export default { ...@@ -202,21 +206,21 @@ export default {
// } // }
}, },
}, },
}; };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
/*公共容器 所有子页面共享的css样式*/ /*公共容器 所有子页面共享的css样式*/
.commonContainer { .commonContainer {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
/*justify-content: center; !* 垂直居中 *!*/ /*justify-content: center; !* 垂直居中 *!*/
align-items: center; /* 水平居中 */ align-items: center; /* 水平居中 */
text-align: center; text-align: center;
position: relative; position: relative;
} }
/*子页面中文标题样式*/ /*子页面中文标题样式*/
.content-item-h3 { .content-item-h3 {
height: 43px; height: 43px;
font-size: 36px; font-size: 36px;
font-weight: 580; font-weight: 580;
...@@ -225,45 +229,45 @@ export default { ...@@ -225,45 +229,45 @@ export default {
line-height: 43px; line-height: 43px;
letter-spacing: 10px; letter-spacing: 10px;
margin: 60px 0 0 0; margin: 60px 0 0 0;
} }
.title_bottom { .title_bottom {
margin-top: 40px; margin-top: 40px;
font-size: 24px; font-size: 24px;
font-weight: 500; font-weight: 500;
color: #a3a3a3; color: #a3a3a3;
letter-spacing: 4px; letter-spacing: 4px;
} }
.item-content-box { .item-content-box {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
} }
.carouselImg { .carouselImg {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.tab-pane { .tab-pane {
position: relative; position: relative;
margin-top: 80px; margin-top: 80px;
width: 1440px; width: 1440px;
display: flex; display: flex;
} }
//tabs 按钮 //tabs 按钮
.back-button { .back-button {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
font-size: 18px; font-size: 18px;
margin-top: 3px; margin-top: 3px;
color: #3a5cde; color: #3a5cde;
} }
.card-row { .card-row {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
margin-top: 20px; margin-top: 20px;
...@@ -284,14 +288,14 @@ export default { ...@@ -284,14 +288,14 @@ export default {
width: 68%; width: 68%;
color: #3f3f3f; color: #3f3f3f;
} }
} }
.tab-label { .tab-label {
font-size: 24px; font-size: 24px;
font-weight: 700; font-weight: 700;
} }
.card_bottom { .card_bottom {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
...@@ -301,9 +305,9 @@ export default { ...@@ -301,9 +305,9 @@ export default {
color: #1962e2; color: #1962e2;
border: #1962e2 2px solid; border: #1962e2 2px solid;
} }
} }
.industry { .industry {
width: 100%; width: 100%;
margin-top: 100px; margin-top: 100px;
background-color: #eff3fa; background-color: #eff3fa;
...@@ -358,43 +362,41 @@ export default { ...@@ -358,43 +362,41 @@ export default {
} }
} }
} }
} }
.custom-table { .custom-table {
margin-bottom: 72px; margin-bottom: 72px;
} }
.table-span { .table-span {
color: #1962e2; color: #1962e2;
margin-left: 80px; margin-left: 80px;
} }
.table-span-label { .table-span-label {
margin-left: 80px; margin-left: 80px;
} }
.row-footer{ .row-footer {
height: 242px; height: 242px;
opacity: 0.8; opacity: 0.8;
background-color: #1962E2; background-color: #1962e2;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: space-evenly; justify-content: space-evenly;
.footer-title{ .footer-title {
height: 48px; height: 48px;
color: #ffffff; color: #ffffff;
font-size: 32px; font-size: 32px;
font-weight: 500; font-weight: 500;
} }
.footer-button{ .footer-button {
width: 160px; width: 160px;
height: 51px; height: 51px;
font-size: 18px; font-size: 18px;
background-color: #FFFFFF; background-color: #ffffff;
color: #1962E2; color: #1962e2;
}
} }
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment