update
This commit is contained in:
@@ -163,7 +163,7 @@ const system = {
|
|||||||
} else {
|
} else {
|
||||||
return request({
|
return request({
|
||||||
method: MethodsENUM.POST,
|
method: MethodsENUM.POST,
|
||||||
url: "/notice/getNotice",
|
url: "/task/getAllExchangeLog",
|
||||||
data: data,
|
data: data,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
40
src/components/LeftMenu.vue
Normal file
40
src/components/LeftMenu.vue
Normal file
@@ -0,0 +1,40 @@
|
|||||||
|
<script setup>
|
||||||
|
import BACK_TOP_ICON from "../static/icons/backtop.png";
|
||||||
|
|
||||||
|
const emits = defineEmits(['top', 'setScroll']);
|
||||||
|
const {tabs} = defineProps({
|
||||||
|
tabs: {
|
||||||
|
type: [],
|
||||||
|
default: () => []
|
||||||
|
}
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="bg-[rgba(29,33,41,1)] rounded-[12rpx] p-[8rpx] fixed top-1/2 -translate-y-1/2 right-0 z-[999]">
|
||||||
|
<view
|
||||||
|
@click="emits('top')"
|
||||||
|
class="py-[18rpx] px-[24rpx] !flex justify-around flex-col items-center h-[100rpx] bg-[rgba(78,89,105,1)] rounded-[8rpx]">
|
||||||
|
<image class="!h-[12rpx]" :src="BACK_TOP_ICON" mode="heightFix"></image>
|
||||||
|
<view class="text-[rgba(201,205,212,1)] test-28r">顶部</view>
|
||||||
|
</view>
|
||||||
|
<view class="h-[16rpx] !flex justify-center items-center">
|
||||||
|
<view class="w-[40rpx] bg-[#4E5969] h-[2rpx]"></view>
|
||||||
|
</view>
|
||||||
|
<template v-for="(v, index) in tabs">
|
||||||
|
<view class="py-[18rpx] px-[24rpx]" @click="emits('setScroll', v.value)">
|
||||||
|
<view :class="['text-[rgba(201,205,212,1)] test-28r', v.now ? 'text-white' : '']">{{ v.name1 }}</view>
|
||||||
|
<view :class="['text-[rgba(201,205,212,1)] test-28r', v.now ? 'text-white' : '']">{{ v.name2 }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="h-[16rpx] !flex justify-center items-center" v-if="index < tabs.length-1">
|
||||||
|
<view class="w-[40rpx] bg-[#4E5969] h-[2rpx]"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.text-white {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -3,6 +3,7 @@ import {computed} from 'vue';
|
|||||||
import messageIcon from "../static/icons/messageIcon.png";
|
import messageIcon from "../static/icons/messageIcon.png";
|
||||||
import XActionsheet from "./XActionsheet.vue";
|
import XActionsheet from "./XActionsheet.vue";
|
||||||
import OpenTypeFun from "./OpenTypeFun.js";
|
import OpenTypeFun from "./OpenTypeFun.js";
|
||||||
|
import {toPage} from "../utils/uils.js";
|
||||||
|
|
||||||
const itemList = computed(() => {
|
const itemList = computed(() => {
|
||||||
const item = [];
|
const item = [];
|
||||||
@@ -36,7 +37,7 @@ const selectActionsheet = (e) => {
|
|||||||
@success="selectActionsheet"
|
@success="selectActionsheet"
|
||||||
:itemList="itemList">
|
:itemList="itemList">
|
||||||
<view
|
<view
|
||||||
@click.stop="OpenTypeFun(data)"
|
@click.stop="type === 0 ? toPage(`/pages/taskDetails/index?id=${data.task_id}&task_children_id=${data.task_children_id}&tab=3`) : OpenTypeFun(data)"
|
||||||
class="!py-[30rpx] !px-[24rpx] bg-[#fff] rounded-[8rpx] !flex items-center gap-[20rpx] overflow-hidden relative !mb-[20rpx]">
|
class="!py-[30rpx] !px-[24rpx] bg-[#fff] rounded-[8rpx] !flex items-center gap-[20rpx] overflow-hidden relative !mb-[20rpx]">
|
||||||
<image class="!size-[72rpx] flex-shrink-0" mode="aspectFill" :src="messageIcon"></image>
|
<image class="!size-[72rpx] flex-shrink-0" mode="aspectFill" :src="messageIcon"></image>
|
||||||
<view class="flex-grow !flex flex-col gap-[12rpx]">
|
<view class="flex-grow !flex flex-col gap-[12rpx]">
|
||||||
|
|||||||
@@ -54,7 +54,8 @@ const {loading, pagination, initFetchData, fetchData} = useTableQuery({
|
|||||||
<view class="px-[24rpx] py-[16rpx] bg-[#fff] rounded-[8rpx]" v-if="v.pattern===1">
|
<view class="px-[24rpx] py-[16rpx] bg-[#fff] rounded-[8rpx]" v-if="v.pattern===1">
|
||||||
<view v-html="v.content"></view>
|
<view v-html="v.content"></view>
|
||||||
<view v-if="v.image_arr.length > 0">
|
<view v-if="v.image_arr.length > 0">
|
||||||
<x-image v-for="v in v.image_arr"></x-image>
|
<x-image v-for="v in v.image_arr" :src="v"
|
||||||
|
style="width: 70rpx;height: 70rpx"></x-image>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="px-[24rpx] py-[16rpx] bg-[#fff] rounded-[8rpx] test-24r text-[#4E5969]" v-else>
|
<view class="px-[24rpx] py-[16rpx] bg-[#fff] rounded-[8rpx] test-24r text-[#4E5969]" v-else>
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<script setup>
|
<script setup>
|
||||||
import goodsIcon from '../../static/icons/goodsIcon.png';
|
import goodsIcon from '../../static/icons/goodsIcon.png';
|
||||||
import XNav from "../../components/XNav.vue";
|
import XNav from "../../components/XNav.vue";
|
||||||
import {computed, defineAsyncComponent, getCurrentInstance, nextTick, onMounted, ref} from 'vue';
|
import {computed, defineAsyncComponent, getCurrentInstance, nextTick, onMounted, ref, reactive} from 'vue';
|
||||||
import {onLoad} from "@dcloudio/uni-app";
|
import {onLoad} from "@dcloudio/uni-app";
|
||||||
import XLink from "../../components/XLink.vue";
|
import XLink from "../../components/XLink.vue";
|
||||||
import XNoticeBar from "../../components/XNoticeBar.vue";
|
import XNoticeBar from "../../components/XNoticeBar.vue";
|
||||||
@@ -9,10 +9,12 @@ import XImage from "../../components/XImage.vue";
|
|||||||
import Api from "../../api/index.js";
|
import Api from "../../api/index.js";
|
||||||
import dayjs from "dayjs";
|
import dayjs from "dayjs";
|
||||||
import XPrompt from "../../components/XPrompt.vue";
|
import XPrompt from "../../components/XPrompt.vue";
|
||||||
import {numberToCharacter, toPage} from "../../utils/uils.js";
|
import {numberToCharacter} from "../../utils/uils.js";
|
||||||
import AcceptAssignmentModal from "../../components/AcceptAssignmentModal.vue";
|
import AcceptAssignmentModal from "../../components/AcceptAssignmentModal.vue";
|
||||||
import ICON from "../../static/icons/prompt.png";
|
import ICON from "../../static/icons/prompt.png";
|
||||||
import XConfirmModal from "../../components/XConfirmModal.vue";
|
import XConfirmModal from "../../components/XConfirmModal.vue";
|
||||||
|
import LeftMenu from "../../components/LeftMenu.vue";
|
||||||
|
import {v4} from "uuid";
|
||||||
|
|
||||||
// #ifdef APP-PLUS
|
// #ifdef APP-PLUS
|
||||||
// #endif
|
// #endif
|
||||||
@@ -24,11 +26,13 @@ const MyBackfill = defineAsyncComponent(() => import('./components/MyBackfill.vu
|
|||||||
const ReviewCommunication = defineAsyncComponent(() => import('./components/ReviewCommunication.vue'));
|
const ReviewCommunication = defineAsyncComponent(() => import('./components/ReviewCommunication.vue'));
|
||||||
// #endif
|
// #endif
|
||||||
|
|
||||||
|
const ScrollViewRef = ref();
|
||||||
const details = ref(null);
|
const details = ref(null);
|
||||||
const home = ref(false);
|
const home = ref(false);
|
||||||
const showInitModal = ref(false);
|
const showInitModal = ref(false);
|
||||||
const mainDetailWidth = ref(0);
|
const mainDetailWidth = ref(0);
|
||||||
const currentTabs = ref(0);
|
const currentTabs = ref(0);
|
||||||
|
const HTYQ = ref();
|
||||||
const tabs = computed(() => [
|
const tabs = computed(() => [
|
||||||
{
|
{
|
||||||
name: "任务详情",
|
name: "任务详情",
|
||||||
@@ -50,6 +54,45 @@ const tabs = computed(() => [
|
|||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
const delta = ref(1);
|
const delta = ref(1);
|
||||||
|
const menuTabs = reactive([
|
||||||
|
{
|
||||||
|
id: v4(),
|
||||||
|
name1: '案例',
|
||||||
|
name2: '概览',
|
||||||
|
scroll: 'mainDetailBox',
|
||||||
|
now: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: v4(),
|
||||||
|
name1: '回填',
|
||||||
|
name2: '要求',
|
||||||
|
scroll: 'HTYQ',
|
||||||
|
now: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: v4(),
|
||||||
|
name1: '时间',
|
||||||
|
name2: '要求',
|
||||||
|
scroll: 'SJYQ',
|
||||||
|
now: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: v4(),
|
||||||
|
name1: '扣款',
|
||||||
|
name2: '说明',
|
||||||
|
scroll: 'KKSM',
|
||||||
|
value: 9999,
|
||||||
|
now: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: v4(),
|
||||||
|
name1: '其他',
|
||||||
|
name2: '说明',
|
||||||
|
scroll: 'QTSM',
|
||||||
|
value: 9999,
|
||||||
|
now: false,
|
||||||
|
},
|
||||||
|
]);
|
||||||
|
|
||||||
const getData = async (id, task_children_id) => {
|
const getData = async (id, task_children_id) => {
|
||||||
const {data} = await Api.system.getTaskinfo(id || details.value.id, task_children_id || details.value?.children?.id);
|
const {data} = await Api.system.getTaskinfo(id || details.value.id, task_children_id || details.value?.children?.id);
|
||||||
@@ -65,332 +108,375 @@ onLoad((options) => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
nextTick(() => {
|
setTimeout(() => {
|
||||||
const instancs = getCurrentInstance();
|
const instancs = getCurrentInstance();
|
||||||
uni.createSelectorQuery()
|
let ALGL = 0;
|
||||||
.in(instancs)
|
let HTYQ = 0;
|
||||||
.select("#mainDetailBox")
|
let SJYQ = 0;
|
||||||
.boundingClientRect()
|
|
||||||
.exec((result) => {
|
const mainDetailBox = document.querySelector('#mainDetailBox');
|
||||||
mainDetailWidth.value = result[0].width;
|
const taskHeader = document.querySelector('#taskHeader');
|
||||||
})
|
const fbyq = document.querySelector('#FBYQ');
|
||||||
});
|
const htyq = document.querySelector('#HTYQ');
|
||||||
|
mainDetailWidth.value = mainDetailBox.clientWidth;
|
||||||
|
ALGL += taskHeader.clientHeight + 12.5;
|
||||||
|
HTYQ += ALGL + mainDetailBox.clientHeight + fbyq.clientHeight + 25;
|
||||||
|
SJYQ += HTYQ + htyq.clientHeight + 12.5;
|
||||||
|
|
||||||
|
menuTabs[0].value = ALGL;
|
||||||
|
menuTabs[1].value = HTYQ;
|
||||||
|
menuTabs[2].value = SJYQ;
|
||||||
|
}, 500);
|
||||||
if (home.value) showInitModal.value = true;
|
if (home.value) showInitModal.value = true;
|
||||||
})
|
})
|
||||||
|
const scrollState = reactive({
|
||||||
|
top: 0,
|
||||||
|
});
|
||||||
|
const topTop = () => {
|
||||||
|
scrollState.top = 10;
|
||||||
|
nextTick(() => {
|
||||||
|
scrollState.top = 0;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
const setScroll = (value) => {
|
||||||
|
nextTick(() => {
|
||||||
|
scrollState.top = value;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
const scroll = ({detail: {scrollTop}}) => {
|
||||||
|
let last = menuTabs[0];
|
||||||
|
for (const k of menuTabs) {
|
||||||
|
if (scrollTop + 300 > k.value) {
|
||||||
|
last = k;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
menuTabs.forEach(v => v.now = false);
|
||||||
|
menuTabs.find(v => v.id === last.id).now = true;
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<!--任务详情-->
|
<!--任务详情-->
|
||||||
<XNav :delta="delta"></XNav>
|
<XNav :delta="delta"></XNav>
|
||||||
<x-notice-bar></x-notice-bar>
|
<x-notice-bar></x-notice-bar>
|
||||||
|
<left-menu :tabs="menuTabs" @top="topTop" @setScroll="setScroll"></left-menu>
|
||||||
|
|
||||||
<view class="!p-[20rpx] !flex flex-col gap-[20rpx] box-border" v-if="details">
|
<scroll-view
|
||||||
<view class="rounded-[16rpx] !p-[24rpx] bg-[#fff] !flex flex-col gap-[20rpx]">
|
scroll-y
|
||||||
<view class="!flex gap-[30rpx]">
|
@scroll="scroll"
|
||||||
<image class="!size-[84rpx]" :src="goodsIcon"></image>
|
scroll-with-animation
|
||||||
<view class="flex-grow">
|
:scroll-top="scrollState.top"
|
||||||
<view class="goods-title !w-full !flex items-center justify-between">
|
class="h-[calc(100vh-180rpx)]"
|
||||||
{{ details.goods_name }}
|
v-if="details">
|
||||||
<view :class="['goods-state']" v-if="!home && details.is_use !== 0">{{
|
<view class="!p-[20rpx] !flex flex-col gap-[20rpx] box-border">
|
||||||
details.status_text
|
<view id="taskHeader" class="rounded-[16rpx] !p-[24rpx] bg-[#fff] !flex flex-col gap-[20rpx]">
|
||||||
}}
|
<view class="!flex gap-[30rpx]">
|
||||||
|
<image class="!size-[84rpx]" :src="goodsIcon"></image>
|
||||||
|
<view class="flex-grow">
|
||||||
|
<view class="goods-title !w-full !flex items-center justify-between">
|
||||||
|
{{ details.goods_name }}
|
||||||
|
<view :class="['goods-state']" v-if="!home && details.is_use !== 0">{{
|
||||||
|
details.status_text
|
||||||
|
}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="home || details.is_use === 0" class="goods-bh">
|
||||||
|
{{ dayjs(details.end_time).format('YYYY-MM-DD HH:mm') }} 前可领取
|
||||||
|
</view>
|
||||||
|
<view v-else class="goods-bh">
|
||||||
|
任务编号:{{ !home && details.is_use === 0 ? details.code : details.children.uid }}
|
||||||
|
<x-link>复制</x-link>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view v-if="home || details.is_use === 0" class="goods-bh">
|
</view>
|
||||||
{{ dayjs(details.end_time).format('YYYY-MM-DD HH:mm') }} 前可领取
|
|
||||||
|
<view
|
||||||
|
v-if="!home && details.is_use !== 0"
|
||||||
|
class="bg-[#F7F8FA] px-[28rpx] py-[16rpx] rounded-[8rpx] !flex justify-around"
|
||||||
|
style="font-size: 24rpx">
|
||||||
|
<view>发布账号</view>
|
||||||
|
<view class="bg-[#E5E6EB] w-[5rpx] h-auto"></view>
|
||||||
|
<view>昵称: {{ details.children?.account?.nickname }}</view>
|
||||||
|
<view class="bg-[#E5E6EB] w-[5rpx] h-auto"></view>
|
||||||
|
<view>账号: {{ details.children?.account?.account }}</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="!grid grid-cols-4 gap-[20rpx]">
|
||||||
|
<view class="bg-[#E8F3FF] px-[26rpx] py-[20rpx] rounded-[8rpx]">
|
||||||
|
<view class="goods-st">{{ details.platform }}</view>
|
||||||
|
<view class="goods-st-info">发布平台</view>
|
||||||
</view>
|
</view>
|
||||||
<view v-else class="goods-bh">
|
<view class="bg-[#E8F3FF] px-[26rpx] py-[20rpx] rounded-[8rpx]">
|
||||||
任务编号:{{ !home && details.is_use === 0 ? details.code : details.children.uid }}
|
<view class="goods-st whitespace-nowrap">¥ {{ details.real_price.toFixed(2) }}</view>
|
||||||
<x-link>复制</x-link>
|
<view class="goods-st-info">任务报酬</view>
|
||||||
|
</view>
|
||||||
|
<view class="bg-[#E8F3FF] px-[26rpx] py-[20rpx] rounded-[8rpx]">
|
||||||
|
<view class="goods-st">{{ details.material_name }}</view>
|
||||||
|
<view class="goods-st-info">素材类型</view>
|
||||||
|
</view>
|
||||||
|
<view class="bg-[#E8F3FF] px-[26rpx] py-[20rpx] rounded-[8rpx]">
|
||||||
|
<view class="goods-st">{{ details.children_num }}</view>
|
||||||
|
<view class="goods-st-info">剩余名额</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
|
||||||
|
|
||||||
<view
|
<view class="!flex flex-col gap-[10px]">
|
||||||
v-if="!home && details.is_use !== 0"
|
<view class="!flex px-[10px] py-[12px] bg-[#F2F3F5] gap-[8px] items-center">
|
||||||
class="bg-[#F7F8FA] px-[28rpx] py-[16rpx] rounded-[8rpx] !flex justify-around"
|
<view class="text-[#4E5969] test-24r !flex items-center gap-[5px]">
|
||||||
style="font-size: 24rpx">
|
安全评分:
|
||||||
<view>发布账号</view>
|
<x-prompt
|
||||||
<view class="bg-[#E5E6EB] w-[5rpx] h-auto"></view>
|
info="由该任务或类似任务的历史禁言率、素材是否绿色决定。分值越高,说明完成任务对账号影响最小"
|
||||||
<view>昵称: {{ details.children?.account?.nickname }}</view>
|
title="分值说明">
|
||||||
<view class="bg-[#E5E6EB] w-[5rpx] h-auto"></view>
|
|
||||||
<view>账号: {{ details.children?.account?.account }}</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="!grid grid-cols-4 gap-[20rpx]">
|
|
||||||
<view class="bg-[#E8F3FF] px-[26rpx] py-[20rpx] rounded-[8rpx]">
|
|
||||||
<view class="goods-st">{{ details.platform }}</view>
|
|
||||||
<view class="goods-st-info">发布平台</view>
|
|
||||||
</view>
|
|
||||||
<view class="bg-[#E8F3FF] px-[26rpx] py-[20rpx] rounded-[8rpx]">
|
|
||||||
<view class="goods-st whitespace-nowrap">¥ {{ details.real_price.toFixed(2) }}</view>
|
|
||||||
<view class="goods-st-info">任务报酬</view>
|
|
||||||
</view>
|
|
||||||
<view class="bg-[#E8F3FF] px-[26rpx] py-[20rpx] rounded-[8rpx]">
|
|
||||||
<view class="goods-st">{{ details.material_name }}</view>
|
|
||||||
<view class="goods-st-info">素材类型</view>
|
|
||||||
</view>
|
|
||||||
<view class="bg-[#E8F3FF] px-[26rpx] py-[20rpx] rounded-[8rpx]">
|
|
||||||
<view class="goods-st">{{ details.children_num }}</view>
|
|
||||||
<view class="goods-st-info">剩余名额</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="!flex flex-col gap-[10px]">
|
|
||||||
<view class="!flex px-[10px] py-[12px] bg-[#F2F3F5] gap-[8px] items-center">
|
|
||||||
<view class="text-[#4E5969] test-24r !flex items-center gap-[5px]">
|
|
||||||
安全评分:
|
|
||||||
<x-prompt
|
|
||||||
info="由该任务或类似任务的历史禁言率、素材是否绿色决定。分值越高,说明完成任务对账号影响最小"
|
|
||||||
title="分值说明">
|
|
||||||
</x-prompt>
|
|
||||||
</view>
|
|
||||||
<view class="!flex items-center gap-[5px]">
|
|
||||||
<view class="text-[#165DFF]">{{ details.security_level }}分</view>
|
|
||||||
<view class="test-24r">{{ details.security_text }}</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="!flex px-[10px] py-[12px] bg-[#F2F3F5] gap-[8px] items-center">
|
|
||||||
<view class="text-[#4E5969] test-24r !flex items-center gap-[5px]">
|
|
||||||
耗时评分:
|
|
||||||
<x-prompt
|
|
||||||
info="由该任务完整完成所需要的时间和操作步骤决定。分值越高,说明完成任务越简单"
|
|
||||||
title="分值说明">
|
|
||||||
</x-prompt>
|
|
||||||
</view>
|
|
||||||
<view class="!flex items-center gap-[5px]">
|
|
||||||
<view class="text-[#165DFF]">{{ details.time_level }}分</view>
|
|
||||||
<view class="test-24r">{{ details.time_text }}</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view id="mainDetailBox" class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden">
|
|
||||||
<tui-tabs
|
|
||||||
v-if="mainDetailWidth && (!home && details.is_use !== 0)"
|
|
||||||
:tabs="tabs"
|
|
||||||
:currentTab="currentTabs"
|
|
||||||
:width="mainDetailWidth"
|
|
||||||
@change="({index})=>currentTabs=index">
|
|
||||||
</tui-tabs>
|
|
||||||
|
|
||||||
<view :style="{padding: currentTabs===3?'0':'24rpx'}">
|
|
||||||
<Suspense>
|
|
||||||
<template #default>
|
|
||||||
<div class="h-full flex flex-col items-start">
|
|
||||||
<component :is="tabs[currentTabs].component" :data="details" @success="getData"
|
|
||||||
:home="home"></component>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #fallback>
|
|
||||||
加载中...
|
|
||||||
</template>
|
|
||||||
</Suspense>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<template v-if="currentTabs === 0">
|
|
||||||
<view class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
|
||||||
<view class="w-full">
|
|
||||||
<view class="title">
|
|
||||||
发布要求
|
|
||||||
</view>
|
|
||||||
<view class="block items-center">
|
|
||||||
<view class="block-title">发布平台:</view>
|
|
||||||
<view class="block-info">
|
|
||||||
{{ details.platform }}
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="block items-center">
|
|
||||||
<view class="block-title">发布方式:</view>
|
|
||||||
<view class="block-info">
|
|
||||||
{{
|
|
||||||
numberToCharacter(details.fb_num - 1)
|
|
||||||
}}连发/{{ details.is_identical === 0 ? '每次不同' : '每次相同' }}
|
|
||||||
<x-prompt title="发布方式说明">
|
|
||||||
<template #info>
|
|
||||||
<view>
|
|
||||||
领取素材后,按照要求,连续发布
|
|
||||||
<text class="text-[#FF7D00]">{{ details.fb_num }}遍</text>
|
|
||||||
,每遍素材
|
|
||||||
<text class="text-[#FF7D00]">
|
|
||||||
{{ details.is_identical === 0 ? '不同' : '相同' }}
|
|
||||||
</text>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
</x-prompt>
|
</x-prompt>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
<view class="!flex items-center gap-[5px]">
|
||||||
<view class="block items-center">
|
<view class="text-[#165DFF]">{{ details.security_level }}分</view>
|
||||||
<view class="block-title">每次间隔时长:</view>
|
<view class="test-24r">{{ details.security_text }}</view>
|
||||||
<view class="block-info">
|
|
||||||
{{ details.duration }}分钟
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="block">
|
<view class="!flex px-[10px] py-[12px] bg-[#F2F3F5] gap-[8px] items-center">
|
||||||
<view class="block-title">特殊要求:</view>
|
<view class="text-[#4E5969] test-24r !flex items-center gap-[5px]">
|
||||||
<view class="block-info gap-[20rpx]">
|
耗时评分:
|
||||||
<view>{{ details.special_text }}</view>
|
<x-prompt
|
||||||
<view class="!grid grid-cols-3 !mt-[12rpx]">
|
info="由该任务完整完成所需要的时间和操作步骤决定。分值越高,说明完成任务越简单"
|
||||||
<x-image
|
title="分值说明">
|
||||||
v-for="(v, index) in details.special_images_arr"
|
</x-prompt>
|
||||||
:key="index"
|
|
||||||
class="!size-[96rpx]"
|
|
||||||
:src="v"
|
|
||||||
mode="aspectFill"
|
|
||||||
:draggable="false">
|
|
||||||
</x-image>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
<view class="!flex items-center gap-[5px]">
|
||||||
<view class="block items-center">
|
<view class="text-[#165DFF]">{{ details.time_level }}分</view>
|
||||||
<view class="block-title">ip限制:</view>
|
<view class="test-24r">{{ details.time_text }}</view>
|
||||||
<view class="block-info">
|
|
||||||
{{ details.choose_area_arr.join(',') }}
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
<view id="mainDetailBox" class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden">
|
||||||
<view class="w-full">
|
<tui-tabs
|
||||||
<view class="title">
|
v-if="mainDetailWidth && (!home && details.is_use !== 0)"
|
||||||
回填要求
|
:tabs="tabs"
|
||||||
</view>
|
:currentTab="currentTabs"
|
||||||
<view
|
:width="mainDetailWidth"
|
||||||
v-for="(v,index) in details.task_content"
|
@change="({index})=>currentTabs=index">
|
||||||
:key="v.id"
|
</tui-tabs>
|
||||||
class="block flex-col">
|
|
||||||
<view class="block-title">第{{ index + 1 }}次回填:</view>
|
<view :style="{padding: currentTabs===3?'0':'24rpx'}">
|
||||||
<view class="block-info !flex w-full">
|
<Suspense>
|
||||||
<view
|
<template #default>
|
||||||
class="bg-[#F7F8FA] py-[12rpx] px-[20rpx] border-1 border-[rgb(229,230,235)] w-[60%] whitespace-nowrap">
|
<div class="h-full flex flex-col items-start">
|
||||||
{{ dayjs(v.start_time).format('MMDD-HH:mm') }} 至
|
<component :is="tabs[currentTabs].component" :data="details" @success="getData"
|
||||||
{{ dayjs(v.end_time).format('MMDD-HH:mm') }}之间
|
:home="home"></component>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<template #fallback>
|
||||||
|
加载中...
|
||||||
|
</template>
|
||||||
|
</Suspense>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<template v-if="currentTabs === 0">
|
||||||
|
<view id="FBYQ" class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
||||||
|
<view class="w-full">
|
||||||
|
<view class="title">
|
||||||
|
发布要求
|
||||||
|
</view>
|
||||||
|
<view class="block items-center">
|
||||||
|
<view class="block-title">发布平台:</view>
|
||||||
|
<view class="block-info">
|
||||||
|
{{ details.platform }}
|
||||||
</view>
|
</view>
|
||||||
<view
|
</view>
|
||||||
class="bg-[#F7F8FA] py-[12rpx] px-[20rpx] border-1 border-[rgb(229,230,235)] flex-grow">
|
<view class="block items-center">
|
||||||
{{ v.content }}
|
<view class="block-title">发布方式:</view>
|
||||||
<view class="!inline-block">
|
<view class="block-info">
|
||||||
|
{{
|
||||||
|
numberToCharacter(details.fb_num - 1)
|
||||||
|
}}连发/{{ details.is_identical === 0 ? '每次不同' : '每次相同' }}
|
||||||
|
<x-prompt title="发布方式说明">
|
||||||
|
<template #info>
|
||||||
|
<view>
|
||||||
|
领取素材后,按照要求,连续发布
|
||||||
|
<text class="text-[#FF7D00]">{{ details.fb_num }}遍</text>
|
||||||
|
,每遍素材
|
||||||
|
<text class="text-[#FF7D00]">
|
||||||
|
{{ details.is_identical === 0 ? '不同' : '相同' }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</x-prompt>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="block items-center">
|
||||||
|
<view class="block-title">每次间隔时长:</view>
|
||||||
|
<view class="block-info">
|
||||||
|
{{ details.duration }}分钟
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="block">
|
||||||
|
<view class="block-title">特殊要求:</view>
|
||||||
|
<view class="block-info gap-[20rpx]">
|
||||||
|
<view>{{ details.special_text }}</view>
|
||||||
|
<view class="!grid grid-cols-3 !mt-[12rpx]">
|
||||||
<x-image
|
<x-image
|
||||||
:src="v.ts_images_arr[0]"
|
v-for="(v, index) in details.special_images_arr"
|
||||||
:list="v.ts_images_arr">
|
:key="index"
|
||||||
<image class="!size-[24rpx]" :src="ICON" mode="aspectFill"></image>
|
class="!size-[96rpx]"
|
||||||
|
:src="v"
|
||||||
|
mode="aspectFill"
|
||||||
|
:draggable="false">
|
||||||
</x-image>
|
</x-image>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
<view class="block items-center">
|
||||||
|
<view class="block-title">ip限制:</view>
|
||||||
|
<view class="block-info">
|
||||||
|
{{ details.choose_area_arr.join(',') }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view id="HTYQ" ref="HTYQ" class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
||||||
|
<view class="w-full">
|
||||||
|
<view class="title">
|
||||||
|
回填要求
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
v-for="(v,index) in details.task_content"
|
||||||
|
:key="v.id"
|
||||||
|
class="block flex-col">
|
||||||
|
<view class="block-title">第{{ index + 1 }}次回填:</view>
|
||||||
|
<view class="block-info !flex w-full">
|
||||||
|
<view
|
||||||
|
class="bg-[#F7F8FA] py-[12rpx] px-[20rpx] border-1 border-[rgb(229,230,235)] w-[60%] whitespace-nowrap">
|
||||||
|
{{ dayjs(v.start_time).format('MMDD-HH:mm') }} 至
|
||||||
|
{{ dayjs(v.end_time).format('MMDD-HH:mm') }}之间
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
class="bg-[#F7F8FA] py-[12rpx] px-[20rpx] border-1 border-[rgb(229,230,235)] flex-grow">
|
||||||
|
{{ v.content }}
|
||||||
|
<view class="!inline-block">
|
||||||
|
<x-image
|
||||||
|
:src="v.ts_images_arr[0]"
|
||||||
|
:list="v.ts_images_arr">
|
||||||
|
<image class="!size-[24rpx]" :src="ICON" mode="aspectFill"></image>
|
||||||
|
</x-image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
<view id="SJYQ" class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
||||||
<view class="w-full">
|
<view class="w-full">
|
||||||
<view class="title">
|
<view class="title">
|
||||||
时间要求
|
时间要求
|
||||||
</view>
|
|
||||||
<view class="block items-center">
|
|
||||||
<view class="block-title">作品保留时间:</view>
|
|
||||||
<view class="block-info">
|
|
||||||
{{ details.retention_time }} {{ details.retention_type === 1 ? '分钟' : '小时' }}
|
|
||||||
<x-prompt title="保留时间说明">
|
|
||||||
<template #info>
|
|
||||||
<view>
|
|
||||||
该任务结算后,要保留
|
|
||||||
<text class="text-[#FF7D00]">{{ details.retention_time }}
|
|
||||||
{{ details.retention_type === 1 ? '分钟' : '小时' }}
|
|
||||||
</text>
|
|
||||||
。
|
|
||||||
<view>到期请自行删除,避免违规。若提前删除,将影响后续收益</view>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
</x-prompt>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
<view class="block items-center">
|
||||||
<view class="block-extend">
|
<view class="block-title">作品保留时间:</view>
|
||||||
*若未到保留时间,提前删除。有对应惩罚
|
<view class="block-info">
|
||||||
</view>
|
{{ details.retention_time }} {{ details.retention_type === 1 ? '分钟' : '小时' }}
|
||||||
<view class="block items-center">
|
<x-prompt title="保留时间说明">
|
||||||
<view class="block-title !w-[300rpx]">每次回填将在该时间内审核:</view>
|
<template #info>
|
||||||
<view class="block-info">
|
<view>
|
||||||
{{ details.check_time }} {{ details.check_type === 1 ? '分钟' : '小时' }}内
|
该任务结算后,要保留
|
||||||
<x-prompt
|
<text class="text-[#FF7D00]">{{ details.retention_time }}
|
||||||
title="审核时间说明"
|
{{ details.retention_type === 1 ? '分钟' : '小时' }}
|
||||||
:info="`回填后,我们将于${details.check_time}${details.check_type === 1 ? '分钟' : '小时'}内完成审核,超时自动通过`">
|
</text>
|
||||||
</x-prompt>
|
。
|
||||||
</view>
|
<view>到期请自行删除,避免违规。若提前删除,将影响后续收益</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="block-extend">
|
</template>
|
||||||
*若您的回填,未在上述时间内审核,可在沟通中,发起申诉
|
</x-prompt>
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
|
||||||
<view class="w-full">
|
|
||||||
<view class="title">
|
|
||||||
扣款说明
|
|
||||||
</view>
|
|
||||||
<view
|
|
||||||
v-for="(v, index) in details.settlement"
|
|
||||||
:key="v.id"
|
|
||||||
class="block !flex !gap-0">
|
|
||||||
<view class="test-24r px-[20rpx] py-[12rpx] bg-[#F7F8FA] border-1 border-[rgb(229,230,235)]">
|
|
||||||
{{ index + 1 }}.
|
|
||||||
</view>
|
|
||||||
<view
|
|
||||||
class="test-24r px-[20rpx] py-[12rpx] bg-[#F7F8FA] border-1 border-[rgb(229,230,235)] flex-grow">
|
|
||||||
{{ v.intro }}
|
|
||||||
</view>
|
|
||||||
<view
|
|
||||||
class="test-24r px-[20rpx] py-[12rpx] bg-[#F7F8FA] border-1 border-[rgb(229,230,235)] whitespace-nowrap">
|
|
||||||
扣除{{ v.ratio }}%收益
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="block-extend">
|
|
||||||
*请认真阅读该说明,商家将按照提前约定的事由扣款
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
|
||||||
<view class="w-full">
|
|
||||||
<view class="title">
|
|
||||||
其他说明
|
|
||||||
</view>
|
|
||||||
<view class="block !flex-col">
|
|
||||||
<view class="test-24r" v-for="(v, index) in details.settlement_arr" :key="index">
|
|
||||||
{{ v.intro }}
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<x-prompt title="信用分说明"
|
|
||||||
info="扣除信用分,将影响您后续接任务以及提现。请按约定完成任务。请在接受任务前认真阅读各要求,有能力完成再接受。">
|
|
||||||
<template #button>
|
|
||||||
<view
|
|
||||||
class="py-[7rpx] px-[32rpx] rounded-full text-[var(--primary-color)] bg-[#E8F3FF] w-fit">
|
|
||||||
查看信用分管理方法
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</view>
|
||||||
</x-prompt>
|
<view class="block-extend">
|
||||||
|
*若未到保留时间,提前删除。有对应惩罚
|
||||||
|
</view>
|
||||||
|
<view class="block items-center">
|
||||||
|
<view class="block-title !w-[300rpx]">每次回填将在该时间内审核:</view>
|
||||||
|
<view class="block-info">
|
||||||
|
{{ details.check_time }} {{ details.check_type === 1 ? '分钟' : '小时' }}内
|
||||||
|
<x-prompt
|
||||||
|
title="审核时间说明"
|
||||||
|
:info="`回填后,我们将于${details.check_time}${details.check_type === 1 ? '分钟' : '小时'}内完成审核,超时自动通过`">
|
||||||
|
</x-prompt>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="block-extend">
|
||||||
|
*若您的回填,未在上述时间内审核,可在沟通中,发起申诉
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
|
||||||
|
|
||||||
<accept-assignment-modal v-if="home || details.is_use === 0" :details="details" @success="getData">
|
<view id="KKSM" class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
||||||
|
<view class="w-full">
|
||||||
|
<view class="title">
|
||||||
|
扣款说明
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
v-for="(v, index) in details.settlement"
|
||||||
|
:key="v.id"
|
||||||
|
class="block !flex !gap-0">
|
||||||
|
<view
|
||||||
|
class="test-24r px-[20rpx] py-[12rpx] bg-[#F7F8FA] border-1 border-[rgb(229,230,235)]">
|
||||||
|
{{ index + 1 }}.
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
class="test-24r px-[20rpx] py-[12rpx] bg-[#F7F8FA] border-1 border-[rgb(229,230,235)] flex-grow">
|
||||||
|
{{ v.intro }}
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
class="test-24r px-[20rpx] py-[12rpx] bg-[#F7F8FA] border-1 border-[rgb(229,230,235)] whitespace-nowrap">
|
||||||
|
扣除{{ v.ratio }}%收益
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="block-extend">
|
||||||
|
*请认真阅读该说明,商家将按照提前约定的事由扣款
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view id="QTSM" class="rounded-[16rpx] bg-[#fff] main-details overflow-hidden !p-[24rpx]">
|
||||||
|
<view class="w-full">
|
||||||
|
<view class="title">
|
||||||
|
其他说明
|
||||||
|
</view>
|
||||||
|
<view class="block !flex-col">
|
||||||
|
<view class="test-24r" v-for="(v, index) in details.settlement_arr" :key="index">
|
||||||
|
{{ v.intro }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<x-prompt title="信用分说明"
|
||||||
|
info="扣除信用分,将影响您后续接任务以及提现。请按约定完成任务。请在接受任务前认真阅读各要求,有能力完成再接受。">
|
||||||
|
<template #button>
|
||||||
|
<view
|
||||||
|
class="py-[7rpx] px-[32rpx] rounded-full text-[var(--primary-color)] bg-[#E8F3FF] w-fit">
|
||||||
|
查看信用分管理方法
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</x-prompt>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<accept-assignment-modal v-if="home || details.is_use === 0" :details="details" @success="getData">
|
||||||
|
<view
|
||||||
|
class="bg-[var(--primary-color)] rounded-[8rpx] py-[26rpx] text-[#fff] !flex justify-center items-center">
|
||||||
|
接受任务
|
||||||
|
</view>
|
||||||
|
</accept-assignment-modal>
|
||||||
|
|
||||||
<view
|
<view
|
||||||
class="bg-[var(--primary-color)] rounded-[8rpx] py-[26rpx] text-[#fff] !flex justify-center items-center">
|
v-else
|
||||||
接受任务
|
class="bg-[#94BFFF] rounded-[8rpx] py-[26rpx] text-[#fff] !flex justify-center items-center">
|
||||||
|
已接受
|
||||||
</view>
|
</view>
|
||||||
</accept-assignment-modal>
|
</template>
|
||||||
|
</view>
|
||||||
<view
|
</scroll-view>
|
||||||
v-else
|
|
||||||
class="bg-[#94BFFF] rounded-[8rpx] py-[26rpx] text-[#fff] !flex justify-center items-center">
|
|
||||||
已接受
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<x-confirm-modal
|
<x-confirm-modal
|
||||||
title="注意"
|
title="注意"
|
||||||
|
|||||||
BIN
src/static/icons/backtop.png
Normal file
BIN
src/static/icons/backtop.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 178 B |
Reference in New Issue
Block a user