72 lines
1.8 KiB
Vue
72 lines
1.8 KiB
Vue
|
|
<template>
|
|||
|
|
<div class="subscribe-container">
|
|||
|
|
<div class="subscribe-tip mb-3">当您订阅的软件有漏洞预警通知时,将以应用号的方式通知。可在首页查看或取消订阅!</div>
|
|||
|
|
<div class="subscribe-form">
|
|||
|
|
<span>通知方式</span>
|
|||
|
|
<d-radio-group direction="row" v-model="subscribeType" @change="typeChange">
|
|||
|
|
<d-radio value="0">短信</d-radio>
|
|||
|
|
<d-radio value="1">邮件</d-radio>
|
|||
|
|
<d-radio value="2">站内通知</d-radio>
|
|||
|
|
</d-radio-group>
|
|||
|
|
</div>
|
|||
|
|
<div class="subscribe-operation mt-5">
|
|||
|
|
<d-popover :is-open="isError" content="请选择一项通知方式" pop-type="error" :position="['top']" trigger="manually">
|
|||
|
|
<d-button @click="confirm" variant="solid" class="mr-2">确定</d-button>
|
|||
|
|
</d-popover>
|
|||
|
|
<d-button @click="$emit('close')">取消</d-button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup lang="ts">
|
|||
|
|
import { computed, ref } from 'vue';
|
|||
|
|
|
|||
|
|
const props = defineProps(['softwareData']);
|
|||
|
|
const emit = defineEmits(['close']);
|
|||
|
|
const subscribeType = ref('');
|
|||
|
|
const isError = ref(false);
|
|||
|
|
const typeChange = () => {
|
|||
|
|
isError.value = false;
|
|||
|
|
}
|
|||
|
|
const confirm = () => {
|
|||
|
|
if (!subscribeType.value) {
|
|||
|
|
isError.value = true;
|
|||
|
|
return;
|
|||
|
|
}
|
|||
|
|
isError.value = false;
|
|||
|
|
emit('close');
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped lang="scss">
|
|||
|
|
.subscribe-container {
|
|||
|
|
width: 600px;
|
|||
|
|
|
|||
|
|
.subscribe-tip {
|
|||
|
|
color: #191919;
|
|||
|
|
font-family: HarmonyOS Sans SC;
|
|||
|
|
font-weight: regular;
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.subscribe-form {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
background: #F2F5FC;
|
|||
|
|
padding: 20px;
|
|||
|
|
|
|||
|
|
>span {
|
|||
|
|
margin-right: 20px;
|
|||
|
|
color: #808080;
|
|||
|
|
font-family: HarmonyOS Sans SC;
|
|||
|
|
font-weight: regular;
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.subscribe-operation {
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|