<script setup>
import YY_ICON from "../../../static/icons/yy.png";
import {showToast, toPage} from "../../../utils/uils.js";
import ReplyMessageModal from "./replyMessageModal.vue";
import Api from "../../../api/index.js";

const emits = defineEmits(['success']);
const {operate, data, item} = defineProps({
    operate: {
        type: Number,
        default: 1,
    },
    data: {
        type: Object,
        default: () => ({})
    },
    item: {
        type: Object,
        default: () => ({})
    }
});

const abandonTask = async () => {
    const {msg} = await Api.system.abandonTask({id: data.children.id});
    showToast(msg);
    emits('success');
}

const confirmTask = async () => {
    const {msg} = await Api.system.confirmTask({id: data.children.id, log_id: item.id});
    showToast(msg);
    emits('success');
}
</script>

<template>
    <view class="p-[24rpx] bg-white w-[460rpx] !flex flex-col gap-[16rpx]">
        <template v-if="operate===1">
            <view
                class="w-full py-[8rpx] bg-[#F2F3F5] px-[30rpx] test-22r text-[#86909C] !flex items-center gap-[10rpx] rounded-[4rpx]">
                <image :src="YY_ICON" class="!size-[26rpx]"></image>
                提示：点击下方按钮，快速回复
            </view>
            <view
                @click="toPage(`/pages/taskDetails/index?id=${data.id}&task_children_id=${data.children.id}&tab=2`)"
                class="py-[15rpx] !flex justify-center flex-col items-center test-28r text-[#165DFF] bg-[#E8F3FF] px-[26rpx]">
                去重新回填
            </view>
            <view
                @click="abandonTask"
                class="py-[15rpx] !flex justify-center flex-col items-center test-28r text-[#165DFF] bg-[#E8F3FF] px-[26rpx]">
                拒绝修改并放弃任务
                <view class="w-full h-[2rpx] bg-[#E5E6EB] !my-[8rpx]"></view>
                <view class="test-22r text-[#86909C]">商家将根据约定扣钱或不结算</view>
            </view>
            <reply-message-modal :data="data" :logId="item.id" :intervention="true" @success="emits('success')">
                <view
                    class="py-[15rpx] !flex justify-center flex-col items-center test-28r text-[#165DFF] bg-[#E8F3FF] px-[26rpx]">
                    发起申诉
                </view>
            </reply-message-modal>
        </template>
        <template v-if="operate===2">
            <view
                class="w-full py-[8rpx] bg-[#F2F3F5] px-[30rpx] test-22r text-[#86909C] !flex items-center gap-[10rpx] rounded-[4rpx]">
                <image :src="YY_ICON" class="!size-[26rpx]"></image>
                提示：点击下方按钮，快速回复
            </view>
            <reply-message-modal
                :backId="item.task_backfill_id"
                :pattern="1"
                :logId="item.id"
                :data="data"
                @success="emits('success');">
                <view
                    class="py-[15rpx] !flex justify-center flex-col items-center test-28r text-[#165DFF] bg-[#E8F3FF] px-[26rpx]">
                    去回复
                </view>
            </reply-message-modal>
            <view
                @click="abandonTask"
                class="py-[15rpx] !flex justify-center flex-col items-center test-28r text-[#165DFF] bg-[#E8F3FF] px-[26rpx]">
                拒绝修改并放弃任务
                <view class="w-full h-[2rpx] bg-[#E5E6EB] !my-[8rpx]"></view>
                <view class="test-22r text-[#86909C]">商家将根据约定扣钱或不结算</view>
            </view>
            <reply-message-modal :data="data" :logId="item.id" :intervention="true" @success="emits('success')">
                <view
                    class="py-[15rpx] !flex justify-center flex-col items-center test-28r text-[#165DFF] bg-[#E8F3FF] px-[26rpx]">
                    发起申诉
                </view>
            </reply-message-modal>
        </template>
        <template v-if="operate===3">
            <view
                class="w-full py-[8rpx] bg-[#F2F3F5] px-[30rpx] test-22r text-[#86909C] !flex items-center gap-[10rpx] rounded-[4rpx]">
                <image :src="YY_ICON" class="!size-[26rpx]"></image>
                提示：点击下方按钮，快速回复
            </view>
            <reply-message-modal :data="data" :logId="item.id" :intervention="true" @success="emits('success')">
                <view
                    class="py-[15rpx] !flex justify-center flex-col items-center test-28r text-[#165DFF] bg-[#E8F3FF] px-[26rpx]">
                    发起申诉
                    <view class="w-full h-[2rpx] bg-[#E5E6EB] !my-[8rpx]"></view>
                    <view class="test-22r text-[#86909C]">对商家处理有异议，可点击申诉</view>
                </view>
            </reply-message-modal>
        </template>
        <template v-if="operate===5">
            <view
                class="w-full py-[8rpx] bg-[#F2F3F5] px-[30rpx] test-22r text-[#86909C] !flex items-center gap-[10rpx] rounded-[4rpx]">
                <image :src="YY_ICON" class="!size-[26rpx]"></image>
                提示：点击下方按钮，快速回复
            </view>
            <view
                @click="confirmTask"
                class="py-[15rpx] !flex justify-center flex-col items-center test-28r text-[#165DFF] bg-[#E8F3FF] px-[26rpx]">
                我同意
                <view class="w-full h-[2rpx] bg-[#E5E6EB] !my-[8rpx]"></view>
                <view class="test-22r text-[#86909C]">将在12时00分00秒后自动同意</view>
            </view>
            <reply-message-modal :data="data" :logId="item.id" :intervention="true" @success="emits('success')">
                <view
                    class="py-[15rpx] !flex justify-center flex-col items-center test-28r text-[#165DFF] bg-[#E8F3FF] px-[26rpx]">
                    发起申诉
                    <view class="w-full h-[2rpx] bg-[#E5E6EB] !my-[8rpx]"></view>
                    <view class="test-22r text-[#86909C]">对结算有异议，可点击申诉</view>
                </view>
            </reply-message-modal>
        </template>
    </view>
</template>

<style scoped lang="scss">

</style>
