6 changed files with 285 additions and 328 deletions
@ -1,69 +1,198 @@ |
|||||
<template> |
<template> |
||||
<!-- 上传交付物 --> |
<view class="bg-white rounded-md"> |
||||
<view class="box shadow-lg"> |
<view class="p-3 flex justify-between" @click="collapsed = !collapsed"> |
||||
<view class="px-3 py-6 bg-white"> |
<span class="relative p-1"> |
||||
<u-input :auto-height="autoHeight" :border="border" :height="height" :type="type" placeholder="输入备注" v-model="remark" /> |
<!-- <u-badge :is-dot="true" is-center></u-badge> --> |
||||
<view class="flex flex-row-reverse text-xs text-gray-400 mt-2">{{ wordNum }}/140</view> |
{{ deliverData ? deliverData.deliverName : '' }} |
||||
<!-- 评分 --> |
</span> |
||||
<view class="flex justify-between mt-3"> |
<!-- 展开折叠按钮 --> |
||||
<slider :value="score" @change="sliderChange" max="100" min="0" show-value style="width: 60%" /> |
<u-icon :name="collapsed ? 'arrow-up' : 'arrow-down'"></u-icon> |
||||
<u-input :border="border" :type="type1" @input="changeNumber" maxlength="100" placeholder="输入分数" v-model="score" /> |
|
||||
</view> |
</view> |
||||
<view class="flex flex-col justify-center mt-5"> |
|
||||
<u-button @click="submit" size="medium" type="primary">提交</u-button> |
<view class="p-3 pt-0" v-show="collapsed"> |
||||
<u-button @click="$emit('closeScore')" class="mt-2" size="medium">取消</u-button> |
<!-- 提交人和时间信息 --> |
||||
|
<view class="text-gray-400"> |
||||
|
<!-- <span class="mr-2" v-if="deliverData && deliverData.submitter">{{ deliverData.submitter }}</span> --> |
||||
|
<span v-if="deliverData && deliverData.submitTime"> {{ dayjs(+deliverData.submitTime).format('MM-DD HH:mm') }}</span> |
||||
|
</view> |
||||
|
<!-- 提交的链接信息 --> |
||||
|
<view class="w-64 break-all text-blue-400 py-2" v-if="deliverData && deliverData.details && deliverData.details[0]"> |
||||
|
{{ deliverData.details[0] }} |
||||
|
</view> |
||||
|
<!-- 审核人信息 --> |
||||
|
<view class="text-gray-400 flex justify-between"> |
||||
|
<span>审核</span> |
||||
|
<span class="text-blue-400" @click="moreRecords">更多记录</span> |
||||
|
</view> |
||||
|
<view class="px-2" v-if="deliverData && deliverData.checkerList"> |
||||
|
<!-- 遍历审核人信息 --> |
||||
|
<view class="mt-3 text-sm flex justify-between" v-for="item in deliverData.checkerList"> |
||||
|
<view> |
||||
|
<view>{{ item.checkerName }}</view> |
||||
|
<view class="my-1">{{ item.remark }}</view> |
||||
|
<view class="my-1" v-if="item.checkTime > 0">{{ dayjs(+item.checkTime).format('MM-DD HH:mm') }}</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 不是自己 --> |
||||
|
<view v-show="item.isMine !== 1">{{ item.status === null ? '待审核' : item.status === 1 ? '已通过' : '已驳回' }}</view> |
||||
|
|
||||
|
<!-- 是当前审核人 且未审核状态 --> |
||||
|
<view v-show="item.isMine === 1 && item.status === null"> |
||||
|
<u-button size="mini" shape="circle" class="mr-4 h-1-4 leading-1-4" type="primary" @click="approvedModal = true">通过</u-button> |
||||
|
<u-button size="mini" shape="circle" class="h-1-4 leading-1-4" type="error" @click="rebutModal = true">驳回</u-button> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 自己是审核人 且审核过 当前审核人的审核状态并展示得分情况 --> |
||||
|
<view v-show="item.isMine === 1 && item.status !== null" class="text-sm"> |
||||
|
<view> |
||||
|
{{ item.status == '1' ? '已通过' : '已驳回' }} |
||||
|
</view> |
||||
|
<view v-if="item.score > 0"> |
||||
|
<u-circle-progress active-color="#FA8C16" :percent="item.score" width="90" border-width="7" class="mt-2"> |
||||
|
<view class="u-progress-content"> |
||||
|
<view class="progress-dot text-white text-center">{{ item.score }}</view> |
||||
|
</view> |
||||
|
</u-circle-progress> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
</view> |
</view> |
||||
</view> |
|
||||
|
<!-- 审核通过的modal --> |
||||
|
<u-mask :show="approvedModal" @click="approvedModal = false"> |
||||
|
<view class="modal-content-wrap" @click.stop> |
||||
|
<!-- 通过modal的标题 --> |
||||
|
<view class="modal-content-head"> 审核通过 </view> |
||||
|
<view class="modal-content-body"> |
||||
|
<!-- 评分 --> |
||||
|
<view class="flex justify-between mb-4"> |
||||
|
<u-number-box v-model="score" size="30" input-width="50" :max="100" :min="0" :step="1"></u-number-box> |
||||
|
<view class="w-32 pt-4"> |
||||
|
<u-slider v-model="score" active-color="#34D399" :max="100" :min="0" :step="1"></u-slider> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<textarea |
||||
|
class="border-solid border border-gray-300 rounded-md" |
||||
|
placeholder="请输入通过建议" |
||||
|
maxlength="30" |
||||
|
v-model="adviceRef" |
||||
|
></textarea> |
||||
|
<view class="common-list"> |
||||
|
<view v-for="item in commonWords" class="leading-12" @click="adviceRef = item"> |
||||
|
{{ item }} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="modal-content-foot"> |
||||
|
<view class="cancel" @click="approvedModal = false"> 取消 </view> |
||||
|
<view class="confirm" @click="confirmAdvice"> 确定 </view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</u-mask> |
||||
|
|
||||
|
<!-- 审批驳回的modal --> |
||||
|
<u-mask :show="rebutModal" @click="rebutModal = false"> |
||||
|
<view class="modal-content-wrap" @click.stop> |
||||
|
<!-- 通过modal的标题 --> |
||||
|
<view class="modal-content-head"> 审核驳回 </view> |
||||
|
<view class="modal-content-body"> |
||||
|
<textarea |
||||
|
class="border-solid border border-gray-300 rounded-md" |
||||
|
placeholder="请输入通过建议" |
||||
|
maxlength="30" |
||||
|
v-model="rebutRef" |
||||
|
></textarea> |
||||
|
<view class="common-list"> |
||||
|
<view v-for="item in rebutWords" class="leading-12" @click="rebutRef = item"> |
||||
|
{{ item }} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="modal-content-foot"> |
||||
|
<view class="cancel" @click="rebutModal = false"> 取消 </view> |
||||
|
<view class="confirm" @click="confirmReject"> 确定 </view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</u-mask> |
||||
</view> |
</view> |
||||
</template> |
</template> |
||||
|
|
||||
<script setup> |
<script setup> |
||||
import { reactive, watchEffect } from 'vue'; |
import { ref, computed } from 'vue'; |
||||
|
import { useStore } from 'vuex'; |
||||
const data = reactive({ |
import dayjs from 'dayjs'; |
||||
remark: '', |
|
||||
type: 'textarea', |
|
||||
border: true, |
|
||||
height: 100, |
|
||||
autoHeight: true, |
|
||||
wordNum: 0, |
|
||||
score: 0, |
|
||||
type1: 'number', |
|
||||
}); |
|
||||
|
|
||||
const emit = defineEmits(['submit']); |
const props = defineProps({ task: { type: Object, default: () => {} } }); |
||||
|
const store = useStore(); |
||||
|
const projectId = computed(() => store.getters['project/projectId']); |
||||
|
const collapsed = ref(false); |
||||
|
const deliverData = ref(null); // 获取到的审核信息 |
||||
|
const approvedModal = ref(false); // 审核通过的modal |
||||
|
const rebutModal = ref(false); // 审核驳回的modal |
||||
|
const score = ref(100); // 分数 |
||||
|
const adviceRef = ref(''); // 审核通过的审批语 |
||||
|
const rebutRef = ref(''); // 审核驳回的审批语 |
||||
|
const commonWords = ['加油，再接再厉！', '很棒！', '不错，很详细！', '加油，再接再厉']; // 审核通过常用的审批语 |
||||
|
const rebutWords = ['不详细', '还有需要改进的地方', '驳回审批1', '驳回审批2']; // 审核驳回常用的审批语 |
||||
|
|
||||
watchEffect(() => { |
// 获取当前审核信息 |
||||
if (remark) { |
(async function getDeliverList() { |
||||
data.wordNum = remark.value.length; |
try { |
||||
|
const param = { taskId: props.task.id }; |
||||
|
deliverData.value = await uni.$u.api.getDeliverByTaskId(param); |
||||
|
} catch (error) { |
||||
|
console.error('getDeliverList error: ', error); |
||||
} |
} |
||||
|
})(); |
||||
|
|
||||
if (score) { |
// 审核通过发送相关请求 |
||||
data.score1 = score.value; |
function confirmAdvice() { |
||||
} |
// TODO:发送请求 |
||||
}); |
// console.log('确定') |
||||
|
|
||||
// 提交交付物 |
try { |
||||
function submit() { |
const deliverRecordId = deliverData.value.deliverRecordId; |
||||
emit('submit', this.remark, this.score); |
const param = { |
||||
|
projectId: projectId.value, |
||||
|
deliverRecordId, |
||||
|
type: 1, |
||||
|
remark: adviceRef.value, |
||||
|
score: score.value, |
||||
|
}; |
||||
|
console.log(param); |
||||
|
uni.$u.api.checkDeliver(param); |
||||
|
} catch (error) { |
||||
|
console.log('error: ', error); |
||||
|
} |
||||
|
approvedModal.value = false; |
||||
} |
} |
||||
|
|
||||
function sliderChange(e) { |
// 审核驳回发送相关请求 |
||||
data.score = e.detail.value; |
function confirmReject() { |
||||
|
// TODO:发送请求 |
||||
|
try { |
||||
|
const { deliverRecordId } = store.state.deliver; |
||||
|
const param = { |
||||
|
projectId: projectId.value, |
||||
|
deliverRecordId, |
||||
|
type: 2, |
||||
|
remark: rebutRef.value, |
||||
|
score: '', |
||||
|
}; |
||||
|
uni.$u.api.checkDeliver(param); |
||||
|
} catch (error) { |
||||
|
console.log('error: ', error); |
||||
|
} |
||||
|
rebutModal.value = false; |
||||
} |
} |
||||
|
|
||||
function changeNumber(e) { |
// 跳转到审核记录页面 |
||||
if (e > 100) { |
function moreRecords() { |
||||
data.score = 100; |
const { deliverRecordId } = store.state.deliver; |
||||
} |
uni.navigateTo({ url: `/pages/checkerList/checkerList?deliverRecordId=${deliverRecordId}` }); |
||||
} |
} |
||||
</script> |
</script> |
||||
|
<style scoped lang="scss"></style> |
||||
<style scoped lang="scss"> |
|
||||
.box{ |
|
||||
border-radius: 8px; |
|
||||
background: #fff; |
|
||||
padding: 16px; |
|
||||
overflow: hidden; |
|
||||
} |
|
||||
</style> |
|
||||
|
|||||
@ -1,199 +0,0 @@ |
|||||
<template> |
|
||||
<view class="bg-white rounded-md"> |
|
||||
<view class="p-3 flex justify-between" @click="collapsed = !collapsed"> |
|
||||
<span class="relative p-1"> |
|
||||
<!-- <u-badge :is-dot="true" is-center></u-badge> --> |
|
||||
{{ checkData ? checkData.deliverName : '' }} |
|
||||
</span> |
|
||||
<!-- 展开折叠按钮 --> |
|
||||
<u-icon :name="collapsed ? 'arrow-up' : 'arrow-down'"></u-icon> |
|
||||
</view> |
|
||||
<view class="p-3 pt-0" v-show="collapsed"> |
|
||||
<!-- 提交人和时间信息 --> |
|
||||
<view class="text-gray-400"> |
|
||||
<!-- <span class="mr-2" v-if="checkData && checkData.submitter">{{ checkData.submitter }}</span> --> |
|
||||
<span v-if="checkData && checkData.submitTime"> {{ dayjs(+checkData.submitTime).format('MM-DD HH:mm') }}</span> |
|
||||
</view> |
|
||||
<!-- 提交的链接信息 --> |
|
||||
<view class="w-64 break-all text-blue-400 py-2" v-if="checkData && checkData.details && checkData.details[0]"> |
|
||||
{{ checkData.details[0] }} |
|
||||
</view> |
|
||||
<!-- 审核人信息 --> |
|
||||
<view class="text-gray-400 flex justify-between"> |
|
||||
<span>审核</span> |
|
||||
<span class="text-blue-400" @click="moreRecords">更多记录</span> |
|
||||
</view> |
|
||||
<view class="px-2" v-if="checkData && checkData.checkerList"> |
|
||||
<!-- 遍历审核人信息 --> |
|
||||
<view class="mt-3 text-sm flex justify-between" v-for="item in checkData.checkerList"> |
|
||||
<view> |
|
||||
<view>{{ item.checkerName }}</view> |
|
||||
<view class="my-1">{{ item.remark }}</view> |
|
||||
<view class="my-1" v-if="item.checkTime > 0">{{ dayjs(+item.checkTime).format('MM-DD HH:mm') }}</view> |
|
||||
</view> |
|
||||
|
|
||||
<!-- 不是自己 --> |
|
||||
<view v-show="item.isMine !== 1">{{ item.status === null ? '待审核' : item.status === 1 ? '已通过' : '已驳回' }}</view> |
|
||||
|
|
||||
<!-- 是当前审核人 且未审核状态 --> |
|
||||
<view v-show="item.isMine === 1 && item.status === null"> |
|
||||
<u-button size="mini" shape="circle" class="mr-4 h-1-4 leading-1-4" type="primary" @click="approvedModal = true">通过</u-button> |
|
||||
<u-button size="mini" shape="circle" class="h-1-4 leading-1-4" type="error" @click="rebutModal = true">驳回</u-button> |
|
||||
</view> |
|
||||
|
|
||||
<!-- 自己是审核人 且审核过 当前审核人的审核状态并展示得分情况 --> |
|
||||
<view v-show="item.isMine === 1 && item.status !== null" class="text-sm"> |
|
||||
<view> |
|
||||
{{ item.status == '1' ? '已通过' : '已驳回' }} |
|
||||
</view> |
|
||||
<view v-if="item.score > 0"> |
|
||||
<u-circle-progress active-color="#FA8C16" :percent="item.score" width="90" border-width="7" class="mt-2"> |
|
||||
<view class="u-progress-content"> |
|
||||
<view class="progress-dot text-white text-center">{{ item.score }}</view> |
|
||||
</view> |
|
||||
</u-circle-progress> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
|
|
||||
<!-- 审核通过的modal --> |
|
||||
<u-mask :show="approvedModal" @click="approvedModal = false"> |
|
||||
<view class="warp"> |
|
||||
<view class="rect2" @tap.stop> |
|
||||
<!-- 通过modal的标题 --> |
|
||||
<view class="text-center my-7 font-semibold"> 审核通过 </view> |
|
||||
<!-- 评分 --> |
|
||||
<view class="flex justify-between mx-5"> |
|
||||
<u-number-box v-model="score" size="30" input-width="50" :max="100" :min="0" :step="1"></u-number-box> |
|
||||
<view class="w-32 pt-4"> |
|
||||
<u-slider v-model="score" active-color="#34D399" :max="100" :min="0" :step="1"></u-slider> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view> |
|
||||
<textarea |
|
||||
class="border-solid border border-gray-300 m-5 w-58 h-16 p-2 rounded-md" |
|
||||
placeholder="请输入通过建议" |
|
||||
maxlength="30" |
|
||||
v-model="adviceRef" |
|
||||
></textarea> |
|
||||
<view class="common-list"> |
|
||||
<view v-for="item in commonWords" class="h-12 leading-12 w-62 mx-5" @click="adviceRef = item"> |
|
||||
{{ item }} |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="flex justify-around h-12 mt-7 justify-self-stretch box-modal-border"> |
|
||||
<view class="leading-12 flex-1 text-center delete-modal-border" @click="approvedModal = false"> 取消 </view> |
|
||||
<view class="text-blue-700 leading-12 flex-1 text-center" @click="confirmAdvice"> 确定 </view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</u-mask> |
|
||||
|
|
||||
<!-- 审批驳回的modal --> |
|
||||
<u-mask :show="rebutModal" @click="rebutModal = false"> |
|
||||
<view class="warp"> |
|
||||
<view class="rect3" @tap.stop> |
|
||||
<!-- 通过modal的标题 --> |
|
||||
<view class="text-center my-6 font-semibold"> 审核驳回 </view> |
|
||||
<view> |
|
||||
<textarea |
|
||||
class="border-solid border border-gray-300 m-5 w-58 h-16 p-2 rounded-md" |
|
||||
placeholder="请输入通过建议" |
|
||||
maxlength="30" |
|
||||
v-model="rebutRef" |
|
||||
></textarea> |
|
||||
<view class="common-list"> |
|
||||
<view v-for="item in rebutWords" class="h-12 leading-12 w-62 mx-5" @click="rebutRef = item"> |
|
||||
{{ item }} |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
<view class="flex justify-around h-12 mt-7 justify-self-stretch box-modal-border"> |
|
||||
<view class="leading-12 flex-1 text-center delete-modal-border" @click="rebutModal = false"> 取消 </view> |
|
||||
<view class="text-blue-700 leading-12 flex-1 text-center" @click="confirmReject"> 确定 </view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</view> |
|
||||
</u-mask> |
|
||||
</view> |
|
||||
</template> |
|
||||
|
|
||||
<script setup> |
|
||||
import { ref, computed } from 'vue'; |
|
||||
import { useStore } from 'vuex'; |
|
||||
import dayjs from 'dayjs'; |
|
||||
|
|
||||
const props = defineProps({ task: { type: Object, default: () => {} } }); |
|
||||
const store = useStore(); |
|
||||
const projectId = computed(() => store.getters['project/projectId']); |
|
||||
const collapsed = ref(false); |
|
||||
const checkData = ref(null); // 获取到的审核信息 |
|
||||
const approvedModal = ref(false); // 审核通过的modal |
|
||||
const rebutModal = ref(false); // 审核驳回的modal |
|
||||
const score = ref(10); // 分数 |
|
||||
const adviceRef = ref(''); // 审核通过的审批语 |
|
||||
const rebutRef = ref(''); // 审核驳回的审批语 |
|
||||
const commonWords = ['加油，再接再厉！', '很棒！', '不错，很详细！', '加油，再接再厉']; // 审核通过常用的审批语 |
|
||||
const rebutWords = ['不详细', '还有需要改进的地方', '驳回审批1', '驳回审批2']; // 审核驳回常用的审批语 |
|
||||
|
|
||||
// 获取当前审核信息 |
|
||||
(async function getDeliverList() { |
|
||||
try { |
|
||||
const param = { taskId: props.task.id }; |
|
||||
checkData.value = await uni.$u.api.getDeliverByTaskId(param); |
|
||||
} catch (error) { |
|
||||
console.error('getDeliverList error: ', error); |
|
||||
} |
|
||||
}()); |
|
||||
|
|
||||
// 审核通过发送相关请求 |
|
||||
function confirmAdvice() { |
|
||||
// TODO:发送请求 |
|
||||
// console.log('确定') |
|
||||
|
|
||||
try { |
|
||||
const { deliverRecordId } = store.state.deliver; |
|
||||
const param = { |
|
||||
projectId: projectId.value, |
|
||||
deliverRecordId, |
|
||||
type: 1, |
|
||||
remark: adviceRef.value, |
|
||||
score: score.value, |
|
||||
}; |
|
||||
console.log(param) |
|
||||
uni.$u.api.checkDeliver(param); |
|
||||
} catch (error) { |
|
||||
console.log('error: ', error); |
|
||||
} |
|
||||
approvedModal.value = false; |
|
||||
} |
|
||||
|
|
||||
// 审核驳回发送相关请求 |
|
||||
function confirmReject() { |
|
||||
// TODO:发送请求 |
|
||||
try { |
|
||||
const { deliverRecordId } = store.state.deliver; |
|
||||
const param = { |
|
||||
projectId: projectId.value, |
|
||||
deliverRecordId, |
|
||||
type: 2, |
|
||||
remark: rebutRef.value, |
|
||||
score: '', |
|
||||
}; |
|
||||
uni.$u.api.checkDeliver(param); |
|
||||
} catch (error) { |
|
||||
console.log('error: ', error); |
|
||||
} |
|
||||
rebutModal.value = false; |
|
||||
} |
|
||||
|
|
||||
// 跳转到审核记录页面 |
|
||||
function moreRecords() { |
|
||||
const { deliverRecordId } = store.state.deliver; |
|
||||
uni.navigateTo({ url: `/pages/checkerList/checkerList?deliverRecordId=${deliverRecordId}` }); |
|
||||
} |
|
||||
</script> |
|
||||
<style scoped lang="scss"></style> |
|
||||
Loading…
Reference in new issue