|
@@ -0,0 +1,261 @@
|
|
|
|
|
+<template>
|
|
|
|
|
+ <component
|
|
|
|
|
+ is="a-modal"
|
|
|
|
|
+ :width="tool.getDevice() === 'mobile' ? '100%' : '600px'"
|
|
|
|
|
+ v-model:visible="visible"
|
|
|
|
|
+ :title="title"
|
|
|
|
|
+ :mask-closable="false"
|
|
|
|
|
+ :ok-loading="loading"
|
|
|
|
|
+ @cancel="close"
|
|
|
|
|
+ @before-ok="submit"
|
|
|
|
|
+ >
|
|
|
|
|
+ <!-- 表单信息 start -->
|
|
|
|
|
+ <a-form
|
|
|
|
|
+ ref="formRef"
|
|
|
|
|
+ :model="formData"
|
|
|
|
|
+ :rules="rules"
|
|
|
|
|
+ :auto-label-width="true"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-form-item label="游戏" field="game_id">
|
|
|
|
|
+ <a-tree-select
|
|
|
|
|
+ v-model="formData.game_id"
|
|
|
|
|
+ :data="gameList"
|
|
|
|
|
+ placeholder="请选择游戏"
|
|
|
|
|
+ allow-clear
|
|
|
|
|
+ :field-names="{ title: 'name', key: 'id' }"
|
|
|
|
|
+ allow-search
|
|
|
|
|
+ tree-checked-strategy="child"
|
|
|
|
|
+ :tree-checkable="false"
|
|
|
|
|
+ :max-tag-count="1"
|
|
|
|
|
+ @change="handleGameChange"
|
|
|
|
|
+ />
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ <a-form-item v-if="os == 2" label="内购" field="inapp">
|
|
|
|
|
+ <a-select v-model="formData.inapp" placeholder="请选择内购" allow-clear>
|
|
|
|
|
+ <a-option
|
|
|
|
|
+ v-for="item in paySubjectList"
|
|
|
|
|
+ v-show="item.pay_type == 'apple'"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ :value="item.id"
|
|
|
|
|
+ >{{ item.name }}</a-option
|
|
|
|
|
+ >
|
|
|
|
|
+ </a-select>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ <a-form-item v-if="os == 3" label="内购" field="inapp">
|
|
|
|
|
+ <a-select v-model="formData.inapp" placeholder="请选择内购" allow-clear>
|
|
|
|
|
+ <a-option
|
|
|
|
|
+ v-for="item in paySubjectList"
|
|
|
|
|
+ v-show="item.pay_type == 'wechat' && item.sub_pay_type == 'inapp'"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ :value="item.id"
|
|
|
|
|
+ >{{ item.name }}</a-option
|
|
|
|
|
+ >
|
|
|
|
|
+ </a-select>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ <a-form-item
|
|
|
|
|
+ v-if="os == 2 || os == 1 || os == 5"
|
|
|
|
|
+ label="微信wap"
|
|
|
|
|
+ field="wechat_wap"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-select
|
|
|
|
|
+ v-model="formData.wechat_wap"
|
|
|
|
|
+ placeholder="请选择微信wap"
|
|
|
|
|
+ allow-clear
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-option
|
|
|
|
|
+ v-for="item in paySubjectList"
|
|
|
|
|
+ v-show="item.pay_type == 'wechat' && item.sub_pay_type == 'wap'"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ :value="item.id"
|
|
|
|
|
+ >{{ item.name }}</a-option
|
|
|
|
|
+ >
|
|
|
|
|
+ </a-select>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ <a-form-item
|
|
|
|
|
+ v-if="os == 2 || os == 1 || os == 5"
|
|
|
|
|
+ label="支付宝wap"
|
|
|
|
|
+ field="alipay_wap"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-select
|
|
|
|
|
+ v-model="formData.alipay_wap"
|
|
|
|
|
+ placeholder="请选择支付宝wap"
|
|
|
|
|
+ allow-clear
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-option
|
|
|
|
|
+ v-for="item in paySubjectList"
|
|
|
|
|
+ v-show="item.pay_type == 'alipay' && item.sub_pay_type == 'wap'"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ :value="item.id"
|
|
|
|
|
+ >{{ item.name }}</a-option
|
|
|
|
|
+ >
|
|
|
|
|
+ </a-select>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ <a-form-item
|
|
|
|
|
+ label="微信扫码"
|
|
|
|
|
+ v-if="os == 1 || os == 5"
|
|
|
|
|
+ field="wechat_scan"
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-select
|
|
|
|
|
+ v-model="formData.wechat_scan"
|
|
|
|
|
+ placeholder="请选择微信扫码"
|
|
|
|
|
+ allow-clear
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-option
|
|
|
|
|
+ v-for="item in paySubjectList"
|
|
|
|
|
+ v-show="item.pay_type == 'wechat' && item.sub_pay_type == 'scan'"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ :value="item.id"
|
|
|
|
|
+ >{{ item.name }}</a-option
|
|
|
|
|
+ >
|
|
|
|
|
+ </a-select>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ <a-form-item label="微信公众号" v-if="os == 4" field="wechat_jsapi">
|
|
|
|
|
+ <a-select
|
|
|
|
|
+ v-model="formData.wechat_jsapi"
|
|
|
|
|
+ placeholder="请选择微信公众号"
|
|
|
|
|
+ allow-clear
|
|
|
|
|
+ >
|
|
|
|
|
+ <a-option
|
|
|
|
|
+ v-for="item in paySubjectList"
|
|
|
|
|
+ v-show="item.pay_type == 'wechat' && item.sub_pay_type == 'jsapi'"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ :value="item.id"
|
|
|
|
|
+ >{{ item.name }}</a-option
|
|
|
|
|
+ >
|
|
|
|
|
+ </a-select>
|
|
|
|
|
+ </a-form-item>
|
|
|
|
|
+ </a-form>
|
|
|
|
|
+ <!-- 表单信息 end -->
|
|
|
|
|
+ </component>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<script setup>
|
|
|
|
|
+import { ref, reactive, computed, watchEffect } from "vue";
|
|
|
|
|
+import tool from "@/utils/tool";
|
|
|
|
|
+import { Message, Modal } from "@arco-design/web-vue";
|
|
|
|
|
+import api from "../../api/center/gamePayChannel";
|
|
|
|
|
+import commonApi from "../../api/common";
|
|
|
|
|
+import centerGameApi from "../../api/center/game";
|
|
|
|
|
+
|
|
|
|
|
+const emit = defineEmits(["success"]);
|
|
|
|
|
+// 引用定义
|
|
|
|
|
+const visible = ref(false);
|
|
|
|
|
+const loading = ref(false);
|
|
|
|
|
+const formRef = ref();
|
|
|
|
|
+const mode = ref("");
|
|
|
|
|
+const paySubjectList = ref([]);
|
|
|
|
|
+const gameList = ref([]);
|
|
|
|
|
+const os = ref("");
|
|
|
|
|
+
|
|
|
|
|
+let title = computed(() => {
|
|
|
|
|
+ return "游戏支付渠道" + (mode.value == "add" ? "-新增" : "-编辑");
|
|
|
|
|
+});
|
|
|
|
|
+
|
|
|
|
|
+// 表单初始值
|
|
|
|
|
+const initialFormData = {
|
|
|
|
|
+ id: null,
|
|
|
|
|
+ game_id: null,
|
|
|
|
|
+ inapp: null,
|
|
|
|
|
+ wechat_wap: null,
|
|
|
|
|
+ alipay_wap: null,
|
|
|
|
|
+ wechat_scan: null,
|
|
|
|
|
+ wechat_jsapi: null,
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 表单信息
|
|
|
|
|
+const formData = reactive({ ...initialFormData });
|
|
|
|
|
+
|
|
|
|
|
+// 验证规则
|
|
|
|
|
+const rules = {
|
|
|
|
|
+ game_id: [{ required: true, message: "游戏必需填写" }],
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 获取游戏列表
|
|
|
|
|
+const getGameList = async () => {
|
|
|
|
|
+ const res = await commonApi.getGameListTreeNoAuthApi({ single: true });
|
|
|
|
|
+ if (res.code === 200) {
|
|
|
|
|
+ gameList.value = res.data;
|
|
|
|
|
+ }
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 获取支付主体
|
|
|
|
|
+const getPaySubject = async () => {
|
|
|
|
|
+ const res = await api.getPaySubjectApi();
|
|
|
|
|
+ if (res.code === 200) {
|
|
|
|
|
+ paySubjectList.value = res.data;
|
|
|
|
|
+ }
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 游戏选择
|
|
|
|
|
+const handleGameChange = async (value) => {
|
|
|
|
|
+ const res = await centerGameApi.read(value);
|
|
|
|
|
+ if (res.code === 200) {
|
|
|
|
|
+ os.value = res.data.os;
|
|
|
|
|
+ formData.inapp = null;
|
|
|
|
|
+ formData.wechat_wap = null;
|
|
|
|
|
+ formData.alipay_wap = null;
|
|
|
|
|
+ formData.wechat_scan = null;
|
|
|
|
|
+ formData.wechat_jsapi = null;
|
|
|
|
|
+ }
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 打开弹框
|
|
|
|
|
+const open = async (type = "add") => {
|
|
|
|
|
+ mode.value = type;
|
|
|
|
|
+ // 重置表单数据
|
|
|
|
|
+ Object.assign(formData, initialFormData);
|
|
|
|
|
+
|
|
|
|
|
+ formRef.value.clearValidate();
|
|
|
|
|
+ visible.value = true;
|
|
|
|
|
+ await initPage();
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 初始化页面数据
|
|
|
|
|
+const initPage = async () => {
|
|
|
|
|
+ await getGameList();
|
|
|
|
|
+ await getPaySubject();
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 设置数据
|
|
|
|
|
+const setFormData = async (data) => {
|
|
|
|
|
+ for (const key in formData) {
|
|
|
|
|
+ if (data[key] != null && data[key] != undefined) {
|
|
|
|
|
+ formData[key] = data[key];
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ os.value = data.game_os;
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 数据保存
|
|
|
|
|
+const submit = async (done) => {
|
|
|
|
|
+ const validate = await formRef.value?.validate();
|
|
|
|
|
+ if (!validate) {
|
|
|
|
|
+ loading.value = true;
|
|
|
|
|
+ let data = { ...formData };
|
|
|
|
|
+ let result = {};
|
|
|
|
|
+ if (mode.value === "add") {
|
|
|
|
|
+ // 添加数据
|
|
|
|
|
+ data.id = undefined;
|
|
|
|
|
+ result = await api.save(data);
|
|
|
|
|
+ } else {
|
|
|
|
|
+ // 修改数据
|
|
|
|
|
+ result = await api.update(data.id, data);
|
|
|
|
|
+ }
|
|
|
|
|
+ if (result.code === 200) {
|
|
|
|
|
+ Message.success("操作成功");
|
|
|
|
|
+ emit("success");
|
|
|
|
|
+ done(true);
|
|
|
|
|
+ }
|
|
|
|
|
+ // 防止连续点击提交
|
|
|
|
|
+ setTimeout(() => {
|
|
|
|
|
+ loading.value = false;
|
|
|
|
|
+ }, 500);
|
|
|
|
|
+ }
|
|
|
|
|
+ done(false);
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 关闭弹窗
|
|
|
|
|
+const close = () => (visible.value = false);
|
|
|
|
|
+
|
|
|
|
|
+defineExpose({ open, setFormData });
|
|
|
|
|
+</script>
|