web: Allow customize start button

This commit is contained in:
Fam Zheng 2025-08-17 12:24:08 +01:00
parent 69726802bf
commit aa670811e8
2 changed files with 42 additions and 1 deletions

View File

@ -19,7 +19,7 @@
</div> </div>
</div> </div>
</div> </div>
<button class="scan">开始扫码</button> <button class="scan section" @click="click_section('scan_button')" :style="scan_button_style">{{ scan_button_text }}</button>
</div> </div>
<div class="bottom"> <div class="bottom">
<div class="static section" @click="click_section('static')"> <div class="static section" @click="click_section('static')">
@ -59,6 +59,21 @@ export default {
} }
return ret; return ret;
}, },
scan_button_text: function() {
return this.data && this.data.scan_button ? this.data.scan_button.text : '开始扫码';
},
scan_button_style: function() {
var ret = {};
if (this.data && this.data.scan_button) {
if (this.data.scan_button.color) {
ret.backgroundColor = this.data.scan_button.color;
}
if (this.data.scan_button.text_color) {
ret.color = this.data.scan_button.text_color;
}
}
return ret;
},
}, },
methods: { methods: {
click_section: function (section) { click_section: function (section) {

View File

@ -16,6 +16,7 @@
<button class="btn btn-secondary edit-bg" @click="update_editing('carousel')">修改轮播图片</button> <button class="btn btn-secondary edit-bg" @click="update_editing('carousel')">修改轮播图片</button>
<button class="btn btn-secondary edit-bg" @click="update_editing('video')">修改视频</button> <button class="btn btn-secondary edit-bg" @click="update_editing('video')">修改视频</button>
<button class="btn btn-secondary edit-bg" @click="update_editing('icons')">修改图标链接</button> <button class="btn btn-secondary edit-bg" @click="update_editing('icons')">修改图标链接</button>
<button class="btn btn-secondary edit-bg" @click="update_editing('scan_button')">修改扫码按钮</button>
<button class="btn btn-secondary edit-bg" @click="update_editing('static')">修改底部静态图片</button> <button class="btn btn-secondary edit-bg" @click="update_editing('static')">修改底部静态图片</button>
<button class="btn btn-secondary edit-bg" @click="update_editing('background')">修改背景</button> <button class="btn btn-secondary edit-bg" @click="update_editing('background')">修改背景</button>
<hr> <hr>
@ -73,6 +74,26 @@
</div> </div>
<button class="btn btn-secondary return" @click="editing=null">返回</button> <button class="btn btn-secondary return" @click="editing=null">返回</button>
</div> </div>
<div v-if="editing=='scan_button'">
<h5>扫码按钮</h5>
<div class="alert alert-secondary">
按钮文字
<input class="form-control my-1" type="text" v-model="data.scan_button.text" placeholder="开始扫码" />
</div>
<div class="alert alert-secondary">
按钮颜色
<input class="form-control my-1" type="color" v-model="data.scan_button.color" />
RGB
<input class="form-control my-1" type="text" v-model="data.scan_button.color" />
</div>
<div class="alert alert-secondary">
按钮文字颜色
<input class="form-control my-1" type="color" v-model="data.scan_button.text_color" />
RGB
<input class="form-control my-1" type="text" v-model="data.scan_button.text_color" />
</div>
<button class="btn btn-secondary return" @click="editing=null">返回</button>
</div>
<div v-if="editing=='static'"> <div v-if="editing=='static'">
<h5> 图片展示 </h5> <h5> 图片展示 </h5>
<ImageLinks @update="set_static" :items="data.static" /> <ImageLinks @update="set_static" :items="data.static" />
@ -188,6 +209,11 @@ export default {
d.icons ||= []; d.icons ||= [];
d.icons_per_line ||= 3; d.icons_per_line ||= 3;
d.static ||= []; d.static ||= [];
d.scan_button ||= {
text: '开始扫码',
color: '#008000',
text_color: '#ffffff',
};
var white = '#ffffff'; var white = '#ffffff';
d.background ||= { d.background ||= {
type: 'none', type: 'none',