修改switch、checkbox组件

This commit is contained in:
TOP糯米 2023-02-14 11:46:25 +08:00
parent 757f72328d
commit f76987a18e
4 changed files with 22 additions and 50 deletions

View File

@ -1,6 +1,6 @@
<template>
<view class="agreement">
<widget-check-box :checked="defaultState" @change="change" />
<widget-check-box :checked="agree" />
<view class="description">
<text class="text">我已阅读并同意</text>
<text class="link">熊熊安装服务协议</text>
@ -17,7 +17,7 @@ export default {
return {};
},
props: {
defaultState: {
agree: {
type: Boolean,
default: false,
},
@ -28,11 +28,7 @@ export default {
created() {},
mounted() {},
destroyed() {},
methods: {
change(state) {
this.$emit("agree", state);
},
},
methods: {},
};
</script>

View File

@ -1,12 +1,11 @@
<template>
<view
class="checkbox"
:class="[state ? 'active' : '']"
:class="[checked ? 'active' : '']"
:style="{ fontSize: $utils.rpx2px(size) + 'px' }"
@click="changeCheckBox"
>
<text v-if="state" class="iconfont icon-xuanzeyixuanze"></text>
<text v-if="!state" class="iconfont icon-xuanzeweixuanze"></text>
<text v-if="checked" class="iconfont icon-xuanzeyixuanze"></text>
<text v-if="!checked" class="iconfont icon-xuanzeweixuanze"></text>
</view>
</template>
@ -14,9 +13,7 @@
export default {
name: "widget-checkbox",
data() {
return {
state: false,
};
return {};
},
props: {
size: {
@ -29,17 +26,10 @@ export default {
},
},
components: {},
created() {
this.state = this.checked;
},
created() {},
mounted() {},
destroyed() {},
methods: {
changeCheckBox() {
this.state = !this.state;
this.$emit("change", this.state);
},
},
methods: {},
};
</script>

View File

@ -1,12 +1,11 @@
<template>
<view
class="switch"
:class="[state ? 'active' : '']"
:class="[open ? 'active' : '']"
:style="{ fontSize: $utils.rpx2px(size) + 'px' }"
@click="changeSwitch"
>
<text v-if="!state" class="iconfont icon-kaiguan-guan"></text>
<text v-if="state" class="iconfont icon-kaiguan-kai"></text>
<text v-if="!open" class="iconfont icon-kaiguan-guan"></text>
<text v-if="open" class="iconfont icon-kaiguan-kai"></text>
</view>
</template>
@ -14,9 +13,7 @@
export default {
name: "widget-switch",
data() {
return {
state: false,
};
return {};
},
props: {
size: {
@ -29,17 +26,10 @@ export default {
},
},
components: {},
created() {
this.state = this.open;
},
created() {},
mounted() {},
destroyed() {},
methods: {
changeSwitch() {
this.state = !this.state;
this.$emit("change", this.state);
},
},
methods: {},
};
</script>

View File

@ -53,7 +53,9 @@
</view>
<view class="switch-container">
<text class="price">¥ 6.00</text>
<widget-switch @change="changeInsurance" />
<text @click="insurance = !insurance">
<widget-switch :open="insurance" />
</text>
</view>
</view>
<view class="demand">
@ -66,7 +68,9 @@
/>
</view>
<view class="agreement-container">
<agreement @agree="agree" />
<text @click="isAgree = !isAgree">
<agreement :agree="isAgree" />
</text>
</view>
</view>
<view
@ -94,8 +98,8 @@ export default {
addressId: 0,
addressText: "",
datetime: "",
insurance: false,
message: "",
insurance: false,
isAgree: false,
serviceList: [
{
@ -154,14 +158,6 @@ export default {
showCancel: false,
});
},
changeInsurance(state) {
this.insurance = state;
console.log(this.insurance);
},
agree(state) {
this.isAgree = state;
console.log(this.isAgree);
},
pay() {
if (!this.isAgree) {
uni.showToast({