merchant_feedov_web/src/views/lotCard/cardList/orderDialog copy.vue

<template>
    <a-modal width="70%" :visible="visible" :title="$t('lotCard.titleOrder')" :hide-cancel='true'
        :ok-text="$t('lotCard.close')" @ok="handleSubmit" @cancel="handleCancel">
        <!-- 搜索条件区 -->
        <div class="search-section">
            <a-form :model="formData" ref="formRef" layout="inline">
                <a-form-item field="iccid" :label="$t('lotCard.iccid')" :validate-trigger="['change', 'input', 'blur']"
                    :rules="[{ required: true, message: $t('lotCard.please') + $t('lotCard.iccid') }]">
                    <a-input v-model="formData.iccid" :placeholder="$t('lotCard.please') + $t('lotCard.iccid')"
                        allow-clear />
                </a-form-item>
                <a-form-item field="hImsi" :label="$t('lotCard.himsi')">
                    <a-input v-model="formData.hImsi" :placeholder="$t('lotCard.please') + $t('lotCard.himsi')"
                        allow-clear />
                </a-form-item>
                <a-form-item>
                    <a-space>
                        <a-button type="primary" @click="handleSearch">{{ $t('form.Search') }}</a-button>
                        <a-button @click="resetSearch">{{ $t('form.Reset') }}</a-button>
                    </a-space>
                </a-form-item>
            </a-form>
        </div>
        <a-table :data="dataSource" :columns="columns" :scroll="{ x: 'auto' }" @page-change="evChangePage"
            @page-size-change="evChangePageSize">
            <template #roleList="{ record }">
                <a-tag v-for="item in record.roleList" :key="item.id" style="margin:0 0 2px 4px;">{{ item.name
                    }}</a-tag>
            </template>
            <template #state="{ record }">
                <a-switch v-model="record.state" disabled style="pointer-events: none" checked-value="1"
                    unchecked-value="0" />
            </template>
            <template #id="{ record }">
                <a-popconfirm :content="$t('lotCard.confirmTitleOrder')" :ok-text="$t('form.Confirm')"
                    :cancel-text="$t('form.Cancel')" @ok="evOrderDialog(record)">
                    <a href="javascript:;" class="a-link">{{ $t('lotCard.titleOrder') }}</a>
                </a-popconfirm>
            </template>

        </a-table>
    </a-modal>
</template>
<script setup>
import { onMounted, ref, getCurrentInstance } from "vue";
import { columns } from "../trafficList/config";
import { Message, Notification } from '@arco-design/web-vue'
import { packageInfo, orderSync } from '@/api/path/lotCard.api'
import { useRouter, useRoute } from 'vue-router'


const props = defineProps({
});
const router = useRouter()
const route = useRoute();

const emit = defineEmits(['submit']);

const { proxy } = getCurrentInstance()
const formRef = ref()
const formData = ref({
    "iccid": "",
    "imsi": "454120387374989",
});
const tableObj = ref({})

const dataSource = ref([]);
const pagination = ref({
    total: 0,
    pageSize: 10,
    current: 1,
})

const visible = ref(false)

const open = (data) => {
    if (data.length == 0) {
        return
    }
    visible.value = true
    tableObj.value = data
    intData()
}

const intData = async () => {
    const param = {
        current: pagination.value.current,
        size: pagination.value.pageSize,
        ...formData.value
    }
    const { data } = await packageInfo(param)
    dataSource.value = data || []
    pagination.value.total = dataSource.value.length
}

const evChangePage = (page) => {
    pagination.value.current = page
}

const evChangePageSize = (pageSize) => {
    pagination.value.pageSize = pageSize
}



const resetSearch = () => {
    proxy.$refs.formRef.resetFields()
}

const handleSearch = () => {
    formRef.value.validate((errors) => {
        if (!errors) {
            intData()
        }
    });
}

const handleSubmit = () => {
    emit('submit', { ...formData });
    visible.value = false
};

const handleCancel = () => {
    visible.value = false
};

// 下发用户
const evOrderDialog = async (record) => {
    const param = {
        "includeCard": 1,
        "is_Refuel": "1",//是否为附加包
        refuelingId: "",//is_Refuel为0需要附加包
        "dataBundleId": record.id,// 流量包id
        "quantity": 1, // 采购数量
        "ICCID": tableObj.value.iccid,
        "sendLang": "3", // 发送购买短信语言
    }
    const { code, data, message } = await orderSync(param)
    if (code == 200) {
        Message.success({
            content: message,
            duration: 2000,
        })
        const queryData = {
            ...data,
            ...param,
        }
        const timter = setTimeout(() => {
            router.push({
                name: "lotCard-packageMange",
                query: queryData
            }, 2000)
            clearTimeout(timter)
        })

    }
};




defineExpose({ open })


</script>