117 lines
3.4 KiB
Vue
117 lines
3.4 KiB
Vue
<template>
|
|
<TContainer>
|
|
<TSearch
|
|
v-model="queryParams.likeWork"
|
|
placeholder="搜索客户姓名/手机号码"
|
|
backgroundColor="#F5F5F5"
|
|
showBorder
|
|
@on-input="searchChange"
|
|
/>
|
|
<u-tabs
|
|
:list="tabs"
|
|
:scrollable="false"
|
|
:itemStyle="{ height: '44px', flex: 1 }"
|
|
:activeStyle="{ color: '#0E66FB' }"
|
|
lineWidth="49"
|
|
lineColor="#0E66FB"
|
|
@change="handleChangeTab"
|
|
></u-tabs>
|
|
<view class="flex-1 pt-[24rpx] px-[24rpx] overflow-auto bg-[#F8F8F8]">
|
|
<z-paging
|
|
ref="paging"
|
|
v-model="dataList"
|
|
@query="queryList"
|
|
:fixed="false"
|
|
height="100%"
|
|
>
|
|
<clue-card
|
|
v-for="(item, index) in dataList"
|
|
:key="`${index} + 'unique'`"
|
|
:item="item"
|
|
@handle-update-remark="handleUpdateRemark"
|
|
@refresh-page="refresh"
|
|
/>
|
|
</z-paging>
|
|
</view>
|
|
</TContainer>
|
|
<w-confirm-popup v-model="popupShow" @confirm="handleConfirm">
|
|
<template #content>
|
|
<TTextareaField v-model="contentText" border="surround" :required="false" />
|
|
</template>
|
|
</w-confirm-popup>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { useZPaging } from '@/hooks/useZPaging'
|
|
import { ref, onMounted, shallowRef, computed, onUnmounted } from 'vue'
|
|
import { debounce } from 'lodash-es'
|
|
import clueCard from '@/components/widgets/recruitsale/clue-card.vue'
|
|
import { apiCluseList, apiEditRemark } from '@/api/clue'
|
|
import { converStatusEnum } from '@/enums'
|
|
import { toast } from '@/utils/util'
|
|
import { onLoad, onUnload } from '@dcloudio/uni-app'
|
|
|
|
const tabs = shallowRef([
|
|
{ name: '待领取', value: converStatusEnum.UN_RECEIVED },
|
|
{ name: '转化中', value: converStatusEnum.CONVERTED_PROCESS },
|
|
{ name: '已成交', value: converStatusEnum.CONVERTED },
|
|
{ name: '已战败', value: converStatusEnum.FAILED }
|
|
])
|
|
const activeTab = ref(converStatusEnum.UN_RECEIVED)
|
|
const queryParams = computed(() => {
|
|
const payload = {
|
|
situation: activeTab.value,
|
|
likeWork: ''
|
|
}
|
|
return payload
|
|
})
|
|
const dataList = ref([])
|
|
const { paging, queryList, refresh, changeApi, setParams } = useZPaging(
|
|
queryParams.value,
|
|
apiCluseList,
|
|
() => {}
|
|
)
|
|
const handleChangeTab = item => {
|
|
activeTab.value = item.value
|
|
refresh(queryParams.value)
|
|
}
|
|
const popupShow = ref(false)
|
|
const contentText = ref('')
|
|
const clueId = ref('')
|
|
const handleUpdateRemark = item => {
|
|
const { id, remark } = item
|
|
popupShow.value = true
|
|
contentText.value = remark
|
|
clueId.value = id
|
|
}
|
|
const handleConfirm = async () => {
|
|
try {
|
|
const params = {
|
|
id: clueId.value,
|
|
remark: contentText.value
|
|
}
|
|
await apiEditRemark(params)
|
|
toast('修改备注成功')
|
|
refresh(queryParams.value)
|
|
} catch (error) {}
|
|
}
|
|
function addProgress() {
|
|
refresh(queryParams.value)
|
|
}
|
|
function completeClue() {
|
|
refresh(queryParams.value)
|
|
}
|
|
onLoad(() => {
|
|
uni.$on('addProgress', addProgress)
|
|
uni.$on('completeClue', completeClue)
|
|
})
|
|
onUnload(() => {
|
|
uni.$off('addProgress', addProgress)
|
|
uni.$off('completeClue', completeClue)
|
|
})
|
|
const searchChange = debounce(() => {
|
|
refresh(queryParams.value)
|
|
}, 300)
|
|
</script>
|
|
<style scoped></style>
|