小程序富文本支持表格
blak-kong
2 years ago
parent
e593596af7
commit
584daf9d13
@ -0,0 +1,21 @@
|
||||
button[type="primary"] {
|
||||
background-color: #000; /* 设置按钮背景颜色为灰色 */
|
||||
color: #fff; /* 设置按钮文字颜色为白色 */
|
||||
border-color: #000; /* 设置按钮边框颜色为灰色 */
|
||||
}
|
||||
button[disabled][type="primary"] {
|
||||
background-color: #ccc !important; /* 设置按钮背景颜色为灰色 */
|
||||
color: #fff !important; /* 设置按钮文字颜色为白色 */
|
||||
border-color: #ccc !important; /* 设置按钮边框颜色为灰色 */
|
||||
}
|
||||
|
||||
.btn {
|
||||
background-color: #000; /* 设置按钮背景颜色为灰色 */
|
||||
color: #fff; /* 设置按钮文字颜色为白色 */
|
||||
border-color: #000; /* 设置按钮边框颜色为灰色 */
|
||||
}
|
||||
.btn-disable {
|
||||
background-color: #ccc !important; /* 设置按钮背景颜色为灰色 */
|
||||
color: #fff !important; /* 设置按钮文字颜色为白色 */
|
||||
border-color: #ccc !important; /* 设置按钮边框颜色为灰色 */
|
||||
}
|
||||
@ -0,0 +1,54 @@
|
||||
import classnames from "classnames";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { Component } from "react";
|
||||
|
||||
import { Block, View, Image, Text, Button, PageMeta } from "@tarojs/components";
|
||||
|
||||
export default class BaseComponent extends Component<any, any> {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
name: "全局组件",
|
||||
};
|
||||
}
|
||||
|
||||
async onLoad() {}
|
||||
componentDidMount() {}
|
||||
|
||||
componentWillUnmount() {}
|
||||
|
||||
componentDidShow() {}
|
||||
|
||||
componentDidHide() {}
|
||||
|
||||
async initData() {}
|
||||
|
||||
showInit() {
|
||||
const isFirst = Taro.getStorageSync("isWelcome");
|
||||
if (isFirst) {
|
||||
this.checkShowPrivacyPopup();
|
||||
}
|
||||
}
|
||||
// 检测是否弹出隐私协议
|
||||
checkShowPrivacyPopup() {
|
||||
Taro.getPrivacySetting({
|
||||
success: (res) => {
|
||||
// console.log("检测是否弹出隐私协议", res); // 返回结果为: res = { needAuthorization: true/false, privacyContractName: '《xxx隐私保护指引》' }
|
||||
if (res.needAuthorization) {
|
||||
this.setState({ isShowPrivacyPopup: true });
|
||||
} else {
|
||||
// 用户已经同意过隐私协议，所以不需要再弹出隐私协议，也能调用隐私接口
|
||||
this.initData();
|
||||
}
|
||||
},
|
||||
fail: () => {},
|
||||
complete: () => {
|
||||
// 授权完成运行页面初始化
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
return <Block></Block>;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 377 B |
@ -0,0 +1,84 @@
|
||||
.binding-box {
|
||||
width: 650rpx;
|
||||
// height: 800rpx;
|
||||
padding: 40rpx;
|
||||
padding-bottom: 80rpx;
|
||||
box-sizing: border-box;
|
||||
.binding-popup-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 700;
|
||||
text-align: center;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.binding-popup-content-box {
|
||||
margin-top: 60rpx;
|
||||
}
|
||||
|
||||
.binding-popup-content {
|
||||
font-size: 28rpx;
|
||||
margin-bottom: 20rpx;
|
||||
max-height: 600rpx;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.binding-popup-content.is-binding {
|
||||
color: #41a9fc;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.binding-popup-content.is-last {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.binding-popup-btns {
|
||||
display: flex;
|
||||
margin-top: 76rpx;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.binding-popup-btn {
|
||||
width: 240rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
font-size: 30rpx;
|
||||
text-align: center;
|
||||
border: 1rpx solid #000;
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
|
||||
.binding-popup-btn:first-child {
|
||||
margin-left: 22rpx;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.binding-popup-btn:last-child {
|
||||
color: #fff;
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
.pupup-close {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 30rpx;
|
||||
color: #000;
|
||||
font-size: 36rpx;
|
||||
}
|
||||
|
||||
.binding-popup-footer {
|
||||
display: flex;
|
||||
margin-top: 76rpx;
|
||||
justify-content: center;
|
||||
.binding-popup-btn {
|
||||
width: 270rpx;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
border: 1rpx solid #000;
|
||||
border-radius: 45rpx;
|
||||
color: #fff;
|
||||
background-color: #000;
|
||||
}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 150 KiB |
@ -0,0 +1,139 @@
|
||||
/* pages/userInfo/userInfo.wxss */
|
||||
page {
|
||||
background: #f3f3f3;
|
||||
}
|
||||
.nav {
|
||||
position: fixed;
|
||||
z-index: 99;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
}
|
||||
.nav .logo {
|
||||
width: 223rpx;
|
||||
}
|
||||
.nav .nav_box {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
.main {
|
||||
text-align: center;
|
||||
padding-bottom: 153rpx;
|
||||
}
|
||||
.main .title {
|
||||
font-size: 48rpx;
|
||||
font-weight: 500;
|
||||
color: #000;
|
||||
margin: 73rpx auto 48rpx;
|
||||
}
|
||||
.main .txt {
|
||||
font-size: 26rpx;
|
||||
font-weight: 500;
|
||||
color: #666;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
.main .avatar_box {
|
||||
position: relative;
|
||||
width: max-content;
|
||||
margin: 78rpx auto 59rpx;
|
||||
}
|
||||
.main .avatar_box .avatar {
|
||||
width: 147rpx;
|
||||
height: 147rpx;
|
||||
border-radius: 50%;
|
||||
margin: 0 auto 13rpx;
|
||||
}
|
||||
.main .avatar_box .btn_avatar {
|
||||
background: transparent;
|
||||
}
|
||||
/* 去掉背景色和内外边距 */
|
||||
button {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: inherit;
|
||||
position: static;
|
||||
}
|
||||
button:after {
|
||||
content: none;
|
||||
}
|
||||
/* 去掉边框 */
|
||||
button::after {
|
||||
border: none;
|
||||
}
|
||||
.main .avatar_box .btn_avatar::after {
|
||||
border: none;
|
||||
background: transparent;
|
||||
}
|
||||
.form {
|
||||
width: 690rpx;
|
||||
text-align: left;
|
||||
margin: 0 30rpx 0;
|
||||
}
|
||||
.form .form_item {
|
||||
position: relative;
|
||||
margin-bottom: 35rpx;
|
||||
}
|
||||
.form_item .arrow {
|
||||
position: absolute;
|
||||
bottom: 30rpx;
|
||||
right: 51rpx;
|
||||
width: 30rpx;
|
||||
height: 20rpx;
|
||||
}
|
||||
.form .form_item .label {
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
color: #030000;
|
||||
margin-bottom: 28rpx;
|
||||
}
|
||||
.form .form_item .label::after {
|
||||
content: "*";
|
||||
color: #eb5858;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.form .form_item .ipt {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
background: #ffffff;
|
||||
border: 1px solid #dddddd;
|
||||
border-radius: 3rpx;
|
||||
padding-left: 28rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
z-index: 99;
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
width: 100%;
|
||||
height: 153rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx -3rpx 7rpx 1rpx rgba(173, 191, 207, 0.21);
|
||||
}
|
||||
.btn {
|
||||
width: 540rpx;
|
||||
height: 90rpx;
|
||||
background: #000;
|
||||
border-radius: 45rpx;
|
||||
color: #fff;
|
||||
line-height: 90rpx;
|
||||
text-align: center;
|
||||
margin: 21rpx 49rpx 42rpx 30rpx;
|
||||
}
|
||||
.text {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #000;
|
||||
}
|
||||
.btn-disable {
|
||||
background-color: #ccc !important;
|
||||
/* 设置按钮背景颜色为灰色 */
|
||||
color: #fff !important;
|
||||
/* 设置按钮文字颜色为白色 */
|
||||
border-color: #ccc !important;
|
||||
/* 设置按钮边框颜色为灰色 */
|
||||
}
|
||||
@ -0,0 +1,181 @@
|
||||
page {
|
||||
background: #f8f8f8;
|
||||
}
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.infobox1 {
|
||||
margin: 30rpx;
|
||||
border-radius: 30rpx;
|
||||
/*box-shadow: 0px 1px 8px #E5E5E5;*/
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx 34rpx;
|
||||
background: #fff;
|
||||
}
|
||||
/* 去掉背景色和内外边距 */
|
||||
button {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: inherit;
|
||||
position: static;
|
||||
}
|
||||
button:after {
|
||||
content: none;
|
||||
}
|
||||
/* 去掉边框 */
|
||||
button::after {
|
||||
border: none;
|
||||
}
|
||||
.infobox1 .avatar_box {
|
||||
width: max-content;
|
||||
}
|
||||
.infobox1 .avatar_box .headimg {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.nickname {
|
||||
margin-left: 32rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #000000;
|
||||
}
|
||||
.infobox2 {
|
||||
margin: 30rpx;
|
||||
border-radius: 30rpx;
|
||||
/*box-shadow: 0px 1px 8px #E5E5E5;*/
|
||||
background: #fff;
|
||||
}
|
||||
.infobox2 > .title {
|
||||
padding: 39rpx 34rpx 62rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #000000;
|
||||
line-height: 1;
|
||||
}
|
||||
.infobox2 > .block_list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 34rpx 60rpx;
|
||||
font-size: 28rpx;
|
||||
color: #000000;
|
||||
font-weight: 500;
|
||||
}
|
||||
.infobox2 > .block_list > .label {
|
||||
/*color: #3D3E3E;*/
|
||||
}
|
||||
.infobox2 > .block_list > .label > text {
|
||||
color: #eb5858;
|
||||
margin-left: 6rpx;
|
||||
}
|
||||
.infobox2 > .block_list > .value {
|
||||
margin-left: 45rpx;
|
||||
/*color: #666666;*/
|
||||
position: relative;
|
||||
}
|
||||
.infobox2 > .block_list > .getmobile {
|
||||
background: #d3bc8d;
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
padding: 14rpx 28rpx;
|
||||
border-radius: 30rpx;
|
||||
margin-left: 50rpx;
|
||||
position: relative;
|
||||
}
|
||||
.infobox2 > .block_list > .getmobile > .mobilebtn {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 99;
|
||||
opacity: 0;
|
||||
}
|
||||
.infobox3 {
|
||||
margin: 30rpx;
|
||||
border-radius: 30rpx;
|
||||
/*box-shadow: 0px 1px 8px #E5E5E5;*/
|
||||
background: #fff;
|
||||
}
|
||||
.infobox3 > .title {
|
||||
padding: 39rpx 33rpx 62rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #000000;
|
||||
line-height: 1;
|
||||
}
|
||||
.infobox3 > .block_list {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 30rpx 35rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.infobox3 > .block_list > .label {
|
||||
color: #030000;
|
||||
}
|
||||
.infobox3 > .block_list > .label > text {
|
||||
color: #eb5858;
|
||||
margin-left: 6rpx;
|
||||
}
|
||||
.infobox3 > .block_list > .value {
|
||||
color: #000000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
.infobox3 > .block_list > .value > .picker {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 99;
|
||||
opacity: 0;
|
||||
}
|
||||
.infobox3 > .block_list > .value > .input input {
|
||||
text-align: right;
|
||||
}
|
||||
.infobox3 > .block_list > .value > .righticon {
|
||||
width: 10rpx;
|
||||
height: 20rpx;
|
||||
margin-left: 22rpx;
|
||||
}
|
||||
.submitbtn {
|
||||
position: absolute;
|
||||
bottom: 100rpx;
|
||||
width: 400rpx;
|
||||
left: 50%;
|
||||
margin-left: -200rpx;
|
||||
}
|
||||
.btn_box {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 153rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx -3rpx 7rpx 1rpx rgba(173, 191, 207, 0.21);
|
||||
padding-bottom: 21rpx;
|
||||
}
|
||||
.btn_box .btn {
|
||||
width: 690rpx;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
background: #000000;
|
||||
border-radius: 45rpx;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
}
|
||||
.btn_box .btn-disable {
|
||||
background-color: #ccc !important;
|
||||
/* 设置按钮背景颜色为灰色 */
|
||||
color: #fff !important;
|
||||
/* 设置按钮文字颜色为白色 */
|
||||
border-color: #ccc !important;
|
||||
/* 设置按钮边框颜色为灰色 */
|
||||
}
|
||||
Loading…
Reference in New Issue