<template>
|
<view class="pages-station">
|
<view class="view-content" v-if="opStationType =='edit_pos'">
|
<view class="map-content">
|
<view class="position-site">
|
<a-button type="ghost" class="button" @click="clickPositionStation">
|
<text class="ico my-location-rounded" />
|
<text class="text">获取搬运车位置和朝向</text>
|
</a-button>
|
</view>
|
</view>
|
</view>
|
<view class="view-content" v-else-if="!onlyAdd">
|
<view class="list-content" v-if="stationList.length > 0">
|
<uni-swipe-action class="list">
|
<uni-swipe-action-item class="list-item"
|
:class="{'selected':stationEdit.stationID ==item.stationID,'border-top':index!= 0}"
|
v-for="(item,index) in stationList" :key="index" :auto-close="true"
|
@touchstart="onTouchStartStation(item)" @mousedown="onTouchStartStation(item)"
|
@mouseup="onTouchCancelStation" @touchend="onTouchCancelStation"
|
@touchcancel="onTouchCancelStation">
|
<view class="item-title">{{item.name}}</view>
|
<view class="item-text">
|
角度:{{Math.round(item.angle *180/3.14)}},坐标({{Math.round(Number(item.x)*100)/100}},{{Math.round(Number(item.y)*100)/100}})
|
</view>
|
<template v-slot:right>
|
<view class="btn-del" @click="clickDelStation(item)">删除</view>
|
</template>
|
</uni-swipe-action-item>
|
</uni-swipe-action>
|
</view>
|
<view class="list-no-content" v-else>
|
<uni-icons color="#ccc" type="info" size="128"></uni-icons>
|
<view class="space">还没有站点</view>
|
</view>
|
<view class="position-add" v-if="opStationType ==''" @click="clickAddStation" @touchstart='btnAddTouchStart'
|
@touchmove='btnAddTouchMove'
|
:style="{transform:`translate(${btnAddInfo.x}px,${btnAddInfo.y}px) scale(1)`}">
|
<uni-icons type="plus-filled" size="80" color="#1890FF"></uni-icons>
|
</view>
|
</view>
|
|
<view class="bottom">
|
<view class="bottom-content" v-if="opStationType =='edit_name' ">
|
<view class="tip">请输入站点名称</view>
|
<view class="name-input">
|
<input ref="refInputName" :focus="true" placeholder="输入站点名称" :value="stationEdit.name"
|
@input="onInputName"></input>
|
<uni-icons class="clear" color="#ccc" type="clear" size="20" v-if="showClearName"
|
@click="clickClearName"></uni-icons>
|
</view>
|
<view class="text-button-group">
|
<a-button type="ghost" class="button" @click="clickNameCancel">取消</a-button>
|
<a-button type="primary" class="button" @click="clickNameOK">确定</a-button>
|
</view>
|
</view>
|
<view class="bottom-content" v-else-if=" opStationType =='edit_pos'">
|
<view class="tip">调节位置</view>
|
<view class="row-group">
|
<view class="coordinate">
|
<text class="name">横坐标:</text>
|
<input ref="refInputX" class="number-input" type="number" :value="stationEdit.x"
|
@input="onInputX"></input>
|
</view>
|
<view class="coordinate">
|
<text class="name">竖坐标:</text>
|
<input ref="refInputX" class="number-input" type="number" :value="stationEdit.y"
|
@input="onInputY"></input>
|
</view>
|
</view>
|
|
<view class="tip">调节朝向</view>
|
<view class="angle-group">
|
<image class="img-angle" :src="angleSvg" alt="SVG 图片" />
|
<image class="img-angle-pos" src="/images/Frame 153.svg" alt="SVG 图片"
|
@touchstart="handleAngleTouchStart" @touchmove="handleAngleTouchMove" />
|
</view>
|
<a-button type="primary" class="button" @click="clickPosOK">完成</a-button>
|
</view>
|
</view>
|
<view>
|
<uni-popup ref="refPopupOperateStation" background-color="transparent"
|
maskBackgroundColor="rgba(0, 0, 0, 0.2)">
|
<view class="popup-content">
|
<view class="popup-content-btn">
|
<view class="img-button-group">
|
<view fill="none" class="button" @click.stop="clickStationDelete">
|
<text class="ico delete-outline"></text>
|
<view class="text"> 删除站点</view>
|
</view>
|
<view type="text" class="button" @click.stop="clickStationPostion">
|
<text class="ico edit-line"></text>
|
<view class="text">调整位置朝向</view>
|
</view>
|
<view type="text" class="button" @click.stop="clickStationRename">
|
<text class="ico rename"></text>
|
<view class="text">重命名</view>
|
|
</view>
|
</view>
|
</view>
|
|
</view>
|
</uni-popup>
|
</view>
|
</view>
|
</template>
|
<script>
|
import {
|
showToast,
|
showModal,
|
session,
|
} from "@/comm/utils.js"
|
// import OIFabric from "@/components/oi-fabric/index.vue"
|
import {
|
Button
|
} from 'antd-mobile-vue-next'
|
|
import {
|
stations,
|
getAgvState,
|
addStation,
|
updateStation,
|
delStation
|
} from "@/api/vehicle.js"
|
export default {
|
name: "PagesStation",
|
components: {
|
'a-button': Button
|
},
|
data() {
|
return {
|
ip: "",
|
opStationType: "",
|
isEdit: false,
|
windowWidth: 375,
|
stationEdit: {
|
stationID: "",
|
name: "",
|
x: 0,
|
y: 0,
|
angle: 0
|
},
|
showClearName: false,
|
stationList: [],
|
angleSvg: "/static/images/angle0.svg",
|
onlyAdd: false,
|
btnAddInfo: {
|
lx: 0,
|
ly: 0,
|
x: 0,
|
y: 0
|
},
|
}
|
},
|
computed: {
|
getMaxStationNo() {
|
let num = 0
|
this.stationList.forEach((item) => {
|
if (num < item.stationID) {
|
num = item.stationID
|
}
|
})
|
return num
|
},
|
},
|
watch: {
|
|
},
|
onLoad(option) {
|
const _this = this
|
this.ip = option.ip || ""
|
this.onlyAdd = option.isAdd ? true : false
|
|
uni.setNavigationBarTitle({
|
title: "站点列表"
|
})
|
uni.getSystemInfo({
|
success(e) {
|
_this.windowWidth = e.windowWidth
|
},
|
|
})
|
if (this.onlyAdd) {
|
this.opStationType = "edit_name"
|
uni.setNavigationBarTitle({
|
title: "添加站点"
|
})
|
}
|
|
this.loadData()
|
|
},
|
onBackPress() {
|
if (this.onlyAdd) {
|
if (this.opStationType == "edit_pos") {
|
this.opStationType = "edit_name"
|
return true
|
}
|
return false
|
}
|
if (this.isEdit) {
|
if (this.opStationType == "edit_name" || this.opStationType == "edit_pos") {
|
this.opStationType = ""
|
uni.setNavigationBarTitle({
|
title: "站点列表"
|
})
|
this.$refs.refPopupOperateStation.open("bottom")
|
|
return true
|
}
|
} else {
|
if (this.opStationType == "edit_pos") {
|
this.opStationType = "edit_name"
|
return true
|
}
|
}
|
|
return false
|
|
},
|
methods: {
|
setData(obj) {
|
let that = this;
|
let keys = [];
|
let val, data;
|
|
Object.keys(obj).forEach(function(key) {
|
keys = key.split(".");
|
val = obj[key];
|
data = that.$data;
|
keys.forEach(function(key2, index) {
|
if (index + 1 == keys.length) {
|
that.$set(data, key2, val);
|
} else {
|
if (!data[key2]) {
|
that.$set(data, key2, {});
|
}
|
}
|
data = data[key2];
|
});
|
});
|
},
|
async loadData() {
|
try {
|
let btninfo = session.getValue('station_btn_add')
|
if (btninfo) {
|
|
if (btninfo.x > 10) {
|
btninfo.x = 10
|
}
|
if (btninfo.x > 40) {
|
btninfo.x = 40
|
}
|
this.btnAddInfo = btninfo
|
}
|
this.stationList = await this.loadStations() || []
|
|
} catch (ex) {
|
|
this.showError(ex)
|
}
|
},
|
async loadAgvState() {
|
try {
|
const info = await getAgvState(this.ip)
|
return info
|
} catch (ex) {
|
this.showError(ex)
|
return {}
|
}
|
},
|
async loadStations() {
|
try {
|
const info = await stations(this.ip)
|
return info.station_list || []
|
} catch (ex) {
|
this.showError(ex)
|
return []
|
}
|
},
|
clickAddStation() {
|
const _this = this
|
this.isEdit = false
|
this.stationEdit = {
|
stationID: "",
|
name: "",
|
x: 0,
|
y: 0,
|
angle: 0,
|
}
|
this.opStationType = "edit_name"
|
uni.setNavigationBarTitle({
|
title: "添加站点"
|
})
|
|
},
|
btnAddTouchStart(e) {
|
this.btnAddInfo.lx = e.touches[0].clientX;
|
this.btnAddInfo.ly = e.touches[0].clientY;
|
},
|
btnAddTouchMove(e) {
|
|
if (this.btnAddInfo.ly < 40) {
|
|
this.btnAddInfo.x += (e.touches[0].clientX - this.btnAddInfo.lx)
|
this.btnAddInfo.lx = e.touches[0].clientX;
|
this.btnAddInfo.ly = e.touches[0].clientY;
|
if (this.btnAddInfo.x < 50 - this.windowWidth) {
|
this.btnAddInfo.x = 50 - this.windowWidth
|
}
|
if (this.btnAddInfo.x > 40) {
|
this.btnAddInfo.x = 40
|
}
|
session.setValue('station_btn_add', this.btnAddInfo)
|
return
|
}
|
|
this.btnAddInfo.x += (e.touches[0].clientX - this.btnAddInfo.lx)
|
this.btnAddInfo.y += (e.touches[0].clientY - this.btnAddInfo.ly)
|
this.btnAddInfo.lx = e.touches[0].clientX;
|
this.btnAddInfo.ly = e.touches[0].clientY;
|
|
|
if (this.btnAddInfo.x < 50 - this.windowWidth) {
|
this.btnAddInfo.x = 50 - this.windowWidth
|
}
|
if (this.btnAddInfo.x > 40) {
|
this.btnAddInfo.x = 40
|
}
|
if (this.btnAddInfo.y > 80) {
|
this.btnAddInfo.y = 80
|
}
|
|
|
|
session.setValue('station_btn_add', this.btnAddInfo)
|
},
|
onTouchStartStation(item) {
|
const _this = this
|
let now = new Date()
|
//console.log(`${now.getMinutes()}:${now.getSeconds()}:${now.getMilliseconds()}`)
|
Object.assign(this.stationEdit, item)
|
|
const angle = this.getStantardAngle(this.stationEdit.angle * 180 / 3.14)
|
this.angleSvg = `/static/images/angle${angle}.svg`
|
this.opStationType = ""
|
now = new Date()
|
//console.log(`${now.getMinutes()}:${now.getSeconds()}:${now.getMilliseconds()}`)
|
this.pressStationTimer = setTimeout(function() {
|
this.isEdit = true
|
let now = new Date()
|
//console.log(`${now.getMinutes()}:${now.getSeconds()}:${now.getMilliseconds()}`)
|
_this.$refs.refPopupOperateStation.open("bottom")
|
}, 1500)
|
},
|
onTouchCancelStation() {
|
clearTimeout(this.pressStationTimer);
|
this.pressStationTimer = null;
|
},
|
clickDelStation(item) {
|
showModal("确认删除站点", "警告").then((res) => {
|
if (res) {
|
this.deleteStation(item)
|
}
|
})
|
},
|
|
async deleteStation(item) {
|
try {
|
await delStation(this.ip, [item.stationID])
|
const list = this.stationList
|
const index = list.findIndex((a) => {
|
return a.stationID == item.stationID
|
})
|
if (index < 0)
|
return
|
list.splice(index, 1)
|
this.stationList = [...list]
|
this.stationEdit = {
|
stationID: "",
|
name: "",
|
x: 0,
|
y: 0,
|
angle: 0
|
}
|
|
} catch (ex) {
|
this.showError(ex)
|
}
|
|
},
|
clickStationDelete() {
|
const _this = this
|
showModal("确认删除站点", "警告").then((res) => {
|
if (res) {
|
_this.deleteStation(this.stationEdit)
|
_this.$refs.refPopupOperateStation.close()
|
} else {
|
|
}
|
})
|
},
|
clickStationPostion() {
|
this.isEdit = true
|
|
this.opStationType = "edit_pos"
|
uni.setNavigationBarTitle({
|
title: "调整站点位置和朝向"
|
})
|
this.$refs.refPopupOperateStation.close()
|
},
|
clickStationRename() {
|
this.isEdit = true
|
this.opStationType = "edit_name"
|
uni.setNavigationBarTitle({
|
title: "站点重命名"
|
})
|
this.$refs.refPopupOperateStation.close()
|
},
|
|
async stationAdd(item) {
|
try {
|
await addStation(this.ip, item)
|
await updateStation(this.ip, item)
|
this.stationList.push({
|
stationID: item.stationID,
|
name: item.name,
|
angle: item.angle,
|
x: item.x,
|
y: item.y
|
})
|
|
|
} catch (ex) {
|
this.showError(ex)
|
}
|
},
|
async stationUpdate(item) {
|
try {
|
await updateStation(this.ip, item)
|
const curIndex = this.stationList.findIndex((a) => a.stationID == item.stationID)
|
if (curIndex > -1) {
|
const station = this.stationList[curIndex]
|
station.name = item.name
|
station.angle = item.angle
|
station.x = item.x
|
station.y = item.y
|
}
|
|
} catch (ex) {
|
this.showError(ex)
|
}
|
},
|
|
clickNameCancel() {
|
if (this.onlyAdd) {
|
uni.navigateBack({
|
delta: 1, //返回层数,2则上上页
|
})
|
return
|
}
|
if (this.isEdit) {
|
this.opStationType = ""
|
uni.setNavigationBarTitle({
|
title: "站点列表"
|
})
|
this.$refs.refPopupOperateStation.open("bottom")
|
} else {
|
this.opStationType = ""
|
}
|
},
|
async clickNameOK() {
|
try {
|
const name = this.stationEdit.name.trim()
|
if (!name) {
|
showToast("站点名称还未输入")
|
return
|
}
|
if (this.isEdit) {
|
this.stationEdit.name = name
|
await this.stationUpdate(this.stationEdit)
|
this.opStationType = ""
|
uni.setNavigationBarTitle({
|
title: "站点列表"
|
})
|
this.$refs.refPopupOperateStation.open("bottom")
|
} else {
|
this.stationEdit = {
|
stationID: this.getMaxStationNo + 1,
|
name: name,
|
x: 0,
|
y: 0,
|
angle: 0,
|
}
|
this.opStationType = "edit_pos"
|
}
|
|
} catch (ex) {
|
this.showError(ex)
|
}
|
|
},
|
async clickPosOK() {
|
try {
|
if (this.onlyAdd) {
|
await this.stationAdd(this.stationEdit)
|
this.opStationType = ""
|
const eventChannel = this.getOpenerEventChannel();
|
eventChannel.emit('add', this.stationEdit);
|
uni.navigateBack({
|
delta: 1, //返回层数,2则上上页
|
})
|
return
|
}
|
if (this.isEdit) {
|
await this.stationUpdate(this.stationEdit)
|
this.opStationType = ""
|
uni.setNavigationBarTitle({
|
title: "站点列表"
|
})
|
this.$refs.refPopupOperateStation.open("bottom")
|
} else {
|
await this.stationAdd(this.stationEdit)
|
this.opStationType = ""
|
|
}
|
} catch (ex) {
|
|
this.showError(ex)
|
}
|
},
|
clickClearName() {
|
this.stationEdit.name = ""
|
this.showClearName = false
|
},
|
onInputName(event) {
|
this.stationEdit.name = event.detail.value;
|
if (this.stationEdit.name)
|
this.showClearName = true
|
else
|
this.showClearName = false
|
},
|
onInputX(event) {
|
const strictRegex = /^[-+]?(\d+\.?\d*|\.\d+)$/;
|
let num = event.detail.value
|
if (!strictRegex.test(num)) {
|
showToast("输入内容只能包含数字、正负号和小数点")
|
return
|
} else {
|
if (Math.round(Number(num)) === Number(num)) {
|
if (!Number.isSafeInteger(Number(num))) {
|
showToast("输入数字超出数值安全范围")
|
}
|
} else {
|
if (!Number.isSafeInteger(Math.round(Number(num)))) {
|
showToast("输入数字超出数值安全范围")
|
}
|
}
|
}
|
this.stationEdit.x = event.detail.value
|
|
},
|
onInputY(event) {
|
const strictRegex = /^[-+]?(\d+\.?\d*|\.\d+)$/;
|
let num = event.detail.value
|
if (!strictRegex.test(num)) {
|
showToast("输入内容只能包含数字、正负号和小数点")
|
} else {
|
if (Math.round(Number(num)) === Number(num)) {
|
if (!Number.isSafeInteger(Number(num))) {
|
showToast("输入数字超出数值安全范围")
|
}
|
} else {
|
if (!Number.isSafeInteger(Math.round(Number(num)))) {
|
showToast("输入数字超出数值安全范围")
|
}
|
}
|
|
}
|
this.stationEdit.y = event.detail.value
|
|
},
|
getStantardAngle(angle) {
|
let resAngle = 0
|
if (angle < -157.5) {
|
resAngle = 180
|
} else if (angle < -112.5) {
|
resAngle = -135
|
} else if (angle < -67.5) {
|
resAngle = -90
|
} else if (angle < -22.5) {
|
resAngle = -45
|
} else if (angle < 22.5) {
|
resAngle = 0
|
} else if (angle < 67.5) {
|
resAngle = 45
|
} else if (angle < 112.5) {
|
resAngle = 90
|
} else if (angle < 157.5) {
|
resAngle = 135
|
} else if (angle <= 180) {
|
resAngle = 180
|
} else {
|
resAngle = 0
|
}
|
return resAngle
|
|
},
|
|
touchAngleChange(e) {
|
let angle = 0
|
|
const ptX = e.touches[0].clientX
|
|
const offX = ptX // ptX - e.target.offsetLeft
|
const offW = 300 / 16
|
const centerPt = this.windowWidth / 2
|
if (offX < centerPt - 8 * offW) {
|
return
|
} else if (offX < centerPt - 7 * offW) {
|
angle = 180
|
} else if (offX < centerPt - 5 * offW) {
|
angle = -135
|
} else if (offX < centerPt - 3 * offW) {
|
angle = -90
|
} else if (offX <= centerPt - offW) {
|
angle = -45
|
} else if (offX < centerPt + offW) {
|
angle = 0
|
} else if (offX < centerPt + 3 * offW) {
|
angle = 45
|
} else if (offX < centerPt + 5 * offW) {
|
angle = 90
|
} else if (offX < centerPt + 7 * offW) {
|
angle = 135
|
} else if (offX <= centerPt + 8 * offW) {
|
angle = 180
|
} else {
|
return
|
}
|
this.stationEdit.angle = angle * 3.14 / 180
|
|
this.angleSvg = `/static/images/angle${angle}.svg`
|
|
},
|
handleAngleTouchStart(e) {
|
// console.log("handleAngleTouchStart", e)
|
this.touchAngleChange(e)
|
|
},
|
handleAngleTouchMove(e) {
|
// console.log("handleAngleTouchMove", e)
|
this.touchAngleChange(e)
|
},
|
|
async clickPositionStation() {
|
try {
|
const infoAgv = await this.loadAgvState()
|
this.stationEdit.x = infoAgv.x
|
this.stationEdit.y = infoAgv.y
|
|
const angle = this.getStantardAngle(infoAgv.angle * 180 / 3.14)
|
this.angleSvg = `/static/images/angle${angle}.svg`
|
this.stationEdit.angle = angle * 3.14 / 180
|
} catch (ex) {
|
this.showError(ex)
|
}
|
},
|
showError(ex) {
|
let exStr = JSON.stringify(ex)
|
if (exStr == "{}")
|
exStr = ex
|
let tip = typeof ex.msg == "string" ? ex.msg : exStr
|
showModal(tip, "错误", false)
|
},
|
|
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.pages-station {
|
display: flex;
|
width: 750rpx;
|
height: 100vh;
|
position: relative;
|
|
.view-content {
|
position: absolute;
|
top: 0;
|
left: 0;
|
right: 0;
|
bottom: 0;
|
display: flex;
|
flex-direction: column;
|
|
.position-add {
|
position: fixed;
|
right: 10px;
|
bottom: 40px;
|
}
|
}
|
|
.map-content {
|
width: 100%;
|
display: flex;
|
flex: 1;
|
position: relative;
|
|
.content {
|
overflow: auto;
|
position: absolute;
|
left: 0;
|
right: 0;
|
bottom: 0;
|
top: 0;
|
|
.fabric {
|
width: 100%;
|
height: 100%;
|
background-color: #fff;
|
}
|
}
|
|
.position-site {
|
display: flex;
|
position: absolute;
|
margin: 2rpx;
|
right: 40rpx;
|
bottom: 500rpx;
|
|
.button {
|
font-size: 32rpx;
|
|
.ico {
|
margin-right: 8rpx;
|
}
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
.list-content {
|
display: flex;
|
width: 100%;
|
padding: 20rpx;
|
flex: 1;
|
flex-direction: column;
|
overflow-y: auto;
|
overflow-x: hidden;
|
|
.list {
|
border-radius: 10px;
|
background-color: #fff;
|
|
.list-item {
|
|
padding: 10rpx 0;
|
|
|
.item-title {
|
font-size: 32rpx;
|
padding: 10rpx 20rpx;
|
}
|
|
|
.item-text {
|
font-size: 28rpx;
|
color: #888;
|
padding: 10rpx 20rpx;
|
}
|
}
|
|
.border-top {
|
border-top: 1px solid #f5f5f5;
|
}
|
|
.selected {
|
background-color: #eee;
|
}
|
|
.btn-del {
|
margin: 0 10rpx;
|
display: flex;
|
padding: 0 10rpx;
|
background-color: #FF4D4F;
|
font-weight: 700;
|
color: #fff;
|
justify-content: center;
|
align-items: center;
|
}
|
|
}
|
}
|
|
.list-no-content {
|
margin-top: 50px;
|
padding: 20rpx 40rpx;
|
align-items: center;
|
text-align: center;
|
display: flex;
|
flex-direction: column;
|
font-size: 30rpx;
|
font-weight: 400;
|
|
.img {
|
width: 212rpx;
|
height: 212rpx;
|
color: #ddd;
|
}
|
|
.space {
|
margin-top: 20rpx;
|
}
|
|
}
|
|
.bottom {
|
position: fixed;
|
left: 50rpx;
|
right: 50rpx;
|
bottom: 20rpx;
|
display: flex;
|
|
.bottom-content {
|
display: flex;
|
flex-direction: column;
|
width: 100%;
|
// justify-content: center;
|
// align-items: center;
|
padding: 0 10rpx;
|
padding-bottom: 10rpx;
|
background-color: #fff;
|
border-radius: 10rpx;
|
|
|
.title {
|
font-size: 40rpx;
|
margin-bottom: 10rpx;
|
}
|
|
.tip {
|
color: #888;
|
margin: 10rpx;
|
text-align: left;
|
}
|
|
.row-group {
|
display: flex;
|
flex-direction: row;
|
margin: 10rpx 0;
|
|
}
|
|
.angle-group {
|
padding: 10rpx;
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
align-items: center;
|
|
.img-angle {
|
width: 128rpx;
|
height: 42rpx;
|
margin-bottom: 10rpx;
|
}
|
|
.img-angle-pos {
|
width: 300px;
|
height: 64rpx;
|
margin: 10rpx;
|
}
|
|
}
|
|
.coordinate {
|
flex: 1;
|
display: flex;
|
flex-direction: row;
|
align-items: center;
|
// .name{
|
// padding: 10rpx 0;
|
|
// }
|
}
|
|
.number-input {
|
flex: 1;
|
background-color: #fff;
|
padding: 0 10rpx;
|
border-radius: 8rpx;
|
color: #1890FF;
|
}
|
|
|
.name-input {
|
width: calc(100% - 20rpx);
|
margin-bottom: 10rpx;
|
background-color: #fff;
|
padding: 10rpx;
|
border-radius: 8rpx;
|
display: flex;
|
flex-direction: row;
|
color: #1890FF;
|
|
input {
|
flex: 1;
|
}
|
}
|
}
|
|
.img-button-group {
|
display: flex;
|
//width: 100%;
|
flex-direction: row;
|
border-radius: 10px;
|
border: 1px solid #fff;
|
font-size: 30rpx !important;
|
justify-content: space-around;
|
|
.button {
|
margin: 10rpx 20rpx;
|
|
height: 144rpx !important;
|
border: 0;
|
display: flex;
|
flex-direction: column;
|
background-color: #00000000;
|
|
.img {
|
margin: auto;
|
width: 72rpx;
|
height: 72rpx;
|
|
}
|
|
.ico {
|
margin: auto;
|
font-size: 72rpx;
|
color: #1890FF;
|
}
|
|
.text {
|
margin: auto;
|
|
}
|
}
|
|
}
|
|
|
.text-button-group {
|
display: flex;
|
width: 100%;
|
justify-content: center;
|
align-items: center;
|
flex-direction: column;
|
font-size: 30rpx !important;
|
|
.button {
|
margin: auto;
|
margin-top: 20rpx;
|
width: calc(100% - 10rpx);
|
}
|
|
.am-button {
|
border-radius: 30px;
|
}
|
|
.am-button-ghost {
|
border: 1px solid #1677ff !important;
|
|
}
|
}
|
|
|
}
|
|
.popup-content {
|
display: flex;
|
justify-content: center;
|
flex-direction: column;
|
background-color: transparent;
|
}
|
|
.popup-content-btn {
|
margin-bottom: 20rpx;
|
margin-left: 50rpx;
|
width: 600rpx;
|
background-color: #fff;
|
border-radius: 5px;
|
display: flex;
|
|
.img-button-group {
|
display: flex;
|
//width: 100%;
|
flex-direction: row;
|
border-radius: 10px;
|
border: 1px solid #fff;
|
font-size: 30rpx !important;
|
|
margin: auto;
|
|
.button {
|
margin: 10rpx 20rpx;
|
|
height: 144rpx !important;
|
border: 0;
|
display: flex;
|
flex-direction: column;
|
background-color: #00000000;
|
|
.img {
|
margin: auto;
|
width: 72rpx;
|
height: 72rpx;
|
|
}
|
|
.ico {
|
margin: auto;
|
font-size: 72rpx;
|
color: #1890FF;
|
}
|
|
.text {
|
margin: auto;
|
|
}
|
}
|
|
}
|
|
}
|
|
|
}
|
</style>
|