675 lines
19 KiB
Vue
675 lines
19 KiB
Vue
<template>
|
||
<view class="container">
|
||
<view class="tab-container">
|
||
<view :class="['tab', { active: activeTab === 'register' }]" @tap="activeTab = 'register'">創建錢包</view>
|
||
<view :class="['tab', { active: activeTab === 'login' }]" @tap="activeTab = 'login'">導入錢包</view>
|
||
</view>
|
||
<!-- 創建錢包 -->
|
||
<view v-if="activeTab === 'register'" class="content">
|
||
<view class="input">
|
||
<input v-model="mobile" type="text" placeholder="用戶名" class="input_aa" style="width: 100%;"/>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="password" :password="showPassword1" data="passworedtype" placeholder="設置登錄密碼"
|
||
class="input_aa" />
|
||
<img :src="!showPassword1 ? showpwdImg : hidepwdImg" @tap="changePassword(1)"
|
||
style="width: 50rpx;height: 50rpx;"></img>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="password1" :password="showPassword2" placeholder="確認登錄密碼" class="input_aa" />
|
||
<img :src="!showPassword2 ? showpwdImg : hidepwdImg" @tap="changePassword(2)"
|
||
style="width: 50rpx;height: 50rpx;"></img>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="paykey" :password="showPassword3" placeholder="設置支付密碼" class="input_aa" />
|
||
<img :src="!showPassword3 ? showpwdImg : hidepwdImg" @tap="changePassword(3)"
|
||
style="width: 50rpx;height: 50rpx;"></img>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="paykey1" :password="showPassword4" placeholder="確認支付密碼" class="input_aa" />
|
||
<img :src="!showPassword4 ? showpwdImg : hidepwdImg" @tap="changePassword(4)"
|
||
style="width: 50rpx;height: 50rpx;"></img>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="email" type="text" placeholder="登錄郵箱" class="input_aa" />
|
||
</view>
|
||
<!-- 验证码 -->
|
||
<view class="input">
|
||
<input v-model="code" placeholder="郵箱驗證碼" class="input_aa" />
|
||
<view class="sendcode" @click="tosendemail">{{emaiTip}}</view>
|
||
</view>
|
||
<!-- 谷歌验证码 -->
|
||
<view class="input">
|
||
<input v-model="googlecode" placeholder="穀歌驗證碼" class="input_aa" />
|
||
<view class="sendcode" @click="googleemail">{{googleTip}}</view>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="pwallet" :disabled="codeIsLen" type="text" placeholder="好友地址" style="width: 100%;"/>
|
||
</view>
|
||
|
||
<button @tap="produceMnemonic" class="btn primary">生成助記詞</button>
|
||
</view>
|
||
<!-- 導入錢包 -->
|
||
<view v-if="activeTab === 'login'" class="content">
|
||
<textarea v-model="inputMnemonic" placeholder="請輸入您的助記詞" :maxlength="-1" class="input textarea" />
|
||
<view class="input">
|
||
<input v-model="mmobile" type="text" placeholder="用户名" style="width: 100%;"/>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="mpassword" :password="showPassword5" placeholder="設置登錄密碼" class="input_aa" />
|
||
<img :src="!showPassword5 ? showpwdImg : hidepwdImg" @tap="changePassword(5)"
|
||
style="width: 50rpx;height: 50rpx;"></img>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="mpassword1" :password="showPassword6" placeholder="確認登錄密碼" class="input_aa" />
|
||
<img :src="!showPassword6 ? showpwdImg : hidepwdImg" @tap="changePassword(6)"
|
||
style="width: 50rpx;height: 50rpx;"></img>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="mpaykey" :password="showPassword7" placeholder="請輸入支付密碼" class="input_aa" />
|
||
<img :src="!showPassword7 ? showpwdImg : hidepwdImg" @tap="changePassword(7)"
|
||
style="width: 50rpx;height: 50rpx;"></img>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="mpaykey1" :password="showPassword8" placeholder="請確定支付密碼" class="input_aa" />
|
||
<img :src="!showPassword8 ? showpwdImg : hidepwdImg" @tap="changePassword(8)"
|
||
style="width: 50rpx;height: 50rpx;"></img>
|
||
</view>
|
||
<view class="input">
|
||
<input v-model="memail" type="text" placeholder="登錄郵箱" style="width: 100%;"/>
|
||
</view>
|
||
<!-- 验证码 -->
|
||
<view class="input">
|
||
<input v-model="code" data="passworedtype" placeholder="郵箱驗證碼" class="input_aa" />
|
||
<view class="sendcode" @click="tosendemail">{{emaiTip}}</view>
|
||
</view>
|
||
<!-- 谷歌验证码 -->
|
||
<view class="input">
|
||
<input v-model="googlecode" data="passworedtype" placeholder="穀歌驗證碼" class="input_aa" />
|
||
<view class="sendcode" @click="googleemail">{{googleTip}}</view>
|
||
</view>
|
||
<button @tap="importWallet" class="btn primary">導入錢包</button>
|
||
</view>
|
||
<view class="googlecode" v-if="googleDialog">
|
||
<view class="icon" @click="googleDialog = false">
|
||
<u-icon name="close"></u-icon>
|
||
</view>
|
||
<view class="googletitle">
|
||
掃一掃獲取穀歌驗證碼
|
||
</view>
|
||
<view class="googleimg">
|
||
<image :src="googleimg"></image>
|
||
</view>
|
||
<view class="googlesecret" @click="copyadd()">
|
||
{{googlesecret}}
|
||
</view>
|
||
</view>
|
||
<!-- 助記詞彈窗 -->
|
||
<view v-if="mnemonic" class="mnemonic-container">
|
||
<text class="mnemonic" @tap="copyMnemonic">{{ mnemonic }}</text>
|
||
<text class="copy-hint">(點擊複製)</text>
|
||
<text class="warning">請妥善保管您的助記詞和密碼,切勿洩露給他人!</text>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {_zhujiLogin,_register,_zhuji,_addresslogin,_emailSend,_getgoogleauthurl} from "@/request/api.js"
|
||
const bip39 = require('bip39');
|
||
const crypto = require('crypto');
|
||
const NodeRSA = require('node-rsa');
|
||
import DB from "@/common/sqlite";
|
||
import { getAddressAndPrivateKey } from "@/common/proAdress.js";
|
||
export default {
|
||
data() {
|
||
return {
|
||
userIsRegister:false,
|
||
googleimg: "",
|
||
googlesecret: "",
|
||
googleDialog: false,
|
||
emaiTip: "發送",
|
||
googleTip: "發送",
|
||
showPassword1:true,
|
||
showPassword2:true,
|
||
showPassword3:true,
|
||
showPassword4:true,
|
||
showPassword5:true,
|
||
showPassword6:true,
|
||
showPassword7:true,
|
||
showPassword8:true,
|
||
showpwdImg:"static/icon/eye_on.png",
|
||
hidepwdImg:"static/icon/eye_off.png",
|
||
mobile:"",
|
||
password: "",
|
||
password1:"",
|
||
paykey:"",
|
||
paykey1:"",
|
||
email: "",
|
||
memail: "",
|
||
code:"",
|
||
googlecode: "",
|
||
pid:"",
|
||
pwallet:"",
|
||
codeIsLen:false,
|
||
activeTab: 'register',
|
||
mnemonic: '',
|
||
privateKey:"",
|
||
confirmPassword: '',
|
||
inputMnemonic: '',//助記詞
|
||
mmobile:"",
|
||
mpassword: "",
|
||
mpassword1:"",
|
||
mpaykey:"",
|
||
mpaykey1:"",
|
||
provider:null,
|
||
}
|
||
},
|
||
onLoad(e) {
|
||
if(e.pwallet){
|
||
this.pwallet = e.pwallet;
|
||
this.codeIsLen = true;
|
||
}
|
||
},
|
||
watch:{
|
||
memail:{
|
||
handler(val){
|
||
this.userIsRegister = false;
|
||
},
|
||
immediate:true,
|
||
deep:true
|
||
},
|
||
},
|
||
methods: {
|
||
copyadd() {
|
||
uni.setClipboardData({
|
||
data: this.googlesecret,
|
||
success: () => {
|
||
uni.showToast({
|
||
title: '複製成功',
|
||
icon: 'success'
|
||
})
|
||
}
|
||
})
|
||
},
|
||
async tosendemail() {
|
||
if (this.emaiTip == "發送") {
|
||
let num = 60;
|
||
let emaiTimer = setInterval(() => {
|
||
this.emaiTip = num + 's';
|
||
num--;
|
||
if (num < 0) {
|
||
this.emaiTip = "發送";
|
||
clearInterval(emaiTimer)
|
||
}
|
||
}, 1000)
|
||
let res = await _emailSend({
|
||
email: this.activeTab == "register" ? this.email : this.memail,
|
||
event: "register"
|
||
});
|
||
if (res.code === 1) {
|
||
uni.showToast({
|
||
title: '發送成功',
|
||
icon: 'none'
|
||
});
|
||
}else{
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
});
|
||
this.userIsRegister = true;
|
||
}
|
||
} else {
|
||
return
|
||
}
|
||
},
|
||
async googleemail() {
|
||
if(!this.code || this.emaiTip == "發送"){
|
||
uni.showToast({
|
||
title: '請先寄送並輸入郵箱驗證碼',
|
||
icon: 'none'
|
||
});
|
||
return
|
||
}
|
||
if (this.googleTip == "發送") {
|
||
let num = 60;
|
||
let googleTimer = setInterval(() => {
|
||
this.googleTip = num + 's';
|
||
num--;
|
||
if (num < 0) {
|
||
this.googleTip = "發送";
|
||
clearInterval(googleTimer)
|
||
}
|
||
}, 1000)
|
||
if(this.userIsRegister) return
|
||
let res = await _getgoogleauthurl({
|
||
email: this.activeTab == "register" ? this.email : this.memail
|
||
});
|
||
if (res.code === 1) {
|
||
uni.showToast({
|
||
title: '發送成功',
|
||
icon: 'none'
|
||
});
|
||
this.googleDialog = true;
|
||
this.googleimg = res.data.url;
|
||
this.googlesecret = res.data.secret;
|
||
}else{
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
});
|
||
}
|
||
} else {
|
||
return
|
||
}
|
||
},
|
||
changePassword(n){
|
||
switch(n){
|
||
case 1 :
|
||
this.showPassword1 = !this.showPassword1;
|
||
break;
|
||
case 2 :
|
||
this.showPassword2 = !this.showPassword2;
|
||
break;
|
||
case 3 :
|
||
this.showPassword3 = !this.showPassword3;
|
||
break;
|
||
case 4 :
|
||
this.showPassword4 = !this.showPassword4;
|
||
break;
|
||
case 5 :
|
||
this.showPassword5 = !this.showPassword5;
|
||
break;
|
||
case 6 :
|
||
this.showPassword6 = !this.showPassword6;
|
||
break;
|
||
case 7 :
|
||
this.showPassword7 = !this.showPassword7;
|
||
break;
|
||
case 8 :
|
||
this.showPassword8 = !this.showPassword8;
|
||
break;
|
||
}
|
||
|
||
},
|
||
// 使用硬件随机数生成私钥 (模拟硬件随机生成,实际中可以使用硬件设备)
|
||
generatePrivateKey() {
|
||
const entropy = crypto.randomBytes(32); // 模拟硬件生成的随机数(32字节)
|
||
return entropy;
|
||
},
|
||
// 从私钥生成 BIP39 助记词(24 个词)
|
||
generateMnemonic() {
|
||
const privateKey = this.generatePrivateKey(); // 生成私钥
|
||
const mnemonic = bip39.entropyToMnemonic(privateKey); // 使用 BIP39 生成助记词
|
||
return mnemonic;
|
||
},
|
||
// 双重加密:AES + RSA 加密
|
||
encryptMnemonicWithAES(mnemonic, password) {
|
||
// 将密码通过 SHA-256 哈希函数变换为 32 字节的密钥
|
||
const key = crypto.createHash('sha256').update(password).digest();
|
||
// 创建一个随机的初始化向量(IV)
|
||
const iv = crypto.randomBytes(16); // AES-CBC 模式下需要 IV
|
||
// 使用 AES 加密助记词
|
||
const cipher = crypto.createCipheriv('aes-256-cbc', key, iv);
|
||
let encrypted = cipher.update(mnemonic, 'utf8', 'hex');
|
||
encrypted += cipher.final('hex');
|
||
|
||
// 使用 node-rsa 替代内置的 RSA 功能
|
||
const rsaKey = new NodeRSA({
|
||
b: 2048
|
||
});
|
||
const encryptedWithRSA = rsaKey.encrypt(encrypted, 'hex');
|
||
|
||
return {
|
||
rsaEncryptedMnemonic: encryptedWithRSA,
|
||
privateKey: rsaKey.exportKey('private'),
|
||
iv: iv.toString('hex'),
|
||
};
|
||
},
|
||
async produceMnemonic() {
|
||
DB.openSqlite();
|
||
let sql =
|
||
'"email" text,"password" text,"moneyAdress" text,"mnemonic" text,"privateKeyMne" text,"privateKeyPre" text,"privateKeyMoney" text,"mnemonicIV" text,"privateIV" text';
|
||
await DB.createTable('regUser', sql);
|
||
if (!this.mobile || !this.password || !this.password1 || this.password !== this.password1 || !this
|
||
.paykey || !this.paykey1 || this.paykey !== this.paykey1 || !this.email || !this.code || !this.googlecode) {
|
||
uni.showToast({
|
||
title: '請填寫正確資訊',
|
||
icon: 'none'
|
||
});
|
||
return;
|
||
}
|
||
uni.showLoading({
|
||
title: "註冊中..."
|
||
})
|
||
let _that = this;
|
||
// 生成私钥、助记词、并进行加密
|
||
const mnemonic = _that.generateMnemonic();
|
||
let userInfos = getAddressAndPrivateKey(mnemonic);
|
||
// 加密助记词(AES + RSA)
|
||
const password = _that.paykey; // 用于加密助记词的密码
|
||
const encryptedData = _that.encryptMnemonicWithAES(mnemonic, password);
|
||
const rsaEncryptedMnemonic = encryptedData.rsaEncryptedMnemonic;
|
||
const privateKeyMne = encryptedData.privateKey;
|
||
const mnemonicIV = encryptedData.iv;
|
||
// 加密私钥
|
||
const encryptedData1 = _that.encryptMnemonicWithAES(userInfos.privateKey, password);
|
||
const rsaMoneyPri = encryptedData1.rsaEncryptedMnemonic;
|
||
const privateKeyPre = encryptedData1.privateKey;
|
||
const privateIV = encryptedData1.iv;
|
||
|
||
const params = {
|
||
username: _that.mobile,
|
||
email: _that.email,
|
||
password: _that.password,
|
||
paykey: _that.paykey,
|
||
code: _that.code,
|
||
googlecode: _that.googlecode,
|
||
pid: _that.pid,
|
||
wallet: JSON.stringify({
|
||
address: userInfos.address
|
||
}),
|
||
mch: "",
|
||
pwallet: _that.pwallet
|
||
};
|
||
try {
|
||
let res = await _register(params);
|
||
if (res.code === 1) {
|
||
let spl =
|
||
`'${_that.email}','${_that.password}','${userInfos.address}','${rsaEncryptedMnemonic}','${privateKeyMne}','${privateKeyPre}','${rsaMoneyPri}','${mnemonicIV}','${privateIV}'`;
|
||
let condition =
|
||
"'email','password','moneyAdress','mnemonic','privateKeyMne','privateKeyPre','privateKeyMoney','mnemonicIV','privateIV'";
|
||
await DB.insertTableData(DB.regTable, spl, condition);
|
||
_that.mnemonic = mnemonic;
|
||
uni.showToast({
|
||
title: "註冊成功",
|
||
icon: 'none'
|
||
});
|
||
uni.hideLoading();
|
||
} else {
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
});
|
||
uni.hideLoading()
|
||
}
|
||
} catch (err) {
|
||
uni.showToast({
|
||
title: err,
|
||
icon: 'none'
|
||
});
|
||
uni.hideLoading()
|
||
}
|
||
|
||
},
|
||
async importWallet() {
|
||
DB.openSqlite();
|
||
let sql =
|
||
'"email" text,"password" text,"moneyAdress" text,"mnemonic" text,"privateKeyMne" text,"privateKeyPre" text,"privateKeyMoney" text,"mnemonicIV" text,"privateIV" text';
|
||
await DB.createTable('regUser', sql);
|
||
if (!this.inputMnemonic || !this.mmobile || !this.mpassword || !this.mpassword1 || !this.mpaykey || !
|
||
this.mpaykey1 || !this.memail || !this.code || !this.googlecode) {
|
||
uni.showToast({
|
||
title: '請填寫正確資訊',
|
||
icon: 'none'
|
||
});
|
||
return;
|
||
}
|
||
uni.showLoading({
|
||
title: "導入中..."
|
||
})
|
||
let _that = this;
|
||
let obj = getAddressAndPrivateKey(_that.inputMnemonic);
|
||
// 加密助记词(AES + RSA)
|
||
const password = _that.mpaykey1; // 用于加密助记词的密码
|
||
const encryptedData = _that.encryptMnemonicWithAES(_that.inputMnemonic, password);
|
||
const rsaEncryptedMnemonic = encryptedData.rsaEncryptedMnemonic;
|
||
const privateKeyMne = encryptedData.privateKey;
|
||
const mnemonicIV = encryptedData.iv;
|
||
// 加密私钥
|
||
const encryptedData1 = _that.encryptMnemonicWithAES(obj.privateKey, password);
|
||
const rsaMoneyPri = encryptedData1.rsaEncryptedMnemonic;
|
||
const privateKeyPre = encryptedData1.privateKey;
|
||
const privateIV = encryptedData1.iv;
|
||
let wallet = {
|
||
address: obj.address,
|
||
type: "Ethereum"
|
||
};
|
||
const params = {
|
||
username: _that.mmobile,
|
||
email: _that.memail,
|
||
password: _that.mpassword,
|
||
paykey: _that.mpaykey,
|
||
code: _that.code,
|
||
googlecode: _that.googlecode,
|
||
pid: _that.pid,
|
||
wallet: JSON.stringify(wallet),
|
||
mch: "",
|
||
pwallet: _that.pwallet
|
||
};
|
||
let resUser = await _addresslogin({
|
||
address: obj.address
|
||
});
|
||
if (resUser.code === 1) {
|
||
uni.hideLoading()
|
||
let inputObj = resUser.data.userinfo;
|
||
let spl =
|
||
`'${inputObj.email}','${inputObj.paykey}','${obj.address}','${rsaEncryptedMnemonic}','${privateKeyMne}','${privateKeyPre}','${rsaMoneyPri}','${mnemonicIV}','${privateIV}'`;
|
||
let condition =
|
||
"'email','password','moneyAdress','mnemonic','privateKeyMne','privateKeyPre','privateKeyMoney','mnemonicIV','privateIV'";
|
||
await DB.insertTableData(DB.regTable, spl, condition);
|
||
uni.showModal({
|
||
title: "提示",
|
||
content: "該助記詞已註冊是否跳轉登錄",
|
||
success(rss) {
|
||
if (rss.confirm) {
|
||
uni.navigateTo({
|
||
url: '/pages/login/login?email=' + inputObj.email + '&password=' + _that.mpassword
|
||
})
|
||
}
|
||
}
|
||
})
|
||
} else {
|
||
let resss = await _register(params);
|
||
if (resss.code === 1) {
|
||
uni.hideLoading()
|
||
let user_id = resss.data.userinfo.id;
|
||
let spl =
|
||
`'${_that.memail}','${_that.mpaykey}','${obj.address}','${rsaEncryptedMnemonic}','${privateKeyMne}','${privateKeyPre}','${rsaMoneyPri}','${mnemonicIV}','${privateIV}'`;
|
||
let condition =
|
||
"'email','password','moneyAdress','mnemonic','privateKeyMne','privateKeyPre','privateKeyMoney','mnemonicIV','privateIV'";
|
||
await DB.insertTableData(DB.regTable, spl, condition);
|
||
uni.navigateTo({
|
||
url: '/pages/login/login?email=' + _that.memail + '&password=' + _that.mpassword
|
||
})
|
||
} else {
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
title: resss.msg,
|
||
icon: 'none'
|
||
});
|
||
}
|
||
}
|
||
},
|
||
beginLogon() {
|
||
if (this.codeIsLen) {
|
||
window.location.href = "https://onlif.klinygm.com/release/"
|
||
} else {
|
||
uni.navigateTo({
|
||
url: '/pages/login/login?email=' + this.email + '&password=' + this.password
|
||
})
|
||
}
|
||
},
|
||
copyMnemonic() {
|
||
let _that = this;
|
||
let titleMessage = "";
|
||
if (_that.codeIsLen) {
|
||
titleMessage = "是否下載登錄?"
|
||
} else {
|
||
titleMessage = "是否跳轉登錄?"
|
||
}
|
||
uni.setClipboardData({
|
||
data: _that.mnemonic,
|
||
success: () => {
|
||
uni.showModal({
|
||
title: "助記詞已複製",
|
||
content: titleMessage,
|
||
success(res) {
|
||
if (res.confirm) {
|
||
_that.beginLogon();
|
||
}
|
||
}
|
||
})
|
||
}
|
||
});
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.container {
|
||
padding: 20px;
|
||
background: linear-gradient(to bottom, #000033, #51599b);
|
||
min-height: 100vh;
|
||
position: relative;
|
||
}
|
||
|
||
.sendcode {
|
||
text-align: right;
|
||
width: 20%;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.tab-container {
|
||
display: flex;
|
||
background-color: rgba(255, 255, 255, 0.1);
|
||
border-radius: 8px;
|
||
overflow: hidden;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.tab {
|
||
flex: 1;
|
||
text-align: center;
|
||
padding: 15px 0;
|
||
font-size: 16px;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.tab.active {
|
||
background-color: rgba(0, 122, 255, 0.6);
|
||
color: white;
|
||
}
|
||
|
||
.content {
|
||
background-color: rgba(255, 255, 255, 0.1);
|
||
border-radius: 8px;
|
||
padding: 20px;
|
||
}
|
||
|
||
.btn {
|
||
width: 100%;
|
||
height: 50px;
|
||
line-height: 50px;
|
||
text-align: center;
|
||
border-radius: 25px;
|
||
font-size: 18px;
|
||
margin-top: 20px;
|
||
}
|
||
|
||
.btn.primary {
|
||
background-color: rgba(0, 122, 255, 0.8);
|
||
color: white;
|
||
}
|
||
|
||
.mnemonic-container {
|
||
width: 60%;
|
||
background-color: #fff;
|
||
padding: 15px;
|
||
border-radius: 8px;
|
||
position: fixed;
|
||
top: 50%;
|
||
left: 50%;
|
||
transform: translate(-50%,-50%);
|
||
}
|
||
|
||
.mnemonic {
|
||
font-size: 16px;
|
||
line-height: 1.5;
|
||
word-break: break-all;
|
||
color: #000;
|
||
}
|
||
|
||
.copy-hint {
|
||
font-size: 12px;
|
||
color: #aaaaaa;
|
||
margin-left: 5px;
|
||
}
|
||
|
||
.warning {
|
||
color: #ff9900;
|
||
font-size: 14px;
|
||
margin-top: 10px;
|
||
display: block;
|
||
}
|
||
|
||
.input {
|
||
width: 95%;
|
||
height: 60px;
|
||
border: 1px solid rgba(221, 221, 221, 0.3);
|
||
border-radius: 8px;
|
||
padding: 0 10px;
|
||
/* box-sizing: border-box; */
|
||
font-size: 16px;
|
||
margin-bottom: 10px;
|
||
background-color: rgba(255, 255, 255, 0.1);
|
||
color: #ffffff;
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
.input_aa{
|
||
width: 90%;
|
||
font-size: 16px;
|
||
height: 60%;
|
||
}
|
||
.input.textarea {
|
||
height: 100px;
|
||
padding-top: 20rpx;
|
||
}
|
||
|
||
.input::placeholder {
|
||
color: rgba(255, 255, 255, 0.5);
|
||
}
|
||
.googlecode {
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
flex-direction: column;
|
||
width: 70vw;
|
||
height: 70vw;
|
||
background-color: #fff;
|
||
position: fixed;
|
||
left: 50%;
|
||
top: 50%;
|
||
transform: translate(-50%, -50%);
|
||
|
||
.icon {
|
||
width: 90%;
|
||
display: flex;
|
||
justify-content: end;
|
||
}
|
||
|
||
.googleimg {
|
||
width: 50vw;
|
||
height: 50vw;
|
||
padding: 20rpx;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
}
|
||
</style> |