index.vue 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636
  1. <template>
  2. <div class="h-full flex">
  3. <div class="p-5 w-80 pr-0">
  4. <div class="bg-white w-full h-full shadow-md rounded-md flex flex-col">
  5. <div class="flex-1 p-3 overflow-y-auto">
  6. <el-form :model="businessOpportunityForm" label-width="70px" style="max-width: 600px">
  7. <el-form-item label="商机名称">
  8. <el-input v-model="businessOpportunityForm.name" clearable placeholder="请输入"></el-input>
  9. </el-form-item>
  10. <el-form-item label="商机阶段">
  11. <el-select v-model="businessOpportunityForm.stageId" placeholder="请选择" clearable>
  12. <el-option v-for="item in fixedData.BusinessStage" :key="item.id" :label="item.name" :value="item.id" />
  13. </el-select>
  14. </el-form-item>
  15. <el-form-item label="客户名称">
  16. <el-input v-model="businessOpportunityForm.customerName" clearable placeholder="请输入"></el-input>
  17. </el-form-item>
  18. <el-form-item label="联系人">
  19. <el-input v-model="businessOpportunityForm.contactsName" clearable placeholder="请输入"></el-input>
  20. </el-form-item>
  21. <el-form-item label="产品">
  22. <el-select v-model="businessOpportunityForm.productId" placeholder="请选择" clearable>
  23. <el-option v-for="item in fixedData.ProductArr" :key="item.value" :label="item.label"
  24. :value="item.value" />
  25. </el-select>
  26. </el-form-item>
  27. <el-form-item label="负责人">
  28. <!-- <el-select v-model="businessOpportunityForm.inchargerId" placeholder="请选择" clearable>
  29. <el-option v-for="item in fixedData.Personnel" :key="item.id" :label="item.name" :value="item.id" />
  30. </el-select> -->
  31. <personnel-search v-model="businessOpportunityForm.inchargerId" :size="''"
  32. placeholder="请选择"></personnel-search>
  33. </el-form-item>
  34. <el-form-item label="创建时间">
  35. <el-date-picker v-model="businessOpportunityForm.startTime" type="date" placeholder="请选择"
  36. :clearable="false" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
  37. </el-form-item>
  38. <el-form-item label="">
  39. <el-date-picker v-model="businessOpportunityForm.endTime" type="date" placeholder="请选择" :clearable="false"
  40. format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
  41. </el-form-item>
  42. </el-form>
  43. </div>
  44. <div class="w-full flex p-3 shadow-[0_-3px_5px_0px_rgba(0,0,0,0.2)]">
  45. <El-button class="w-full" @click="resetForm()">重置</El-Button>
  46. <El-button type="primary" class="w-full" @click="searchForBusinessOpportunities()">搜索</El-Button>
  47. </div>
  48. </div>
  49. </div>
  50. <div class="flex-1 p-5 overflow-auto">
  51. <div class="bg-white w-full h-full p-3 shadow-md rounded-md flex flex-col">
  52. <div class="flex justify-between pb-3">
  53. <div>
  54. <el-radio-group v-model="layoutSingleChoice" @change="viewsSwitching">
  55. <el-radio-button label="看板视图" :value="KANBAN_VIEW" />
  56. <el-radio-button label="表格视图" :value="TABLE_VIEW" />
  57. </el-radio-group>
  58. </div>
  59. <div class="justify-end flex">
  60. <el-button v-permission="['businessAddAnEdit']" type="primary"
  61. @click="editNewBusiness(false)">新建商机</el-button>
  62. <el-button type="primary" @click="showVisible('batchTransferVisible')"
  63. :disabled="batchTableData.length <= 0">批量转移</el-button>
  64. <el-button type="primary" v-permission="['businessDelete']" @click="batchDeteleItem()"
  65. :disabled="batchTableData.length <= 0">批量删除</el-button>
  66. <el-button type="primary" @click="showVisible('stageSetVisible')">阶段设置</el-button>
  67. <el-button type="primary" v-permission="['businessRecycle']"
  68. @click="showVisible('deteleBusinessVisible')">回收站</el-button>
  69. <el-button v-permission="['businessImport']" type="primary"
  70. @click="showVisible('importVisible')">导入</el-button>
  71. <el-button v-permission="['businessExport']" type="primary" @click="exportBusinessTableList()"
  72. :loading="allLoading.exoprtLoading">导出</el-button>
  73. </div>
  74. </div>
  75. <!-- 表格视图 -->
  76. <template v-if="layoutSingleChoice == TABLE_VIEW">
  77. <div class="flex-1 w-full overflow-hidden">
  78. <el-table ref="businessTableRef" :data="businessTable" border v-loading="allLoading.businessTableLading"
  79. :show-overflow-tooltip="tableShowOverflowTooltip" @selection-change="changeBatch"
  80. style="width: 100%;height: 100%;">
  81. <el-table-column type="selection" width="55" />
  82. <el-table-column v-for="(item, index) in tableColumn" :prop="item.prop" :label="item.label" :key="index"
  83. :width="item.width">
  84. <template #default="scope">
  85. <div class="table-text-textnowrap" v-if="item.eventName"
  86. @click="dealWithTableColumn(scope.row, item.eventName)">{{ scope.row[item.prop] }}</div>
  87. <template v-else-if="['inchargerName', 'creatorName'].includes(item.prop)">
  88. <TextTranslation translationTypes="userName" :translationValue="scope.row[item.prop]">
  89. </TextTranslation>
  90. </template>
  91. <template v-else>{{ scope.row[item.prop] }}</template>
  92. </template>
  93. </el-table-column>
  94. <el-table-column label="操作" fixed="right" width="200"
  95. v-permission="['businessAddAnEdit', 'tasksAdd', 'businessDelete']">
  96. <template #default="scope">
  97. <el-button link type="primary" size="large" @click="editNewBusiness(scope.row)"
  98. v-permission="['businessAddAnEdit']">编辑</el-button>
  99. <el-button link type="primary" size="large" @click="newTask(scope.row)"
  100. v-permission="['tasksAdd']">新建任务</el-button>
  101. <el-button link type="danger" size="large" @click="businessDeteleItem(scope.row.id, scope.row.name)"
  102. v-permission="['businessDelete']">删除</el-button>
  103. </template>
  104. </el-table-column>
  105. </el-table>
  106. </div>
  107. <div class="flex justify-end pt-3">
  108. <el-pagination layout="total, prev, pager, next, sizes" :page-size="businessOpportunityForm.pageFrom"
  109. @size-change="handleSizeChange" @current-change="handleCurrentChange" :total="businessTotalTable"
  110. :hide-on-single-page="true" />
  111. </div>
  112. </template>
  113. <!-- 看板视图 -->
  114. <template v-else-if="layoutSingleChoice == KANBAN_VIEW">
  115. <div class="flex-1 w-full h-full overflow-hidden">
  116. <kanbanView ref="kanbanViewRef" @kanbanViewClick="kanbanViewClick" />
  117. </div>
  118. </template>
  119. </div>
  120. </div>
  121. <!-- 弹窗 -->
  122. <el-dialog v-model="allVisible.newBusinessisible" width="1000" append-to-body :show-close="false" top="10vh"
  123. :before-close="handleClose">
  124. <template #header="{ close, titleId, titleClass }">
  125. <div class="flex justify-between items-center border-b pb-3 dialog-header">
  126. <h4 :id="titleId">{{ allText.newBusinessisibleText }}</h4>
  127. <div>
  128. <el-button type="primary" :loading="allLoading.newBusinessSaveLading"
  129. :disabled="allLoading.businessSaveLading" @click="editBusiness(true)"
  130. v-if="!businessTemplateValue.id">保存并新建</el-button>
  131. <el-button type="primary" @click="editBusiness(false)" :loading="allLoading.businessSaveLading"
  132. :disabled="allLoading.newBusinessSaveLading">保存</el-button>
  133. <el-button @click="closeVisible('newBusinessisible')">取消</el-button>
  134. </div>
  135. </div>
  136. </template>
  137. <div class="h-[60vh] overflow-y-auto scroll-bar pt-3" v-loading="allLoading.generateFormLading">
  138. <GenerateForm ref="businessTemplateRef" :data="businessTemplate" :value="businessTemplateValue"
  139. :key="businessTemplateKey" />
  140. <div>相关产品</div>
  141. <RelatedProducts ref="relatedProductsRef" :productTableList="productTableList"
  142. :productTableListValue="productTableListValue" />
  143. </div>
  144. </el-dialog>
  145. <!-- 批量转移 -->
  146. <el-dialog v-model="allVisible.batchTransferVisible" width="600" :show-close="false" top="10vh">
  147. <template #header="{ close, titleId, titleClass }">
  148. <div class="flex justify-between items-center border-b pb-3 dialog-header">
  149. <h4 :id="titleId">{{ allText.transferText }}</h4>
  150. <div>
  151. <el-button type="primary" v-loading="allLoading.transferLoading" @click="transferBusiness()">转移</el-button>
  152. <el-button @click="allVisible.batchTransferVisible = false">取消</el-button>
  153. </div>
  154. </div>
  155. </template>
  156. <div class="scroll-bar m-6">
  157. <div class="flex mb-4">
  158. <div class="w-20 flex items-center justify-end pr-4">转移至:</div>
  159. <!-- <el-select v-model="transferPersonnel" placeholder="请选择" class="flex1">
  160. <el-option v-for="item in fixedData.Personnel" :key="item.id" :label="item.name" :value="item.id" />
  161. </el-select> -->
  162. <personnel-search v-model="transferPersonnel" :size="''" placeholder="请选择"></personnel-search>
  163. </div>
  164. <div class="pl-3 text-[#e94a4a]">转移后,将看不到此商机</div>
  165. </div>
  166. </el-dialog>
  167. <!-- 导入 -->
  168. <el-dialog v-model="allVisible.importVisible" width="680" :show-close="false" top="10vh">
  169. <template #header="{ close, titleId, titleClass }">
  170. <div class="flex justify-between items-center border-b pb-3 dialog-header">
  171. <h4 :id="titleId">导入产品</h4>
  172. <div class="flex">
  173. <el-upload class="upload-demo mr-3" :limit="1" :show-file-list="false" accept=".xlsx"
  174. :http-request="importBusiness">
  175. <el-button type="primary" :loading="allLoading.importLoading">导入</el-button>
  176. </el-upload>
  177. <el-button @click="allVisible.importVisible = false">取消</el-button>
  178. </div>
  179. </div>
  180. </template>
  181. <div class="p-8">
  182. <div class="ml-4 mr-4">
  183. <div class="flex items-center">1、点击下载 <el-link type="primary"
  184. @click="downloadTemplate(MODURL, '商机导入模板.xlsx')">商机导入模板.xlsx</el-link></div>
  185. <div class="mt-4">2、填写excel文件、商机名称、商机金额、商机阶段必填</div>
  186. </div>
  187. </div>
  188. </el-dialog>
  189. <!-- 新建任务 -->
  190. <TaskModal :visible="allVisible.taskModalVisible" :edit-form="taskModalForm" :save-loading="taskLoading"
  191. @close="closeVisible('taskModalVisible')" @submit="submitForm" :title="'新建任务'"
  192. :disabled-list="['taskType', 'businessOpportunityId']" />
  193. <!-- 回收站 -->
  194. <DeteleBusiness :visibles="allVisible.deteleBusinessVisible" @closeVisible="closeVisible" />
  195. <!-- 阶段设置 -->
  196. <StageSetting :visibles="allVisible.stageSetVisible" @closeVisible="closeVisible" @change="searchForBusinessOpportunities" />
  197. </div>
  198. </template>
  199. <script lang="ts" setup>
  200. import { ref, reactive, onMounted, inject } from "vue";
  201. import type { ElTable, FormInstance, FormRules, UploadRequestOptions } from 'element-plus'
  202. import { useRouter, useRoute } from "vue-router";
  203. import { GETSYSFILED, MOD, GETPERSONNEL, GETGENERATEFOEM, GETBUSINESSLIST, UPDATEINSET, BUSINESSDETELE, BATCHTRANSFER, MODURL, tableColumn, BUSIESS_GETSATE, URL_IMPOERBUSINESS, BUSIESS_INFO, URL_EXPORTBUSINESS, TABLE_VIEW, KANBAN_VIEW } from './api'
  204. import { GETTABLELIST } from '@/pages/product/api'
  205. import { post, get, uploadFile } from "@/utils/request";
  206. import { getAllListByCode, getFromValue, resetFromValue, getFirstDayOfMonth, createTaskFromType, formatDate, confirmAction, downloadTemplate, downloadFile, judgmentaAmounteEqual } from '@/utils/tools'
  207. import { createTask } from '@/components/TaskModal/taskFunction'
  208. import { formatDateTime } from '@/utils/times'
  209. import { GenerateForm } from '@zmjs/form-design';
  210. import { tableShowOverflowTooltip } from '@/utils/globalVariables'
  211. import RelatedProducts from '@/components/relatedProducts/relatedProducts.vue'
  212. import TaskModal from '@/components/TaskModal/index.vue'
  213. import DeteleBusiness from './component/deteleTables.vue'
  214. import StageSetting from './component/stageSetting.vue'
  215. import { GETTABLELISTPRODUCT } from "../order/api";
  216. import personnelSearch from '@/components/translationComponent/personnelSearch/personnelSearch.vue';
  217. import kanbanView from "./component/kanbanView.vue";
  218. const route = useRoute()
  219. const router = useRouter()
  220. const globalPopup = inject<GlobalPopup>('globalPopup')
  221. const businessTableRef = ref<InstanceType<typeof ElTable>>() // 商机table dom
  222. const businessTotalTable = ref(0)
  223. const businessTemplateRef = ref<typeof GenerateForm>() // 自定义表单dom
  224. const relatedProductsRef = ref<typeof RelatedProducts>()
  225. const businessTemplateValue = ref<any>({})
  226. const businessTemplateKey = ref(1)
  227. const businessTemplate = ref({
  228. config: {},
  229. list: []
  230. }) // 自定义表单数据
  231. const businessTable = ref([])
  232. const allLoading = reactive({
  233. businessTableLading: false,
  234. businessSaveLading: false,
  235. newBusinessSaveLading: false,
  236. transferLoading: false,
  237. importLoading: false,
  238. exoprtLoading: false,
  239. generateFormLading: false
  240. })
  241. const allVisible = reactive({
  242. newBusinessisible: false,
  243. recycleVisible: false,
  244. taskModalVisible: false,
  245. batchTransferVisible: false,
  246. deteleBusinessVisible: false,
  247. stageSetVisible: false,
  248. importVisible: false
  249. })
  250. const allText = reactive({
  251. newBusinessisibleText: '新建商机',
  252. transferText: '转移商机'
  253. }) // 所有文本
  254. const taskModalForm = ref({}) // 任务弹窗表单
  255. const taskLoading = ref<saveLoadingType>("1");
  256. const batchTableData = ref<any>([]) // 批量数据
  257. const transferPersonnel = ref('') // 转移人
  258. const businessOpportunityForm = reactive<businessOpportunityFormType>({
  259. name: '',
  260. stageId: '',
  261. customerName: '',
  262. contactsName: '',
  263. productId: '',
  264. inchargerId: '',
  265. startTime: getFirstDayOfMonth(new Date()),
  266. endTime: formatDate(new Date()),
  267. pageIndex: 1,
  268. pageFrom: 10
  269. })
  270. const fixedData = reactive({
  271. BusinessStage: [] as fixedDataInterface[],
  272. Personnel: [] as personnelInterface[],
  273. ProductArr: [] as productInterface[]
  274. })
  275. const productTableList = ref([])
  276. const productTableListValue = ref([])
  277. const layoutSingleChoice = ref(KANBAN_VIEW)
  278. const kanbanViewRef = ref<any>(null)
  279. function editBusiness(visibles: boolean) {
  280. businessTemplateRef.value?.getData().then((res: any) => {
  281. let productTableListData = relatedProductsRef?.value?.returnData()
  282. console.log(!productTableListData, judgmentaAmounteEqual({ ...businessTemplateValue.value, ...res }, productTableListData))
  283. if (!productTableListData || judgmentaAmounteEqual({ ...businessTemplateValue.value, ...res }, productTableListData)) {
  284. return
  285. }
  286. productTableListData.forEach((item: any) => {
  287. delete item.id
  288. })
  289. let newForm = {
  290. ...res,
  291. expectedTransactionDate: res.expectedTransactionDate ? formatDate(new Date(res.expectedTransactionDate)) : '',
  292. businessItemProductList: productTableListData ? JSON.stringify(productTableListData) : []
  293. }
  294. allLoading.businessSaveLading = true
  295. setTimeout(() => {
  296. post(UPDATEINSET, { ...businessTemplateValue.value, ...newForm }).then((_res) => {
  297. allVisible.newBusinessisible = visibles
  298. globalPopup?.showSuccess('保存成功')
  299. searchForBusinessOpportunities()
  300. }).finally(() => {
  301. allLoading.businessSaveLading = false
  302. })
  303. }, 1500)
  304. }).catch((_err: any) => {
  305. console.log(_err)
  306. globalPopup?.showError('请填写完整')
  307. })
  308. }
  309. function editNewBusiness(item: any) {
  310. showVisible('newBusinessisible')
  311. setTimeout(() => {
  312. businessTemplateKey.value++
  313. if (item) {
  314. allLoading.generateFormLading = true
  315. editProduct(item)
  316. businessTemplateValue.value = editBusinessData(item)
  317. allText.newBusinessisibleText = '编辑商机'
  318. }
  319. if (!item) {
  320. businessTemplateRef.value && businessTemplateRef.value.reset()
  321. businessTemplate.value = businessTemplate.value
  322. businessTemplateValue.value = {}
  323. productTableListValue.value = []
  324. allText.newBusinessisibleText = '新建商机'
  325. }
  326. }, 0)
  327. setTimeout(() => {
  328. allLoading.generateFormLading = false
  329. }, 700)
  330. }
  331. function newTask(item: any) {
  332. const { id } = item
  333. taskModalForm.value = { ...createTaskFromType(1), businessOpportunityId: id, }
  334. showVisible('taskModalVisible')
  335. }
  336. function submitForm(submitData: any, isClose: boolean) { // 任务提交
  337. taskLoading.value = '2'
  338. createTask(submitData, isClose).then((res) => {
  339. const { saveLoading, isClose } = res
  340. taskLoading.value = saveLoading
  341. allVisible.taskModalVisible = isClose
  342. globalPopup?.showSuccess('新增成功')
  343. }).catch((err) => {
  344. const { saveLoading, isClose, message } = err
  345. taskLoading.value = saveLoading
  346. allVisible.taskModalVisible = isClose
  347. globalPopup?.showError(message)
  348. })
  349. }
  350. function transferBusiness() {
  351. const ids = batchTableData.value.map((item: any) => item.id).join(',')
  352. allLoading.transferLoading = true
  353. post(BATCHTRANSFER, { ids, inchargerId: transferPersonnel.value }).then(() => {
  354. transferPersonnel.value = ''
  355. globalPopup?.showSuccess('转移成功')
  356. closeVisible('batchTransferVisible')
  357. searchForBusinessOpportunities()
  358. }).finally(() => {
  359. allLoading.transferLoading = false
  360. })
  361. }
  362. function batchDeteleItem() {
  363. const value = batchTableData.value.map((item: any) => item.id).join(',')
  364. const label = batchTableData.value.map((item: any) => item.name).join(',')
  365. businessDeteleItem(value, label, true)
  366. }
  367. function businessDeteleItem(value: string | number, label: string, batch: boolean = false) {
  368. confirmAction(`确定${batch ? '批量' : ''}删除【${label}】商机吗?`).then(() => {
  369. post(BUSINESSDETELE, { ids: value }).then(res => {
  370. if (res.code != 'ok') {
  371. globalPopup?.showError(res.msg)
  372. return
  373. }
  374. globalPopup?.showSuccess('删除成功')
  375. changeBatch(false)
  376. searchForBusinessOpportunities()
  377. }).catch((err) => {
  378. globalPopup?.showError(err.msg)
  379. })
  380. })
  381. }
  382. async function importBusiness(param: UploadRequestOptions) {
  383. allLoading.importLoading = true
  384. const formData = new FormData();
  385. formData.append('multipartFile', param.file)
  386. const res = await uploadFile(URL_IMPOERBUSINESS, formData).finally(() => {
  387. allLoading.importLoading = false
  388. })
  389. if (res.code == 'ok') {
  390. globalPopup?.showSuccess('导入成功' || '')
  391. searchForBusinessOpportunities()
  392. return
  393. }
  394. globalPopup?.showError(res.msg || '')
  395. }
  396. function exportBusinessTableList() {
  397. allLoading.exoprtLoading = true
  398. let valueForm = getFromValue(businessOpportunityForm)
  399. post(URL_EXPORTBUSINESS, { ...valueForm }).then((res) => {
  400. downloadFile(res.data, '商机表导出.xlsx')
  401. }).finally(() => {
  402. allLoading.exoprtLoading = false
  403. })
  404. }
  405. function viewsSwitching() {
  406. batchTableData.value = []
  407. resetForm()
  408. }
  409. function kanbanViewClick(type: 'multipleChoice' | 'delete' | 'edit' | 'addTask', data: any) {
  410. if(type == 'multipleChoice') {
  411. multipleChoiceBoxSwitching(Array.isArray(data) ? data : [])
  412. }
  413. if(type == 'delete') {
  414. const { id, name = '' } = data
  415. businessDeteleItem(id, name)
  416. }
  417. if(type == 'edit') {
  418. editNewBusiness(data)
  419. }
  420. if(type == 'addTask') {
  421. newTask(data)
  422. }
  423. }
  424. function multipleChoiceBoxSwitching(list: any[] = []) {
  425. batchTableData.value = Array.isArray(list) ? list : []
  426. }
  427. function changeBatch(flag: boolean = true) {
  428. if (flag) {
  429. batchTableData.value = businessTableRef.value && businessTableRef.value.getSelectionRows()
  430. } else {
  431. batchTableData.value = []
  432. businessTableRef.value && businessTableRef.value.clearSelection()
  433. }
  434. }
  435. function editProduct(row: any) {
  436. post(BUSIESS_INFO, { id: row.id }).then(({ data }) => {
  437. const list = (data.businessItemProducts || []).map((item: any) => {
  438. const { id, productName, productId, productCode, unit, unitName, typeName, productType, type, price, inventory, orderProductDetail, num, discount, sellingPrice, sealPrice, totalPrice, quantity } = item
  439. return {
  440. id, productId: productId, productName, productCode, unitName: unit, typeName: productType, type, price, inventory,
  441. num, discount, sealPrice, totalPrice, quantity, sellingPrice
  442. }
  443. })
  444. productTableListValue.value = list
  445. })
  446. }
  447. function editBusinessData(item: any) {
  448. const { name, expectedTransactionDate, amountOfMoney = 0, customerId, contactsId, creatorId, stageId, id, inchargerId, remark } = item
  449. return { name, expectedTransactionDate, amountOfMoney, customerId, contactsId, creatorId, stageId, id, inchargerId, remark }
  450. }
  451. function handleSizeChange(val: number) {
  452. businessOpportunityForm.pageIndex = 1
  453. businessOpportunityForm.pageFrom = val
  454. searchForBusinessOpportunities()
  455. }
  456. function handleCurrentChange(val: number) {
  457. businessOpportunityForm.pageIndex = val
  458. searchForBusinessOpportunities()
  459. }
  460. function showVisible(type: keyof typeof allVisible) { // 显示弹窗
  461. allVisible[type] = true
  462. }
  463. function closeVisible(type: keyof typeof allVisible) {
  464. allVisible[type] = false
  465. }
  466. function handleClose(done: () => void) {
  467. done()
  468. }
  469. function searchForBusinessOpportunities() {
  470. if(layoutSingleChoice.value == TABLE_VIEW) {
  471. getBusinessTableList()
  472. }
  473. if(layoutSingleChoice.value == KANBAN_VIEW) {
  474. const formValue = getFromValue(businessOpportunityForm)
  475. kanbanViewRef.value.searchDashboardView({...formValue})
  476. }
  477. }
  478. function getBusinessTableList() {
  479. const formValue = getFromValue(businessOpportunityForm)
  480. allLoading.businessTableLading = true
  481. post(GETBUSINESSLIST, { ...formValue }).then((res) => {
  482. const { data, total } = res.data
  483. businessTable.value = data.map((item: any) => {
  484. return {
  485. ...item,
  486. expectedTransactionDate: formatDate(new Date(item.expectedTransactionDate))
  487. }
  488. })
  489. businessTotalTable.value = total
  490. }).finally(() => {
  491. allLoading.businessTableLading = false
  492. })
  493. }
  494. function resetForm() {
  495. let reset = {
  496. startTime: getFirstDayOfMonth(new Date()),
  497. endTime: formatDate(new Date()),
  498. pageIndex: 1,
  499. pageFrom: 10
  500. }
  501. let newBusinessOpportunityForm = resetFromValue(businessOpportunityForm, { ...reset })
  502. Object.assign(businessOpportunityForm, newBusinessOpportunityForm)
  503. searchForBusinessOpportunities()
  504. }
  505. async function getSystemField() {
  506. // const systemField = getAllListByCode(['商机阶段'])
  507. // for (let i in systemField) {
  508. // const { data } = await get(`${GETSYSFILED}?code=${systemField[i]}`)
  509. // for (let key of Object.keys(fixedData)) {
  510. // if (systemField[i] == key) {
  511. // Object.assign(fixedData, { [key]: data })
  512. // }
  513. // }
  514. // }
  515. const row = await post(BUSIESS_GETSATE, {})
  516. fixedData.BusinessStage = (row.data || []).map((item: any) => {
  517. const { name, id, seq } = item
  518. return { name, id, seq }
  519. }).sort(function (a: any, b: any) { return a.seq - b.seq; });
  520. const { data } = await post(GETPERSONNEL, {})
  521. fixedData.Personnel = data.map((item: any) => {
  522. const { id, name, phone, jobNumber } = item
  523. return {
  524. id, name, phone, jobNumber
  525. }
  526. })
  527. post(GETTABLELISTPRODUCT, { pageIndex: -1, pageSize: -1 }).then(({ data }) => {
  528. fixedData.ProductArr = (data.record || []).map((item: any) => {
  529. const { id, productName } = item
  530. return {
  531. value: id, label: productName
  532. }
  533. })
  534. })
  535. const res = await get(GETGENERATEFOEM)
  536. businessTemplate.value = JSON.parse(res.data[0].config)
  537. }
  538. function toBusinessTableDetail(row: any) {
  539. router.push({
  540. path: `${MOD}/detail`,
  541. query: { id: row.id }
  542. })
  543. }
  544. function dealWithTableColumn(row: any, eventName: string) {
  545. if (eventName == 'toClueTableDetail') {
  546. toBusinessTableDetail(row)
  547. }
  548. }
  549. function getProductTableList() {
  550. post(GETTABLELIST, { pageIndex: -1, pageSize: -1 }).then((res) => {
  551. if (res.code == 'ok') {
  552. const { record, total } = res.data
  553. productTableList.value = record.map((item: any) => {
  554. const { id, productName, productCode, unit, unitName, typeName, type, price, inventory } = item
  555. return {
  556. id,
  557. productId: id,
  558. productName,
  559. productCode,
  560. unit,
  561. unitName,
  562. price,
  563. type,
  564. typeName,
  565. inventory,
  566. quantity: '',
  567. discount: '',
  568. totalPrice: ''
  569. }
  570. })
  571. }
  572. })
  573. }
  574. onMounted(() => {
  575. getSystemField()
  576. getProductTableList()
  577. searchForBusinessOpportunities()
  578. })
  579. </script>
  580. <style lang="scss" scoped>
  581. .dialog-header {
  582. h4 {
  583. font-size: 18px;
  584. line-height: 24px;
  585. }
  586. }
  587. </style>