Commit 8fc6df75 by hank

修改设备页面

parent 9005e0d1
......@@ -9,14 +9,15 @@
position: absolute;
align-items: center;
justify-content: center;
background-color: rgba($color: #000, $alpha: 0.7);
background-color: rgba($color: #000, $alpha: 0.5);
&-wrapper {
width: 700px;
width: 674px;
display: flex;
// margin-top: -50px;
padding-top: 36px;
border-radius: 8px;
padding-top: 21px;
padding-bottom: 66px;
border-radius: 16px;
flex-direction: column;
background-color: white;
......@@ -34,29 +35,45 @@
&-content-wrapper {
flex: 1;
text-align: center;
}
&-bottom-btn {
display: flex;
flex-direction: row;
justify-content: space-between;
padding: 0 56px;
border: 0 solid $border-color;
border-top-width: 1px;
}
&-confirm-text {
flex: 1;
height: 100px;
width: 252px;
max-width: 252px;
height: 86px;
line-height: 86px;
text-align: center;
line-height: 100px;
color: $primary-color;
background: linear-gradient(266deg, rgba(255, 171, 32, 1) 0%, rgba(255, 114, 14, 1) 100%);
border-radius: 43px;
font-size: 36px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: white;
}
&-cancel-text {
flex: 1;
height: 100px;
line-height: 100px;
width: 252px;
max-width: 252px;
height: 86px;
line-height: 86px;
text-align: center;
border: 0 solid $border-color;
border-right-width: 1px;
background: rgba(230, 230, 230, 1);
border-radius: 43px;
font-size: 36px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(102, 102, 102, 1);
}
}
......@@ -10,6 +10,38 @@
overflow: hidden;
}
.no-deviece-container {
padding-top: 134px;
.no-device-img {
display: block;
width: 351px;
height: 302px;
margin: 0 auto;
margin-bottom: 62px;
}
.tips {
text-align: center;
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: rgba(153, 153, 153, 1);
}
.go-shop {
text-align: center;
width: 310px;
height: 88px;
line-height: 88px;
margin: 0 auto;
margin-top: 134px;
color: rgba(255, 255, 255, 1);
background: linear-gradient(266deg, rgba(255, 171, 32, 1) 0%, rgba(255, 114, 14, 1) 100%);
border-radius: 60px;
}
}
.device-bind {
width: 100%;
min-height: 100%;
......@@ -99,6 +131,15 @@
padding-left: 0;
position: relative;
.triangle-con {
position: absolute;
width: 27px;
height: 100%;
top: 0;
bottom: 0;
right: -8px;
}
.triangle {
position: absolute;
top: 15px;
......@@ -186,10 +227,19 @@
display: inline-block;
}
.triangle {
.triangle-con {
position: absolute;
top: 15px;
width: 30px;
height: 140%;
top: -10px;
bottom: -10px;
right: -8px;
}
.triangle {
position: absolute;
top: 25px;
right: 0;
// margin-top: 10px;
height: 18px;
// border: 20px solid transparent;
......
......@@ -5,7 +5,7 @@ import DeviceItem from '@/conpoments/device_item'
import Taro, { Component, Config } from '@tarojs/taro'
import { View, Text, ScrollView, Button, Checkbox, Label, Input, Image } from '@tarojs/components'
import { AtModal, AtModalContent, AtList, AtListItem } from 'taro-ui'
import Modal from '@/conpoments/modal/index'
import './index.scss'
type PageStateProps = {
......@@ -192,7 +192,7 @@ class DeviceSelect extends Component {
}
showModalView() {
this.setState({
showModal: true
showModal: !this.state.showModal
})
}
searchName({ target }) {
......@@ -328,14 +328,13 @@ class DeviceSelect extends Component {
>
{items[activeIndex]}
</Text>
<Image
src="https://visual-clouds.oss-cn-beijing.aliyuncs.com/miniprogram/down-icon.png"
className="triangle"
onClick={this.showModalView}
onBlur={() => {
console.log('aaaa')
}}
/>
<View className="triangle-con" onClick={this.showModalView}>
<Image
src="https://visual-clouds.oss-cn-beijing.aliyuncs.com/miniprogram/down-icon.png"
className="triangle"
onClick={this.showModalView}
/>
</View>
</View>
{showModal ? (
<View className="dialog-container">
......@@ -397,11 +396,32 @@ class DeviceSelect extends Component {
</Label>
</View>
))}
<View className="all-btn">
<Text className="all" onClick={this.changeAllCheck}>
全选
</Text>
</View>
{allList && allList.length === 0 ? (
<View className="no-deviece-container">
<View>
<Image
className="no-device-img"
src="https://visual-clouds.oss-cn-beijing.aliyuncs.com/miniprogram/no-device.png"
/>
</View>
<View className="tips">您未添加设备,去商城挑选心仪的设备吧!</View>
<View
className="go-shop"
onClick={() => {
Taro.navigateTo({ url: '/pages/home/device/shop_list/index' })
}}
>
去商城
</View>
</View>
) : null}
{list.length && (
<View className="all-btn">
<Text className="all" onClick={this.changeAllCheck}>
全选
</Text>
</View>
)}
</ScrollView>
) : (
<ScrollView className="device-bind-scroll-view">
......@@ -429,27 +449,9 @@ class DeviceSelect extends Component {
完成
</Button>
</View>
{/* <AtModal isOpened={showModal}>
<AtModalContent>
<AtList>
{items.map(item => {
return <AtListItem title={item} key={item} />
})}
</AtList>
</AtModalContent>
</AtModal> */}
{/* <AtDrawer
show={showModal}
mask
onClose={() => {
this.onClose()
}}
items={items}
onItemClick={this.onItemClick}
>
aaa
</AtDrawer> */}
{/* <Modal>
<View>该作品已被保存,是否添加设备</View>
</Modal> */}
</View>
)
}
......
......@@ -40,16 +40,18 @@ class TempItem extends Component {
} else {
Taro.navigateTo({ url: `/pages/home/tempaltes/detail?templateId=${templateId}` })
}
this.isload = false
Taro.hideLoading()
})
.catch(() => {
this.isload = false
Taro.hideLoading()
})
}
} else {
setTimeout(() => {
this.isload = false
}, 500)
}, 200)
}
// Taro.navigateTo({ url: '/pages/home/device/my_film/index' })
}
......
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 sign in to comment