lizhichao
/
hitap-chat
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

管骁翰_增加字体 修改登录页样式

Browse Source
main
guanxiaohan 10 months ago
parent 98ea49bff8
commit 6d5b9381a6
18 changed files with 118 additions and 34 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 26
      App.vue
  2. 6
      pages/index/detail.vue
  3. 11
      pages/index/index.vue
  4. 109
      pages/logIn/logIn.vue
  5. BIN
      static/fonts/Alimama_ShuHeiTi_Bold.ttf
  6. BIN
      static/fonts/MFLiHei_Noncommercial-Regular.ttf
  7. BIN
      static/fonts/SOURCEHANSANSCN-BOLD.TTF
  8. BIN
      static/fonts/SOURCEHANSANSCN-MEDIUM.TTF
  9. BIN
      static/fonts/SOURCEHANSANSCN-REGULAR.TTF
  10. BIN
      static/fonts/Tensentype-MeiHeiJ-Bold.TTF
  11. BIN
      static/scimg/jinghui.png
  12. BIN
      static/scimg/login_bg.png
  13. BIN
      static/scimg/login_bg_bottom.png
  14. BIN
      static/scimg/login_bg_top.png
  15. BIN
      static/scimg/login_no.png
  16. BIN
      static/scimg/login_password.png
  17. BIN
      static/scimg/login_user.png
  18. BIN
      static/scimg/login_yes.png

26
App.vue
Unescape View File

@ -24,7 +24,31 @@
}
</script>
<style lang="scss" >
<style lang="scss" >
@font-face {
font-family: 'Tensentype-MeiHeiJ-Bold'; /* 定义字体名称 */
src: url('~@/static/fonts/Tensentype-MeiHeiJ-Bold.TTF') format('truetype'); /* 指定字体文件路径 */
}
@font-face {
font-family: 'SOURCEHANSANSCN-REGULAR'; /* 定义字体名称 */
src: url('~@/static/fonts/SOURCEHANSANSCN-REGULAR.TTF') format('truetype'); /* 指定字体文件路径 */
}
@font-face {
font-family: 'SOURCEHANSANSCN-MEDIUM'; /* 定义字体名称 */
src: url('~@/static/fonts/SOURCEHANSANSCN-MEDIUM.TTF') format('truetype'); /* 指定字体文件路径 */
}
@font-face {
font-family: 'SOURCEHANSANSCN-BOLD'; /* 定义字体名称 */
src: url('~@/static/fonts/SOURCEHANSANSCN-BOLD.TTF') format('truetype'); /* 指定字体文件路径 */
}
@font-face {
font-family: 'Alimama_ShuHeiTi_Bold'; /* 定义字体名称 */
src: url('~@/static/fonts/Alimama_ShuHeiTi_Bold.ttf') format('truetype'); /* 指定字体文件路径 */
}
@font-face {
font-family: 'MFLiHei_Noncommercial-Regular'; /* 定义字体名称 */
src: url('~@/static/fonts/MFLiHei_Noncommercial-Regular.ttf') format('truetype'); /* 指定字体文件路径 */
}
uni-toast{
z-index: 99999999999999999!important;
}

6
pages/index/detail.vue
Unescape View File

@ -108,7 +108,7 @@
<view class="btn" @click="handleGroup2(i)">清空</view>
</view>
<!-- v-if="isShowYindao && item.isOver" -->
<view class="yindao" v-if="isShowYindao && item.isOver && item" @click="clickYinDao(item.reference)">
<view class="yindao" @click="clickYinDao(item.reference)">
<image src="../../static/nav/yindao.png" style="height: 40rpx; width: 40rpx;"></image>
</view>
</view>
@ -614,6 +614,8 @@
this.scrollBottom();
if (newdata == data) {
this.msgList[this.msgList.length - 1].data += `<image src="../../static/nav/yindao.png" style="height: 40rpx; width: 40rpx;"></image>`
console.log('this.msgList[this.msgList.length - 1].data', this.msgList[this.msgList.length - 1].data)
if (optionType == 0 || optionType == 1) {
this.msgList[this.msgList.length - 1].optionType = optionType;
this.msgList[this.msgList.length - 1].answerOptions =
@ -1015,5 +1017,7 @@
font-size: 16px;
line-height: 2.3;
word-spacing: 0.1em;
max-height: 300rpx;
overflow-y: auto;
}
</style>

11
pages/index/index.vue
Unescape View File

@ -5,9 +5,9 @@
top: 0;
z-index: 999;">
<view class="header Box">
<view class="title">道路交通安全隐患</view>
<view class="title">排查助手</view>
<view class="desc">洞察隐患 智能守护 科技之眼照亮安全之路</view>
<view class="title">洞察隐患 智能守护</view>
<!-- <view class="title">排查助手</view> -->
<view class="desc">科技之眼照亮安全之路</view>
<view class="total Flex Flex_C_S-B PositionR">
<view class="left Flex">
<view class="info" @click="jump(1)">
@ -252,7 +252,7 @@
padding: calc(var(--status-bar-height) + 40rpx) 20rpx 20rpx;
.title {
font-family: Tensentype MeiHeiJ, Tensentype MeiHeiJ;
font-family: 'Tensentype-MeiHeiJ-Bold';
font-weight: bold;
font-size: 24px;
line-height: 28px;
@ -264,8 +264,9 @@
}
.desc {
font-family: 'SOURCEHANSANSCN-REGULAR';
margin-top: 20rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
// font-family: Source Han Sans CN, Source Han Sans CN;
}
.total {

109
pages/logIn/logIn.vue
Unescape View File

@ -1,16 +1,16 @@
<template>
<view id="page">
<view class="Width100 Box" :style="bgUrl1">
<image class="pic" :src="$.imgSrc + '/scimg/login_bg_bottom.png'" mode="aspectFit"></image>
<view class="Content MarginAuto">
<image :src="$.imgSrc + '/scimg/logo1.png'" mode="aspectFit" class="Block Logo"></image>
<view class="NavBox Width100 MarginT_60rpx">
<view class="Unit FloatL PositionR" v-for="(item,index) in navList" @click="chooseNav(item.type)">
<text class="Block"
:class="currNav == item.type ? 'FontS_46rpx Color_1A1F39 FontBold':'FontS_42rpx Color_B4BAC9'">
{{ item.label }}</text>
<view class="Line BG_0064FF PositionA" v-show="currNav == item.type"></view>
<image :src="$.imgSrc + '/scimg/jinghui.png'" mode="aspectFit" class="Block Logo"></image>
<view class="NavBox Width100 MarginT_20rpx">
<view class="logo-title">
道路交通安全隐患
</view>
<view class="logo-title">
排查助手
</view>
<view class="ClearB"></view>
</view>
<!-- <view class="TypeBox MarginT_60rpx" v-if="currNav == 1">
<view class="Unit FloatL" v-for="(item,index) in typeList" @click="chooseType(item.type)">
@ -24,26 +24,38 @@
<view class="ClearB"></view>
</view> -->
<view class="InputBox" :class="currNav == 1 ? 'MarginT_40rpx' : 'MarginT_80rpx'">
<view class="Input MarginT_40rpx BG_F6F7FB">
<view class="Input">
<!-- <view class="Num FloatL TextLeft MarginL_60rpx">-->
<!-- <text class="InlineBlock FontS_34rpx Color_1A1F39 FontBold">+86</text>-->
<!-- </view>-->
<view class="img-box">
<image :src="$.imgSrc + '/scimg/login_user.png'" mode="aspectFit" class="input_left_icon input_icon"></image>
</view>
<input type="text" placeholder="请输入用户名" v-model="logInData.phone"
class="Height100 Input1 FloatL MarginL_60rpx FontS_32rpx">
class="Height100 Input1 FloatL FontS_32rpx" />
<view class="img-box"></view>
<view class="ClearB"></view>
</view>
<view class="Input MarginT_40rpx BG_F6F7FB" v-if="currNav == 1">
<view class="Input" v-if="currNav == 1">
<input type="text" v-model="logInData.validateCode" placeholder="请输入验证码"
class="Height100 Input1 FloatL MarginL_60rpx FontS_32rpx">
class="Height100 Input1 FloatL MarginL_60rpx FontS_32rpx" />
<view class="CodeBox FloatR MarginR_60rpx" @click="getCode">
<text class="Block FontS_28rpx"
:class="isCodeDisabled ? 'Color_B4BAC9':'Color_0064FF'">{{ btnText }}</text>
</view>
<view class="ClearB"></view>
</view>
<view class="Input MarginT_40rpx BG_F6F7FB">
<input type="password" v-model="logInData.password" placeholder="请输入您的密码"
class="Height100 Input2 FloatL MarginL_60rpx FontS_32rpx">
<view class="Input">
<view class="img-box">
<image :src="$.imgSrc + '/scimg/login_password.png'" mode="aspectFit" class="input_left_icon input_icon"></image>
</view>
<input v-show="!showPassword" type="password" v-model="logInData.password" placeholder="请输入您的密码"
class="Height100 Input1 FloatL FontS_32rpx" />
<input v-show="showPassword" type="text" v-model="logInData.password" placeholder="请输入您的密码"
class="Height100 Input1 FloatL FontS_32rpx" />
<view class="img-box">
<image :src="$.imgSrc + (!showPassword ? '/scimg/login_no.png' : '/scimg/login_yes.png')" mode="aspectFit" class="input_left_icon input_icon" @click="clickPasswordBtn"></image>
</view>
<view class="ClearB"></view>
</view>
</view>
@ -60,9 +72,9 @@
</view> -->
<button type="button" :disabled="isDisabled"
class="Btn Block Width100 Color_FFFFFF FontS_36rpx FontBold"
@click="confirmSub">{{ currNav == 1 ? '注册':'登录' }}</button>
<text @click="findPsw" class="Block MarginT_40rpx TextCenter FontS_26rpx Color_0064FF"
v-if="currNav == 2">找回密码？</text>
@click="confirmSub">立即{{ currNav == 1 ? '注册':'登录' }}</button>
<!-- <text @click="findPsw" class="Block MarginT_40rpx TextCenter FontS_26rpx Color_0064FF"
v-if="currNav == 2">找回密码？</text> -->
</view>
</view>
</view>
@ -77,6 +89,7 @@
// 公用的js
$: this.$,
bgUrl1: '', // 登录信息背景图
bgUrl2: '', // 登录信息背景图
isAgree: false,
navList: [
// {type:1,label:'注册'},
@ -97,6 +110,7 @@
times: null,
seconds: 60,
isCodeDisabled: false,
showPassword: false,
}
},
// 页面加载
@ -109,12 +123,15 @@
onShow() {
// 顶部背景图
this.bgUrl1 = "background-image:url('" + this.$.imgSrc +
"/scimg/bg1.png');background-repeat: no-repeat;background-position: center top;background-size:100% 472rpx;"
"/scimg/login_bg_top.png');background-repeat: no-repeat; background-position: center; background-size: cover; min-height: 100vh; min-width: 100vw;"
},
// 计算属性
computed: {},
// 方法
methods: {
clickPasswordBtn() {
this.showPassword = !this.showPassword
},
checkAgree(type) {
let urlKey = 'portalTextType'
this.$.open('/pages/logIn/agree?type=' + type)
@ -245,14 +262,23 @@
.Content {
width: calc(100% - 176rpx);
padding: 132rpx 0rpx 180rpx 0rpx;
padding: 112rpx 0rpx 180rpx 0rpx;
.Logo {
width: 150rpx;
height: 150rpx;
margin: auto;
}
.NavBox {
.logo-title{
font-family: 'MFLiHei_Noncommercial-Regular';
font-size: 70rpx;
display: flex;
align-items: center;
justify-content: center;
color: white;
}
.Unit {
margin-right: 110rpx;
@ -287,8 +313,29 @@
.InputBox {
.Input {
height: 110rpx;
border-radius: 56rpx;
border-radius: 8rpx;
margin-bottom: 48rpx;
background-color: rgba(225, 225, 225, 0.8);
box-shadow: 0px 4px 10px 1px rgba(0,0,0,0.1);
position: relative;
display: flex;
.img-box{
height: 110rpx;
width: 110rpx;
display: flex;
justify-content: center;
align-items: center;
.input_icon{
width: 54rpx;
height: 54rpx;
}
.input_left_icon{
position: absolute;
}
}
.input-placeholder{
color: rgba(0, 0, 0, 0.4) !important;
}
.CodeBox {
text {
line-height: 110rpx;
@ -302,7 +349,9 @@
}
.Input1 {
width: calc(100% - 260rpx);
// padding-left: 20rpx;
// width: calc(100% - 260rpx);
flex: 1;
}
.Input2 {
@ -325,13 +374,19 @@
}
.Btn {
margin-top: 196rpx;
font-family: 'SOURCEHANSANSCN-MEDIUM';
margin-top: 96rpx;
height: 108rpx;
background: linear-gradient(90deg, #0064FF 0%, #2D99FD 100%);
box-shadow: 0rpx 6rpx 10rpx 0rpx rgba(194, 218, 255, 1);
border-radius: 54rpx;
background: linear-gradient(0deg, #0064FF 0%, #2D99FD 100%);
box-shadow: 0px 4px 10px 1px rgba(0,0,0,0.1);
border-radius: 8rpx;
line-height: 108rpx;
}
}
}
.pic{
position: absolute;
bottom: 0;
width: 100%;
}
</style>

BIN
static/fonts/Alimama_ShuHeiTi_Bold.ttf
View File

Binary file not shown.

BIN
static/fonts/MFLiHei_Noncommercial-Regular.ttf
View File

Binary file not shown.

BIN
static/fonts/SOURCEHANSANSCN-BOLD.TTF
View File

Binary file not shown.

BIN
static/fonts/SOURCEHANSANSCN-MEDIUM.TTF
View File

Binary file not shown.

BIN
static/fonts/SOURCEHANSANSCN-REGULAR.TTF
View File

Binary file not shown.

BIN
static/fonts/Tensentype-MeiHeiJ-Bold.TTF
View File

Binary file not shown.

BIN
static/scimg/jinghui.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 57 KiB

BIN
static/scimg/login_bg.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 882 KiB

BIN
static/scimg/login_bg_bottom.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 782 KiB

BIN
static/scimg/login_bg_top.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 720 KiB

BIN
static/scimg/login_no.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
static/scimg/login_password.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 904 B

BIN
static/scimg/login_user.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
static/scimg/login_yes.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

Write Preview
Loading…
Cancel
Save