静态界面80%
This commit is contained in:
Haiyi
@@ -0,0 +1,4 @@
|
||||
export default {
|
||||
navigationBarTitleText: '样品对比',
|
||||
enableShareAppMessage: false,
|
||||
}
|
||||
@@ -0,0 +1,198 @@
|
||||
page {
|
||||
background: #f3f3f3;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.body {
|
||||
overflow: hidden;
|
||||
|
||||
.topBox {
|
||||
margin-top: 24px;
|
||||
margin-left: 30px;
|
||||
width: 690px;
|
||||
height: 86px;
|
||||
background: #ffffff;
|
||||
border-radius: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.leftBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 19px;
|
||||
|
||||
.leftFont {
|
||||
font-size: 28px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
text-align: left;
|
||||
color: #707070;
|
||||
margin-right: 14px;
|
||||
}
|
||||
|
||||
.borderBox {
|
||||
width: 0px;
|
||||
height: 62px;
|
||||
border: 2px solid #f3f3f3;
|
||||
margin-right: 39px;
|
||||
}
|
||||
|
||||
.cricleBox {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background: #cccccc;
|
||||
border-radius: 50%;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.notNet {
|
||||
font-size: 28px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
color: #aaaaaa;
|
||||
}
|
||||
}
|
||||
|
||||
.iconMore {
|
||||
margin-right: 30px;
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.contBox {
|
||||
margin-top: 53px;
|
||||
display: flex;
|
||||
padding-left: 56px;
|
||||
|
||||
.firstBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
|
||||
.firstLeftName {
|
||||
font-size: 26px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
color: #707070;
|
||||
}
|
||||
|
||||
.firstLeftbox {
|
||||
width: 290px;
|
||||
height: 290px;
|
||||
background: #dddddd;
|
||||
margin-top: 13px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
border-radius: 50%;
|
||||
|
||||
.clickFont {
|
||||
font-size: 28px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
color: #707070;
|
||||
}
|
||||
}
|
||||
|
||||
.nameColor {
|
||||
font-size: 24px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
color: #707070;
|
||||
margin-top: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.reslutBox {
|
||||
width: 692px;
|
||||
height: 180px;
|
||||
background: #ffffff;
|
||||
margin-top: 30px;
|
||||
margin-left: 29px;
|
||||
border-radius: 20px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.reslutTitle {
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
margin-top: 41px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.titleLeft {
|
||||
margin-left: 48px;
|
||||
font-size: 26px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Bold;
|
||||
font-weight: 700;
|
||||
color: #707070;
|
||||
}
|
||||
|
||||
.titleRiht {
|
||||
margin-right: 37px;
|
||||
width: 136px;
|
||||
height: 46px;
|
||||
background: #ffd9d9;
|
||||
border-radius: 10px;
|
||||
font-size: 28px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
color: #ff4a4a;
|
||||
line-height: 46px;
|
||||
}
|
||||
|
||||
.titleRiht1 {
|
||||
background: #cdf3df;
|
||||
margin-right: 37px;
|
||||
width: 136px;
|
||||
height: 46px;
|
||||
border-radius: 10px;
|
||||
font-size: 28px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
text-align: center;
|
||||
line-height: 46px;
|
||||
color: #07C160;
|
||||
}
|
||||
}
|
||||
|
||||
.notResult {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 26px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
color: #ababab;
|
||||
margin-top: 14px;
|
||||
}
|
||||
|
||||
.notBox {
|
||||
margin-top: 32px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
|
||||
.notLeft {
|
||||
font-size: 26px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
color: #707070;
|
||||
margin-left: 40px;
|
||||
}
|
||||
|
||||
.notright {
|
||||
font-size: 26px;
|
||||
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
|
||||
font-weight: 400;
|
||||
color: #707070;
|
||||
margin-right: 37px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
|
||||
import { Image, Text, Textarea, View } from "@tarojs/components"
|
||||
import Taro, { useDidShow, usePullDownRefresh, useRouter } from "@tarojs/taro";
|
||||
import classnames from "classnames";
|
||||
import styles from './index.module.scss'
|
||||
export default () => {
|
||||
return (
|
||||
<View className={styles.body}>
|
||||
<View className={styles.topBox}>
|
||||
<View className={styles.leftBox}>
|
||||
<View className={styles.leftFont}>蓝牙设备</View>
|
||||
<View className={styles.borderBox}></View>
|
||||
<View className={styles.cricleBox}></View>
|
||||
<View className={styles.notNet}></View>
|
||||
</View>
|
||||
<Text className={classnames("iconfont icon-a-moreback", styles.iconMore)}></Text>
|
||||
</View>
|
||||
<View className={styles.contBox} >
|
||||
<View className={styles.firstBox} style="margin-right:27px">
|
||||
<View className={styles.firstLeftName}>对比样品</View>
|
||||
<View className={styles.firstLeftbox}>
|
||||
<View className={styles.clickFont}>点击取色</View>
|
||||
</View>
|
||||
<View className={styles.nameColor}>--</View>
|
||||
</View>
|
||||
<View className={styles.firstBox}>
|
||||
<View className={styles.firstLeftName}>对比样品</View>
|
||||
<View className={styles.firstLeftbox}>
|
||||
<View className={styles.clickFont}>点击取色</View>
|
||||
</View>
|
||||
<View className={styles.nameColor}>--</View>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.reslutBox}>
|
||||
<View className={styles.reslutTitle}>
|
||||
<View className={styles.titleLeft}>测量结果</View>
|
||||
{/* <View className={styles.titleRiht}>不合格</View> */}
|
||||
<View className={styles.titleRiht1}>合格</View>
|
||||
</View>
|
||||
{/* <View className={styles.notResult}>暂无数据</View> */}
|
||||
<View className={styles.notBox}>
|
||||
<View className={styles.notLeft}>色差值: 0.2</View>
|
||||
<View className={styles.notright}>无明显色差</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
@@ -179,7 +179,7 @@ const Assets = () => {
|
||||
// 功能
|
||||
const Main = memo(() => {
|
||||
let menu = [{ text: "地址管理", icon: "icon-shoucang",url: "/pages/addressManager/index" },{ text: "码单管理", icon: "icon-shoucang",url: "/pages/weightList/index" },
|
||||
{ text: "我的收藏", icon: "icon-shoucang" }, { text: "颜色对比", icon: "icon-yanseduibi" },
|
||||
{ text: "我的收藏", icon: "icon-shoucang" }, { text: "颜色对比", icon: "icon-yanseduibi",url: "/pages/sampleComparison/index" },
|
||||
{ text: "分享推广", icon: "icon-fenxiang" }, { text: "团队邀请", icon: "icon-yaoqingtuandui" }]
|
||||
return (
|
||||
<View className={`${styles.crad} ${styles['card-main']} ${styles['card-feature']}`}>
|
||||
|
||||
Reference in New Issue
Block a user