update
This commit is contained in:
77
src/pages/merchant/components/Alipay.vue
Normal file
77
src/pages/merchant/components/Alipay.vue
Normal file
@@ -0,0 +1,77 @@
|
||||
<script setup>
|
||||
import {ref} from "vue";
|
||||
|
||||
const visible = ref(false);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<a-button type="primary" @click="visible=true">立即充值</a-button>
|
||||
|
||||
<a-modal
|
||||
:footer="false"
|
||||
id="Alipay-Modal"
|
||||
title-align="start"
|
||||
title="支付宝支付"
|
||||
v-model:visible="visible">
|
||||
<template v-if="true">
|
||||
<a-alert>平台提示：支付后未出现成功提示，点击【我已支付】刷新充值状态</a-alert>
|
||||
|
||||
<div class="py-[24px] px-[20px]">
|
||||
<div class="flex justify-center gap-[15px]">
|
||||
支付金额: <span class="text-[rgb(var(--arcoblue-6))]">200元</span>
|
||||
</div>
|
||||
<div class="text-center mt-[20px]">打开支付宝扫描下方二维码支付</div>
|
||||
<div class="w-[200px] aspect-square mx-auto mt-[5px]">
|
||||
<img class="w-full h-full object-cover" src="" alt=""/>
|
||||
</div>
|
||||
<div class="flex justify-center mt-[5px] flex-col items-center">
|
||||
<a-link :hoverable="false" style="color: var(--color-neutral-6)">
|
||||
<icon-sync class="mr-[5px]"/>
|
||||
点击刷新
|
||||
</a-link>
|
||||
<a-button class="mx-auto mt-[20px]" type="primary">我已支付</a-button>
|
||||
</div>
|
||||
|
||||
<div class="mt-[20px] info mb-[40px]">
|
||||
<div>支付遇到问题?</div>
|
||||
<div>1、请先确认第三方支付网站是否交易完成。</div>
|
||||
<div>2、第三方支付网站显示交易成功，但账户中没有充值流水，请私聊客服</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template v-else>
|
||||
<div class="py-[24px] px-[20px]">
|
||||
<a-result status="success" title="充值成功">
|
||||
<template #subtitle>
|
||||
支付宝付款￥200.00
|
||||
</template>
|
||||
<template #extra>
|
||||
<a-space>
|
||||
<a-button type='primary'>确定</a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
</a-result>
|
||||
</div>
|
||||
</template>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.info {
|
||||
color: rgb(78, 89, 105);
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
line-height: 22px;
|
||||
letter-spacing: 0;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
|
||||
<style lang="scss">
|
||||
#Alipay-Modal {
|
||||
.arco-modal-body {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
66
src/pages/merchant/components/BlackjackExpertModal.vue
Normal file
66
src/pages/merchant/components/BlackjackExpertModal.vue
Normal file
@@ -0,0 +1,66 @@
|
||||
<script setup>
|
||||
import {reactive} from 'vue';
|
||||
import Api from "../../../api/index.js";
|
||||
import XSelect from "../../../components/XSelect/index.vue";
|
||||
|
||||
const visible = defineModel('visible');
|
||||
|
||||
const form = reactive({
|
||||
blackoutDuration: 1,
|
||||
value: null,
|
||||
blackoutValue: 50,
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<a-modal
|
||||
:width="600"
|
||||
ok-text="确认拉黑"
|
||||
title-align="start"
|
||||
title="拉黑达人"
|
||||
v-model:visible="visible">
|
||||
<a-form layout="vertical" :model="form">
|
||||
<a-form-item label="拉黑时间">
|
||||
<a-radio-group
|
||||
type="button"
|
||||
v-model:model-value="form.blackoutDuration">
|
||||
<a-radio :value="1">1天</a-radio>
|
||||
<a-radio :value="2">3天</a-radio>
|
||||
<a-radio :value="3">7天</a-radio>
|
||||
<a-radio :value="4">30天</a-radio>
|
||||
<a-radio :value="5">永久</a-radio>
|
||||
<a-radio :value="6">自定义</a-radio>
|
||||
</a-radio-group>
|
||||
<a-input-number
|
||||
v-model:model-value="form.blackoutValue"
|
||||
default-value="50"
|
||||
mode="button"
|
||||
class="w-[150px]">
|
||||
<template #suffix>
|
||||
天
|
||||
</template>
|
||||
</a-input-number>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item label="拉黑效果">
|
||||
<XSelect
|
||||
placeholder="请选择拉黑效果"
|
||||
v-model:model-value="form.value"
|
||||
:api="Api.system.getSelect">
|
||||
</XSelect>
|
||||
</a-form-item>
|
||||
|
||||
<a-form-item label="拉黑原因">
|
||||
<a-textarea
|
||||
show-word-limit
|
||||
:max-length="100"
|
||||
placeholder="请输入拉黑原因">
|
||||
</a-textarea>
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
62
src/pages/merchant/components/TerminateTask.js
Normal file
62
src/pages/merchant/components/TerminateTask.js
Normal file
@@ -0,0 +1,62 @@
|
||||
import {Modal, Tag} from "@arco-design/web-vue";
|
||||
import {h} from 'vue';
|
||||
|
||||
const ModalContent = {
|
||||
props: {
|
||||
status: {
|
||||
type: String,
|
||||
default: 'success',
|
||||
},
|
||||
status_text: {
|
||||
type: String,
|
||||
default: null,
|
||||
}
|
||||
},
|
||||
setup(props) {
|
||||
switch (props.status) {
|
||||
case 'success':
|
||||
return () => h('div', {}, [
|
||||
h('div', {class: 'flex items-center gap-[8px]'}, [
|
||||
h('div', {}, '该子任务状态为:'),
|
||||
h(Tag, {color: 'orangered'}, props.status_text)
|
||||
]),
|
||||
h('div', {class: 'text-[14px] text-[rgb(78, 89, 105)]'}, '点击终止子任务后，达人将无法再领取子任务')
|
||||
]);
|
||||
case 'warning':
|
||||
return () => h('div', {}, [
|
||||
h('div', {class: 'flex items-center gap-[8px]'}, [
|
||||
h('div', {}, '该子任务状态为:'),
|
||||
h(Tag, {color: 'orangered'}, props.status_text)
|
||||
]),
|
||||
h('div', {class: 'text-[14px] text-[rgb(78, 89, 105)]'}, '无法终止')
|
||||
]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const openTerminateTask = (type, status_text = '待上传素材') => {
|
||||
const status = 'success';
|
||||
|
||||
Modal.warning({
|
||||
title: '确认终止子任务',
|
||||
draggable: true,
|
||||
hideCancel: false,
|
||||
content: () =>
|
||||
h(
|
||||
ModalContent,
|
||||
{
|
||||
status: 'success',
|
||||
status_text: status_text
|
||||
}
|
||||
),
|
||||
okButtonProps: {
|
||||
status: 'danger',
|
||||
},
|
||||
okText: status === 'success' ? '确认终止' : '确认',
|
||||
onOk: () => {
|
||||
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
export default openTerminateTask;
|
||||
Reference in New Issue
Block a user