purchase-let/components/orderCanclePopup.vue

61 lines
1.4 KiB
Vue

<template>
<up-popup :show="show" closeable round="10" @close="close">
<view class="cancel-popup">
<view class="head-title">订单取消</view>
<view class="row" v-for="(item,index) in cancelDict" :key="item.value" @click="cancelType=item.value">
<view>{{item.name}}</view>
<image v-if="cancelType==item.value" src="@/static/icon/check.png"></image>
<image v-else src="@/static/icon/n-check.png"></image>
</view>
<up-button color="#20B128" shape="circle" @click="submitCancel">提交</up-button>
</view>
</up-popup>
</template>
<script setup>
import cancelDict from "@/dict/cancelDict.js";
import { ref } from "vue"
const props = defineProps({
show: {
type: Boolean,
default: false
},
})
const cancelType = ref(-1); // 取消类型
const emit = defineEmits(['close', 'change']);
const close = () => {
emit('close');
}
const submitCancel = () => {
let obj = cancelDict.find(item=>item.value == cancelType.value);
if(!obj) return uni.$u.toast('请选择取消原因');
emit('change', obj);
}
</script>
<style lang="scss" scoped>
.cancel-popup {
padding: 30rpx;
.head-title {
font-weight: bold;
text-align: center;
margin-bottom: 20rpx;
}
.row {
display: flex;
justify-content: space-between;
padding-bottom: 20rpx;
image {
width: 40rpx;
height: 40rpx;
}
}
}
</style>