|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
- <div class="h-full flex p-3 flex-col businessDetail">
|
|
|
- <div class="w-full bg-white p-2 mb-2 shadow-md rounded-md flex items-center" v-loading="allLoading.skeletonLoading">
|
|
|
+ <div class="h-full flex p-3 flex-col businessDetail" v-loading="allLoading.skeletonLoading">
|
|
|
+ <div class="w-full bg-white p-2 mb-2 shadow-md rounded-md flex items-center">
|
|
|
<div class="icon mr-4">
|
|
|
<el-link :underline="false" @click="backPath()">
|
|
|
<el-icon class="el-icon--right"><icon-view /></el-icon> 返回商机列表
|
|
@@ -18,12 +18,13 @@
|
|
|
<div class="text-nowrap">{{ item.plan }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="relative rounded-md flex items-center itemPing backGray endStep item pl-6 pr-6 mr-4">
|
|
|
- <el-select v-model="stageStatusVal" placeholder="结束" style="width: 100px" class="selectClas">
|
|
|
+ <div class="relative rounded-md flex items-center itemPing backGray endStep item pl-6 pr-6 mr-4 resetStyle">
|
|
|
+ <el-select v-model="stageStatusVal" placeholder="结束" style="width: 100px" class="selectClas"
|
|
|
+ @change="advanceChange()">
|
|
|
<el-option v-for="(item, index) in stageListOption" :key="index" :label="item.label" :value="item.value" />
|
|
|
</el-select>
|
|
|
</div>
|
|
|
- <div class="bg-[#0052CC] rounded-md text itemPing pl-2 pr-2 flex items-center aloneText">
|
|
|
+ <div class="bg-[#075985] rounded-md text itemPing pl-2 pr-2 flex items-center aloneText" @click="advancementStage()">
|
|
|
<el-link :underline="false">推进至阶段【验证客户】</el-link>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -31,28 +32,47 @@
|
|
|
<div class="flex-1 flex flex-col overflow-y-auto overflow-x-hidden scroll-bar">
|
|
|
<div class="w-full h-auto flex justify-between">
|
|
|
<div class="bg-white shadow-md rounded-md" style="width: 46%;">
|
|
|
- <Information />
|
|
|
+ <Information :information="businessInfo" @refreshData="refreshData" />
|
|
|
</div>
|
|
|
<div class="bg-white ml-2 shadow-md rounded-md flex-1">
|
|
|
- <Attachment />
|
|
|
+ <Attachment :information="businessInfo" @refreshData="refreshData" />
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="w-full h-auto flex justify-between mt-2">
|
|
|
<div class="bg-white shadow-md rounded-md" style="width: 65%;">
|
|
|
- <DetailCompinents :data="detailCompinentsData" :information="businessInfo" :formTaskType="1" :filed="'businessOpportunityId'" :disabledList="['taskType', 'businessOpportunityId']" @refreshData="getDetail" />
|
|
|
+ <DetailCompinents :data="detailCompinentsData" :information="businessInfo" :formTaskType="1"
|
|
|
+ :filed="'businessOpportunityId'" :disabledList="['taskType', 'businessOpportunityId']"
|
|
|
+ @refreshData="getDetail" />
|
|
|
</div>
|
|
|
<div class="bg-white ml-2 shadow-md rounded-md flex-1">
|
|
|
- <OperationRecord />
|
|
|
+ <OperationRecord :information="businessInfo" />
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="w-full h-auto flex justify-between mt-2">
|
|
|
<div class="bg-white shadow-md rounded-md w-full">
|
|
|
- <Products />
|
|
|
+ <Products :information="businessInfo" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
+ <!-- 弹窗 -->
|
|
|
+ <el-dialog v-model="allVisible.advanceVisible" width="800" :show-close="false" top="10vh">
|
|
|
+ <template #header="{ close, titleId, titleClass }">
|
|
|
+ <div class="flex justify-between items-center border-b pb-3 dialog-header">
|
|
|
+ <h4 :id="titleId">{{ allText.advanceText }}原因</h4>
|
|
|
+ <div>
|
|
|
+ <el-button type="primary" :loading="allLoading.advanceSaveLoading" @click="advanceSave(true)">保存</el-button>
|
|
|
+ <el-button @click="advanceClose">取消</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <div class="pt-3">
|
|
|
+ <div>请输入{{ allText.advanceText }}原因</div>
|
|
|
+ <el-input v-model.trim="advanceVal" style="width: 100%" class="pb-3" :placeholder="'请输入'" clearable />
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -79,26 +99,77 @@ type stageListType = {
|
|
|
}
|
|
|
|
|
|
const route = useRoute()
|
|
|
+const globalPopup = inject<GlobalPopup>('globalPopup')
|
|
|
const detailCompinentsData = ref([])
|
|
|
const optionVal = ref<any>('')
|
|
|
const stageStatusVal = ref('')
|
|
|
+const stageStatusValOriginally = ref('')
|
|
|
+const advanceVal = ref('')
|
|
|
const options = ref<optionType[]>([])
|
|
|
const allLoading = reactive({
|
|
|
- skeletonLoading: false
|
|
|
+ skeletonLoading: false,
|
|
|
+ advanceSaveLoading: false
|
|
|
+})
|
|
|
+const allVisible = reactive({
|
|
|
+ advanceVisible: false
|
|
|
+})
|
|
|
+const allText = reactive({
|
|
|
+ advanceText: ''
|
|
|
})
|
|
|
|
|
|
const businessInfo = ref({})
|
|
|
const stageListOption = ref<optionType[]>([])
|
|
|
const stageList = ref<stageListType[]>([])
|
|
|
|
|
|
+function refreshData() {
|
|
|
+ getDetail()
|
|
|
+}
|
|
|
+
|
|
|
+function advancementStage() {
|
|
|
+ console.log('点击了推进阶段')
|
|
|
+ advanceSave(false)
|
|
|
+}
|
|
|
+
|
|
|
+function advanceChange() {
|
|
|
+ stageStatusValOriginally.value = JSON.parse(JSON.stringify(stageStatusVal.value))
|
|
|
+ const item: any = stageListOption.value.find((item) => item.value === stageStatusVal.value)
|
|
|
+ console.log(item)
|
|
|
+ if (item.plan == '0%') {
|
|
|
+ advanceVal.value = ''
|
|
|
+ allText.advanceText = item.label
|
|
|
+ allVisible.advanceVisible = true
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ advanceSave(false)
|
|
|
+}
|
|
|
+
|
|
|
+function advanceClose() {
|
|
|
+ stageStatusVal.value = stageStatusValOriginally.value
|
|
|
+ allVisible.advanceVisible = false
|
|
|
+}
|
|
|
+
|
|
|
+function advanceSave(flag: boolean) {
|
|
|
+ if(!advanceVal && flag) {
|
|
|
+ globalPopup?.showError(`请输入${allText.advanceText}原因`)
|
|
|
+ return
|
|
|
+ }
|
|
|
+ allLoading.advanceSaveLoading = true
|
|
|
+ post('接口', {}).then(() => {
|
|
|
+ globalPopup?.showSuccess('操作成功')
|
|
|
+ getDetail()
|
|
|
+ }).finally(() => {
|
|
|
+ allLoading.advanceSaveLoading = false
|
|
|
+ })
|
|
|
+}
|
|
|
|
|
|
function getDetail() {
|
|
|
- allLoading.skeletonLoading
|
|
|
+ allLoading.skeletonLoading = true
|
|
|
post(BUSIESS_INFO, { id: optionVal.value }).then(({ data }) => {
|
|
|
businessInfo.value = (data || []);
|
|
|
detailCompinentsData.value = data.taskList || []
|
|
|
}).finally(() => {
|
|
|
- allLoading.skeletonLoading
|
|
|
+ allLoading.skeletonLoading = false
|
|
|
})
|
|
|
}
|
|
|
|
|
@@ -123,7 +194,7 @@ function getOptionAll() {
|
|
|
function getSatge() {
|
|
|
post(BUSIESS_GETSATE, {}).then(({ data }) => {
|
|
|
stageList.value = (data || []).sort((a: any, b: any) => { return a.seq - b.seq; }).filter((item: any) => !item.isFinish).map((item: any) => ({ name: item.name, plan: item.plan }))
|
|
|
- stageListOption.value = (data || []).sort((a: any, b: any) => { return a.seq - b.seq; }).filter((item: any) => item.isFinish).map((item: any) => ({ label: item.name, value: item.id }))
|
|
|
+ stageListOption.value = (data || []).sort((a: any, b: any) => { return a.seq - b.seq; }).filter((item: any) => item.isFinish).map((item: any) => ({ label: item.name, value: item.id, plan: item.plan }))
|
|
|
})
|
|
|
}
|
|
|
|
|
@@ -199,7 +270,7 @@ onMounted(() => {
|
|
|
}
|
|
|
</style>
|
|
|
<style lang="scss">
|
|
|
-.businessDetail {
|
|
|
+.resetStyle {
|
|
|
.el-select__wrapper {
|
|
|
background-color: #F4F5F7;
|
|
|
box-shadow: none !important;
|