<!-- 关于我们组件 -->
|
<template>
|
<view class="m-form">
|
<view class="m-page-over">
|
<!-- <view class="m-form-head"><u-icon name="close-circle" color="#fff" size="40" @click="cancel"></u-icon></view> -->
|
<!-- 修改 -->
|
<view class="m-form-label">
|
<u--form
|
labelPosition="left"
|
labelAlign="left"
|
:model="model"
|
ref="form"
|
labelWidth="100"
|
:labelStyle="{ color: '#459EFF', 'white-space': 'nowrap', 'letter-spacing': '0.65em' }"
|
>
|
<u-form-item label="名称" prop="app_name" borderBottom ref="item">
|
<u--input
|
:customStyle="{
|
'background-color': '#459EFF'
|
}"
|
placeholderStyle="color:#fff"
|
color="#fff"
|
v-model="model.app_name"
|
border="none"
|
></u--input>
|
</u-form-item>
|
<u-form-item label="LOGO" prop="logo_name" borderBottom ref="item" @click="chooseImage">
|
<u--input
|
readonly
|
:customStyle="{
|
'background-color': '#459EFF',
|
}"
|
placeholderStyle="color:#fff"
|
color="#fff"
|
v-model="model.logo_name"
|
border="none"
|
></u--input>
|
</u-form-item>
|
<u-form-item label="版本" prop="banben" borderBottom ref="item">
|
<u--input
|
readonly
|
:customStyle="{
|
'background-color': '#459EFF',
|
}"
|
placeholderStyle="color:#fff"
|
color="#fff"
|
v-model="model.banben"
|
border="none"
|
></u--input>
|
</u-form-item>
|
</u--form>
|
</view>
|
<view class="m-form-button-list"><u-button type="primary" text="确定" @click="save"></u-button></view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import { chooseImage, saveFile} from '@/common/utils.js';
|
export default {
|
props: {},
|
data() {
|
return {
|
model: {
|
logo_name: '', //logo
|
app_name: '' ,//软件名称
|
banben:''
|
},
|
img_url:''
|
};
|
},
|
methods: {
|
//保存
|
save() {
|
//修改关于我们信息
|
saveFile(this.img_url).then(res=>{
|
console.log(res)
|
uni.setStorageSync("about_info",{logo_name:this.model.logo_name,app_name:this.model.app_name,img_url:res.savedFilePath})
|
this.$emit('submitAboutUsForm');
|
})
|
},
|
//取消
|
cancel() {
|
this.$emit('cancelAboutUsForm');
|
},
|
//获取关于我们信息
|
getInfo() {
|
var info = uni.getStorageSync('about_info');
|
if(!info){
|
this.model.app_name='智能围栏'
|
return
|
}
|
if(info.app_name)
|
this.model.app_name = info.app_name;
|
if(info.img_url)
|
this.img_url=info.img_url
|
if(info.logo_name)
|
this.model.logo_name=info.logo_name
|
},
|
chooseImage() {
|
chooseImage().then(res => {
|
console.log(res);
|
this.model.logo_name = res.name;
|
this.img_url=res.tempFiles[0].path
|
});
|
}
|
},
|
mounted() {
|
this.getInfo();
|
this.model.banben='V'+plus.runtime.version
|
}
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.m-form {
|
position: fixed;
|
top: calc(3.5em + 20px);
|
left: 0;
|
background-color: rgba(255, 255, 255, 0.9);
|
width: 100%;
|
height: calc(100vh - 3.5em - 20px - 60px);
|
overflow: scroll;
|
z-index: 750;
|
// border-radius: 15px;
|
box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.16);
|
display: flex;
|
flex-direction: column;
|
}
|
.m-page-over {
|
width: calc(100vw - 8em - 1px);
|
height: 100%;
|
position: absolute;
|
left: 0;
|
top: 0;
|
border-right: 1px solid #63aff9;
|
}
|
.m-form-head {
|
width: 100%;
|
border-bottom: 1px solid #fff;
|
}
|
.m-form-head .u-icon {
|
float: right;
|
}
|
// /deep/ .u-form-item:nth-of-type(3) .u-form-item__body__left__content__label,
|
// /deep/ .u-form-item:nth-of-type(4) .u-form-item__body__left__content__label,
|
// /deep/ .u-form-item:nth-of-type(5) .u-form-item__body__left__content__label,
|
// /deep/ .u-form-item:nth-of-type(6) .u-form-item__body__left__content__label {
|
// letter-spacing: 0 !important;
|
// }
|
.m-form-label {
|
width: 80%;
|
margin: 0 auto;
|
margin-bottom: 0.5em;
|
overflow: overlay;
|
}
|
input {
|
width: 50px;
|
}
|
.m-form-button-list {
|
width: 100%;
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
margin-bottom: 1em;
|
}
|
.m-form-button-list .u-button {
|
width: 5em;
|
}
|
.m-form-button-list .u-button:nth-child(2),
|
.m-form-button-list .u-button:nth-child(3),
|
.m-form-button-list .u-button:nth-child(4) {
|
margin-top: 2em;
|
}
|
</style>
|
