<template>
  <view
    class="fixed shadow-2xl"
    style="z-index: 1000"
    :style="{
      left: tip.left + 'px',
      top: data.height - tip.top > 110 ? tip.top + 'px' : '',
      bottom: data.height - tip.top > 110 ? '' : '10px',
    }"
    id="u-icard"
  >
    <u-card :title="title" style="width: 500rpx; margin: 0 !important" v-if="tip.show" titleSize="28" :headStyle="data.headStyle" :footStyle="data.footStyle">
      <view class="" slot="body">{{ tip.text }}</view>
      <view class="flex justify-end" slot="foot">
        <u-button size="mini" @click="onCancel">取消</u-button>
        <u-button v-if="tip.status === 1" size="mini" @click="onChangeStatus(1)">暂停</u-button>
        <u-button v-if="tip.status === 2" size="mini" @click="onChangeStatus(2)">继续</u-button>
        <u-button v-if="tip.status === 1 || tip.status === 2" size="mini" @click="onChangeStatus(0)">重新开始</u-button>
        <u-button v-if="tip.status === 1 || tip.status === 2" type="primary" size="mini" @click="onChangeStatus(3)">结束</u-button>
        <u-button v-if="tip.status === 0 || tip.status === 3" type="primary" size="mini" @click="onChangeStatus(0)">确定</u-button>
      </view>
    </u-card>
  </view>
</template>

<script setup>
import { useStore, onMounted, computed, reactive } from 'vuex';

defineProps({ title: { default: '提示', type: String } });

const store = useStore();
const tip = computed(() => store.state.task.tip);

const data = reactive({
  footStyle: { padding: '4px 15px' },
  headStyle: { paddingTop: '8px', paddingBottom: '8px' },
  height: 0,
});

onMounted(() => {
  const system = uni.getSystemInfoSync();
  data.height = system.windowHeight;
});

/**
     * 执行修改任务状态的动作
     * @param {number} type 状态码 0开始 1暂停 2继续 3完成 默认0
     */
async function onChangeStatus(type) {
  try {
    const param = { id: data.tip.taskId, type };
    await uni.$u.api.updateTaskType(param);
    if (type === 0) {
      uni.$ui.showToast('项目已重新开始');
    } else if (type === 1) {
      uni.$ui.showToast('项目已暂停');
    } else if (type === 2) {
      uni.$ui.showToast('项目继续');
    } else if (type === 3) {
      uni.$ui.showToast('项目结束');
    }
    data.tip.show = false;
    // TODO: 更新界面 不要整体刷新
    // location.reload();
    // this.$router.go(0);
  } catch (error) {
    console.error(error);
    uni.$ui.showToast(error.msg || '操作失败');
  }
}

// 点击了取消
function onCancel() {
  store.commit('task/setTipShow', false);
}

// 点击了确认
// function onConfirm() {
//   onCancel();
// }
</script>
