46 lines
1.4 KiB
Vue
46 lines
1.4 KiB
Vue
<template>
|
|
<switch :checked="flag" :disabled="disabled" color="#238FFC" :style="{ transform: 'scale(' + scale + ')', margin: margin }" @change="change" @tap="emits('click')" />
|
|
<JeepayPopupConfirm ref="jeepayPopupConfirmRef" />
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, watchEffect } from 'vue'
|
|
const props = defineProps({
|
|
scale: { type: Number, default: 0.8 }, //控制开关大小 倍数 默认.8
|
|
margin: { type: String, default: '0' }, // 控制开关外边距默认0
|
|
tips: { type: String }, //修改提示语不传使用 默认tips弹出层提示语
|
|
bol: { type: Boolean }, //开关状态
|
|
index: { type: Number, default: 0 }, // 列表渲染索引值
|
|
confirmTips: { type: Boolean, default: true }, //是否需要提示弹窗默认 需要
|
|
disabled: { type: Boolean, default: false }, // 是否禁用 默认否
|
|
})
|
|
const emits = defineEmits(['confirm', 'cancel', 'click'])
|
|
const flag = ref()
|
|
|
|
watchEffect(() => {
|
|
flag.value = props.bol
|
|
})
|
|
|
|
const jeepayPopupConfirmRef = ref() //提示弹窗
|
|
|
|
const change = (e) => {
|
|
flag.value = e.detail.value
|
|
if (!props.confirmTips) return confirm()
|
|
jeepayPopupConfirmRef.value
|
|
.open(props.tips || '确定修改状态？')
|
|
.then(() => {
|
|
confirm()
|
|
})
|
|
.catch(() => {
|
|
flag.value = !flag.value
|
|
emits('cancel', flag.value)
|
|
})
|
|
}
|
|
|
|
const confirm = () => {
|
|
emits('confirm', flag.value)
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped></style>
|