dailyDetails.vue 34 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024
  1. <template>
  2. <div class="dailyDetails">
  3. <div class="dailyDetailsBox" v-if="setDailyDetailsBoxFlag">
  4. <!-- 顶部条-->
  5. <div class="navBarTOP">
  6. <van-nav-bar class="navBar" title="日报详情" left-arrow @click-left="onClickLeft">
  7. <template #right>
  8. <div
  9. class="shareBtn"
  10. @click="clickShareFlag(-1)"
  11. v-if="reportTarget && source != 'share' && reportTarget.reportPostType == 'fx'">
  12. <van-icon name="share" />
  13. </div>
  14. </template>
  15. </van-nav-bar>
  16. </div>
  17. <div class="lineGrey"></div>
  18. <div class="lineGrey"></div>
  19. <div class="lineGrey"></div>
  20. <div class="lineGrey"></div>
  21. <div class="lineGrey"></div>
  22. <!-- 主体内容-->
  23. <div class="content">
  24. <chatBIReport
  25. :title="title"
  26. :commitTime="reportTarget.commitTime"
  27. :reportId="$route.query.reportId"></chatBIReport>
  28. <div class="container linep">
  29. <van-collapse v-model="activeNames" v-if="!YFQuota">
  30. <!-- YFQuota:应用服务平台 不显示各项指标 -->
  31. <van-collapse-item v-if="!GZQuota" title="拜访数据(实时)" name="7">
  32. <visitedRealTime
  33. :reportTargetAll="reportTargetAll"
  34. :powerGrade="powerGrade"
  35. :JZQuota="JZQuota"></visitedRealTime>
  36. </van-collapse-item>
  37. <van-collapse-item title="建店布机" v-if="!JZQuota && !GZQuota" name="2">
  38. <createStoreBJ :reportTargetAll="reportTargetAll"></createStoreBJ>
  39. </van-collapse-item>
  40. <van-collapse-item v-if="!JZQuota && !GZQuota" name="33" title="下单点数">
  41. <placeOrder :reportTargetAll="reportTargetAll"></placeOrder>
  42. </van-collapse-item>
  43. <van-collapse-item name="16" v-if="!JZQuota && !GZQuota" title="专业时时丽分销店下单">
  44. <ZYPlaceOrder :reportTargetAll="reportTargetAll"></ZYPlaceOrder>
  45. </van-collapse-item>
  46. <van-collapse-item v-if="type != 3 && type != 4" name="1" :title="saptitle">
  47. <performanceSAP
  48. :reportTargetAll="reportTargetAll"
  49. :JZQuota="JZQuota"></performanceSAP>
  50. </van-collapse-item>
  51. <van-collapse-item v-if="GZQuota" name="43" title="纯态之家SAP(千元)">
  52. <van-row style="margin-top: -10px">
  53. <van-col span="12"><span class="leftTitle">本月</span></van-col
  54. ><van-col span="12"><span class="rightTitle">本季</span></van-col>
  55. <van-col span="12"
  56. ><p>
  57. 业绩实际:<span class="colorbalck">{{
  58. Micrometer(reportTargetAll.gzCtzjMonthAct)
  59. }}</span>
  60. </p></van-col
  61. >
  62. <van-col span="12"
  63. ><p>
  64. 业绩实际:<span class="colorbalck">{{
  65. Micrometer(reportTargetAll.gzCtzjQuarterAct)
  66. }}</span>
  67. </p></van-col
  68. >
  69. <van-col span="12"
  70. ><p>
  71. 业绩成长率:<span class="colorbalck"
  72. >{{ reportTargetAll.gzCtzjMonthGrowRate }}%</span
  73. >
  74. </p></van-col
  75. >
  76. <van-col span="12"
  77. ><p>
  78. 业绩成长率:<span class="colorbalck"
  79. >{{ reportTargetAll.gzCtzjQuarterGrowRate }}%</span
  80. >
  81. </p></van-col
  82. >
  83. </van-row>
  84. </van-collapse-item>
  85. <van-collapse-item v-if="GZQuota" name="42" title="商机关联的质感外墙业绩SAP(千元)">
  86. <van-row style="margin-top: -10px">
  87. <van-col span="12"><span class="leftTitle">本月</span></van-col
  88. ><van-col span="12"><span class="rightTitle">本季</span></van-col>
  89. <van-col span="12"
  90. ><p>
  91. 业绩实际:<span class="colorbalck">{{
  92. Micrometer(reportTargetAll.gzZgwqMonthAct)
  93. }}</span>
  94. </p></van-col
  95. >
  96. <van-col span="12"
  97. ><p>
  98. 业绩实际:<span class="colorbalck">{{
  99. Micrometer(reportTargetAll.gzZgwqQuarterAct)
  100. }}</span>
  101. </p></van-col
  102. >
  103. <van-col span="12"
  104. ><p>
  105. 业绩成长率:<span class="colorbalck"
  106. >{{ reportTargetAll.gzZgwqMonthGrowRate }}%</span
  107. >
  108. </p></van-col
  109. >
  110. <van-col span="12"
  111. ><p>
  112. 业绩成长率:<span class="colorbalck"
  113. >{{ reportTargetAll.gzZgwqQuarterGrowRate }}%</span
  114. >
  115. </p></van-col
  116. >
  117. </van-row>
  118. </van-collapse-item>
  119. <van-collapse-item v-if="GZQuota" name="41" title="累计出货有效客户">
  120. <van-row>
  121. <van-col span="12"
  122. ><p>
  123. 全年实际:<span class="colorbalck">{{
  124. Micrometer(reportTargetAll.gzKhljYearAct)
  125. }}</span>
  126. </p></van-col
  127. >
  128. <van-col span="12"
  129. ><p>
  130. 全年目标:<span class="colorbalck">{{
  131. Micrometer(reportTargetAll.gzKhljYearTarget)
  132. }}</span>
  133. </p></van-col
  134. >
  135. <van-col span="12"><p>&nbsp;</p></van-col>
  136. <van-col span="12"
  137. ><p>
  138. 目标达成率:<span class="colorbalck"
  139. >{{ Micrometer(reportTargetAll.gzKhljSuccessRate) }}%</span
  140. >
  141. </p></van-col
  142. >
  143. </van-row>
  144. </van-collapse-item>
  145. <van-collapse-item v-if="GZQuota" name="40" title="今日拜访">
  146. <van-row>
  147. <van-col span="12"
  148. ><p>
  149. 公装客户数:<span class="colorbalck">{{
  150. Micrometer(reportTargetAll.gzVisitCustomerNum)
  151. }}</span>
  152. </p></van-col
  153. >
  154. <van-col span="12"
  155. ><p>
  156. 工地数:<span class="colorbalck">{{
  157. Micrometer(reportTargetAll.gzVisitGdNum)
  158. }}</span>
  159. </p></van-col
  160. >
  161. <van-col span="12"
  162. ><p>
  163. 潜在客户数:<span class="colorbalck">{{
  164. Micrometer(reportTargetAll.gzVisitQzCustomerNum)
  165. }}</span>
  166. </p></van-col
  167. >
  168. </van-row>
  169. </van-collapse-item>
  170. <van-collapse-item v-if="!JZQuota && !GZQuota" name="11" title="专业时时丽SAP(千元)">
  171. <ZYSAP :reportTargetAll="reportTargetAll"></ZYSAP>
  172. </van-collapse-item>
  173. <van-collapse-item v-if="!JZQuota && !GZQuota" name="29" title="瓷砖胶SAP(千元)">
  174. <van-row>
  175. <van-col span="12"><span class="leftTitle">本月业绩</span></van-col
  176. ><van-col span="12"><span class="rightTitle">本季业绩</span></van-col>
  177. <van-col span="12"
  178. ><p>
  179. 实际:<span class="colorbalck">{{
  180. Micrometer(reportTargetAll.czjSapMonthAct)
  181. }}</span>
  182. </p></van-col
  183. >
  184. <van-col span="12"
  185. ><p>
  186. 实际:<span class="colorbalck">{{
  187. Micrometer(reportTargetAll.czjSapQuarterAct)
  188. }}</span>
  189. </p></van-col
  190. >
  191. <van-col span="12"
  192. ><p>
  193. 达成率:<span class="colorbalck"
  194. >{{ reportTargetAll.czjSapMonthSuccessRate }}%</span
  195. >
  196. </p></van-col
  197. >
  198. <van-col span="12"
  199. ><p>
  200. 达成率:<span class="colorbalck"
  201. >{{ reportTargetAll.czjSapQuarterSuccessRate }}%</span
  202. >
  203. </p></van-col
  204. >
  205. <van-col span="12"
  206. ><p>
  207. 成长率:<span class="colorbalck"
  208. >{{ reportTargetAll.czjSapMonthGrowRate }}%</span
  209. >
  210. </p></van-col
  211. >
  212. <van-col span="12"
  213. ><p>
  214. 成长率:<span class="colorbalck"
  215. >{{ reportTargetAll.czjSapQuarterGrowRate }}%</span
  216. >
  217. </p></van-col
  218. >
  219. </van-row>
  220. </van-collapse-item>
  221. <van-collapse-item name="17" v-if="!JZQuota && !GZQuota" title="超好贴分销店下单">
  222. <veryGoodPlaceOrder :reportTargetAll="reportTargetAll"></veryGoodPlaceOrder>
  223. </van-collapse-item>
  224. <van-collapse-item v-if="JZQuota" name="23" title="展厅上样">
  225. <van-row>
  226. <van-col span="24"
  227. ><p>
  228. 当月新增店数:<span class="colorbalck">{{
  229. reportTargetAll.exhibitionHallMonthAct
  230. }}</span>
  231. </p></van-col
  232. >
  233. <van-col span="12"
  234. ><p>
  235. 全年实际店数:<span class="colorbalck"
  236. >{{ Micrometer(reportTargetAll.exhibitionHallYearAct) }}%</span
  237. >
  238. </p></van-col
  239. >
  240. <van-col span="12"
  241. ><p>
  242. 全年达成进度率:<span class="colorbalck"
  243. >{{ reportTargetAll.exhibitionHallYearRate }}%</span
  244. >
  245. </p></van-col
  246. >
  247. </van-row>
  248. </van-collapse-item>
  249. <van-collapse-item v-if="JZQuota" name="22" title="基材粉料过账(千元)">
  250. <van-row>
  251. <van-col span="12"><span class="leftTitle">本月实际</span></van-col>
  252. <van-col span="12"><span class="rightTitle">本季实际</span></van-col>
  253. <van-col span="12"
  254. ><p>
  255. 客户数:<span class="colorbalck">{{ reportTargetAll.jcPostCustomerMonth }}</span>
  256. </p>
  257. </van-col>
  258. <van-col span="12"
  259. ><p>
  260. 客户数:<span class="colorbalck">{{
  261. reportTargetAll.jcPostCustomerQuarter
  262. }}</span>
  263. </p></van-col
  264. >
  265. <van-col span="12"
  266. ><p>
  267. 下单数(包):<span class="colorbalck">{{
  268. reportTargetAll.jcPostOrderNumMonth
  269. }}</span>
  270. </p>
  271. </van-col>
  272. <van-col span="12"
  273. ><p>
  274. 下单数(包):<span class="colorbalck">{{
  275. reportTargetAll.jcPostOrderNumQuarter
  276. }}</span>
  277. </p></van-col
  278. >
  279. <van-col span="12"
  280. ><p>
  281. 下单销售额:<span class="colorbalck">{{
  282. Micrometer(reportTargetAll.jcPostOrderPriceMonth)
  283. }}</span>
  284. </p></van-col
  285. >
  286. <van-col span="12"
  287. ><p>
  288. 下单销售额:<span class="colorbalck">{{
  289. Micrometer(reportTargetAll.jcPostOrderPriceQuarter)
  290. }}</span>
  291. </p></van-col
  292. >
  293. <van-col span="12"
  294. ><p>
  295. 下单率:<span class="colorbalck"
  296. >{{ reportTargetAll.jcPostOrderRateMonth }}%</span
  297. >
  298. </p>
  299. </van-col>
  300. <van-col span="12"
  301. ><p>
  302. 下单率:<span class="colorbalck"
  303. >{{ reportTargetAll.jcPostOrderRateQuarter }}%</span
  304. >
  305. </p></van-col
  306. >
  307. <van-col span="24"><span class="leftTitle">年度累计实际</span></van-col>
  308. <van-col span="24"
  309. ><p>
  310. 客户数:<span class="colorbalck">{{ reportTargetAll.jcPostCustomerYear }}</span>
  311. </p>
  312. </van-col>
  313. <van-col span="24"
  314. ><p>
  315. 下单数(包):<span class="colorbalck">{{
  316. reportTargetAll.jcPostOrderNumYear
  317. }}</span>
  318. </p>
  319. </van-col>
  320. <van-col span="24"
  321. ><p>
  322. 下单销售额:<span class="colorbalck">{{
  323. Micrometer(reportTargetAll.jcPostOrderPriceYear)
  324. }}</span>
  325. </p></van-col
  326. >
  327. <van-col span="24"
  328. ><p>
  329. 下单率:<span class="colorbalck"
  330. >{{ reportTargetAll.jcPostOrderRateYear }}%</span
  331. >
  332. </p>
  333. </van-col>
  334. </van-row>
  335. </van-collapse-item>
  336. <van-collapse-item v-if="JZQuota" name="21" title="魔术漆过账(千元)">
  337. <van-row>
  338. <van-col span="12"><span class="leftTitle">本月实际</span></van-col>
  339. <van-col span="12"><span class="rightTitle">本季实际</span></van-col>
  340. <van-col span="12"
  341. ><p>
  342. 客户数:<span class="colorbalck">{{
  343. reportTargetAll.msqPostCustomerMonth
  344. }}</span>
  345. </p>
  346. </van-col>
  347. <van-col span="12"
  348. ><p>
  349. 客户数:<span class="colorbalck">{{
  350. reportTargetAll.msqPostCustomerQuarter
  351. }}</span>
  352. </p></van-col
  353. >
  354. <van-col span="12"
  355. ><p>
  356. 下单销售额:<span class="colorbalck">{{
  357. Micrometer(reportTargetAll.msqPostOrderPriceMonth)
  358. }}</span>
  359. </p></van-col
  360. >
  361. <van-col span="12"
  362. ><p>
  363. 下单销售额:<span class="colorbalck">{{
  364. Micrometer(reportTargetAll.msqPostOrderPriceQuarter)
  365. }}</span>
  366. </p></van-col
  367. >
  368. <van-col span="12"
  369. ><p>
  370. 下单率:<span class="colorbalck"
  371. >{{ reportTargetAll.msqPostOrderRateMonth }}%</span
  372. >
  373. </p>
  374. </van-col>
  375. <van-col span="12"
  376. ><p>
  377. 下单率:<span class="colorbalck"
  378. >{{ reportTargetAll.msqPostOrderRateQuarter }}%</span
  379. >
  380. </p></van-col
  381. >
  382. <van-col span="24"><span class="leftTitle">年度累计实际</span></van-col>
  383. <van-col span="24"
  384. ><p>
  385. 客户数:<span class="colorbalck">{{ reportTargetAll.msqPostCustomerYear }}</span>
  386. </p>
  387. </van-col>
  388. <van-col span="24"
  389. ><p>
  390. 下单销售额:<span class="colorbalck">{{
  391. Micrometer(reportTargetAll.msqPostOrderPriceYear)
  392. }}</span>
  393. </p></van-col
  394. >
  395. <van-col span="24"
  396. ><p>
  397. 下单率:<span class="colorbalck"
  398. >{{ reportTargetAll.msqPostOrderRateYear }}%</span
  399. >
  400. </p>
  401. </van-col>
  402. </van-row>
  403. </van-collapse-item>
  404. <van-collapse-item title="今日拜访照片" name="10" v-if="reportTarget.photos">
  405. <div v-for="(item, index) in reportTarget.photos" :key="index">
  406. <p style="margin-bottom: 10px; margin-top: 0">{{ item.taskName }}</p>
  407. <van-row gutter="10" class="visitIMG1">
  408. <van-col
  409. span="6"
  410. style="padding-bottom: 10px"
  411. @click="pviewFn(index, indexImg)"
  412. v-for="(itemImg, indexImg) in item.photos"
  413. :key="indexImg">
  414. <img :src="itemImg.fileUrl" alt="" />
  415. </van-col>
  416. </van-row>
  417. </div>
  418. </van-collapse-item>
  419. </van-collapse>
  420. <div class="contentContainer">
  421. <div v-if="GZQuota">
  422. <p class="contentContainerTitle">今日项目跟进数</p>
  423. <div style="padding: 10px 0">
  424. <van-field readonly v-model="projectFollowNum" type="digit" />
  425. </div>
  426. <p class="contentContainerTitle">今日TUC成功报备数量</p>
  427. <div style="padding: 10px 0">
  428. <van-field readonly v-model="tucReportingSuccessNum" type="digit" />
  429. </div>
  430. </div>
  431. <!-- 今日未拜访原因 如果不为空则展示,为空则不展示 -->
  432. <div v-if="reportTarget.notVisitReason && reportTarget.notVisitReason != ''">
  433. <p class="contentContainerTitle">截至日报提交时间,今日拜访0家店的原因</p>
  434. <div style="padding: 10px 0">
  435. <van-field
  436. readonly
  437. v-model="reportTarget.notVisitReason"
  438. rows="4"
  439. autosize
  440. type="textarea" />
  441. </div>
  442. </div>
  443. <p class="contentContainerTitle">今日机会与挑战总结</p>
  444. <div style="padding: 10px 0">
  445. <van-field v-model="Content" rows="4" autosize readonly type="textarea" />
  446. </div>
  447. <p class="contentContainerTitle">明日工作规划</p>
  448. <div style="padding: 10px 0">
  449. <van-field v-model="Content2" rows="4" autosize readonly type="textarea" />
  450. </div>
  451. </div>
  452. <div
  453. class="contentContainer"
  454. v-if="reportTarget.status > 1 || reportTarget.reportRemarks != null">
  455. <p class="texttitle texttitledaily">
  456. <span class="opint"></span>
  457. <span v-if="reportTarget.status == 1">待审批</span>
  458. <span v-if="reportTarget.status == 3">审批完成</span>
  459. <span v-if="reportTarget.status == 2">退回重写</span>
  460. <span v-if="reportTarget.status == -1">过期未汇报</span>
  461. <span v-if="reportTarget.status > 1"><{{ ptitle }}审批></span>
  462. </p>
  463. <div style="padding: 10px 0" v-if="reportTarget.status > 1">
  464. <van-rate
  465. v-model="reportTarget.number"
  466. :size="25"
  467. readonly
  468. color="#ffd21e"
  469. void-icon="star"
  470. void-color="#eee" /><span class="rateText"
  471. >&nbsp;&nbsp;&nbsp;&nbsp;{{ reportTarget.number }}分</span
  472. >
  473. </div>
  474. <p class="contentContainerTitle" v-if="reportTarget.status > 1">评语</p>
  475. <div style="padding: 10px 0" v-if="reportTarget.status > 1">
  476. <van-field v-model="successContent" rows="4" autosize readonly type="textarea" />
  477. </div>
  478. </div>
  479. <div class="contentContainer" v-if="reportTarget.reportRemarks != null">
  480. <div>
  481. <div v-for="(item, index) in reportTarget.reportRemarks" :key="index">
  482. <div class="contentContainerTitle redisplay">
  483. <div class="nameTitle">
  484. <template v-if="item.deptName">{{ item.deptName }}-</template
  485. >{{ item.postName }}-{{ item.nickName }}点评
  486. </div>
  487. <div
  488. class="shareBtn"
  489. @click="clickShareFlag(index)"
  490. v-if="reportTarget && source != 'share' && reportTarget.reportPostType == 'fx'">
  491. <van-icon name="share" />
  492. </div>
  493. </div>
  494. <p class="contentContainerTitle">
  495. <template v-if="item.deptName">{{ item.deptName }}-</template
  496. >{{ item.postName }}-{{ item.nickName }}点评
  497. </p>
  498. <div style="padding: 10px 0">
  499. <van-field
  500. v-model="item.remarkContent"
  501. rows="4"
  502. autosize
  503. readonly
  504. type="textarea" />
  505. </div>
  506. </div>
  507. </div>
  508. </div>
  509. </div>
  510. </div>
  511. <br />
  512. <div class="contentborder" v-if="reportTarget.status == 2">
  513. <van-button type="info" size="small" plain class="Btn1" @click="submint"
  514. >重新填写</van-button
  515. >
  516. </div>
  517. <br />
  518. <br />
  519. </div>
  520. <share
  521. v-if="setShareFlag"
  522. :reportTarget="reportTarget"
  523. :reportId="$route.query.reportId"
  524. @setShareImg="setShareImg"
  525. @setDailyDetailsBox="setDailyDetailsBox"
  526. :urlList="urlList"
  527. :reportRemarksIndex="reportRemarksIndex"
  528. :checkedPlan="checkedPlan"></share>
  529. <!--分享图片列表 -->
  530. <el-dialog
  531. title="选择分享的图片"
  532. :visible.sync="shareImgFlag"
  533. width="90%"
  534. :append-to-body="true"
  535. :close-on-click-modal="false"
  536. @close="wuliaoTableClose"
  537. custom-class="shareImgFlag">
  538. <div v-if="reportTarget.photos">
  539. <p style="margin-bottom: 10px; margin-top: 0; display: flex">
  540. 今日总结&明日规划<van-checkbox
  541. v-model="checkedPlan"
  542. style="margin-left: 10px"></van-checkbox>
  543. </p>
  544. <div v-for="(item, index) in reportTarget.photos" :key="index">
  545. <p style="margin-bottom: 10px">{{ item.taskName }}</p>
  546. <div class="shareVisitImg">
  547. <div v-for="(itemImg, indexImg) in item.photos" :key="indexImg">
  548. <img :src="itemImg.fileUrl" alt="" @click="selectImg(itemImg)" />
  549. <van-icon
  550. @click.stop
  551. name="success"
  552. class="activaImg"
  553. color="#fff"
  554. size="15"
  555. style="
  556. position: absolute;
  557. right: 0;
  558. bottom: 0;
  559. /* margin: -15px 0 0 -15px; */
  560. pointer-events: none;
  561. background: #2b73cf;
  562. border: 2px solid #fff;
  563. "
  564. v-if="itemImg.checked" />
  565. </div>
  566. </div>
  567. </div>
  568. </div>
  569. <span slot="footer" class="footer-btn">
  570. <van-button plain type="primary" @click="shareImgFlag = false">取 消</van-button>
  571. <van-button type="primary" @click="confirmShare">确 定</van-button>
  572. </span>
  573. </el-dialog>
  574. </div>
  575. </template>
  576. <script>
  577. import history from '@/assets/Icon/history.png';
  578. import { userTodayPlanNum, loginLog, getDetailById, getReportInfo } from '@/api/index';
  579. import { ImagePreview } from 'vant';
  580. import visitedRealTime from '@/views/componentsTarget/visitedRealTime';
  581. import createStoreBJ from '@/views/componentsTarget/createStoreBJ';
  582. import placeOrder from '@/views/componentsTarget/placeOrder';
  583. import ZYPlaceOrder from '@/views/componentsTarget/ZYPlaceOrder';
  584. import performanceSAP from '@/views/componentsTarget/performanceSAP';
  585. import ZYSAP from '@/views/componentsTarget/ZYSAP';
  586. import veryGoodPlaceOrder from '@/views/componentsTarget/veryGoodPlaceOrder';
  587. import share from '@/components/share';
  588. import chatBIReport from './chatBIReport.vue';
  589. export default {
  590. name: 'dailyDetails',
  591. components: {
  592. visitedRealTime,
  593. createStoreBJ,
  594. placeOrder,
  595. ZYPlaceOrder,
  596. performanceSAP,
  597. ZYSAP,
  598. veryGoodPlaceOrder,
  599. share,
  600. chatBIReport,
  601. },
  602. data() {
  603. return {
  604. show: true,
  605. num: 0,
  606. todayGoal: {},
  607. progressWidth: 0,
  608. history: history,
  609. imgArr: [],
  610. activeNames: [
  611. '1',
  612. '2',
  613. '3',
  614. '4',
  615. '5',
  616. '6',
  617. '7',
  618. '8',
  619. '10',
  620. '16',
  621. '17',
  622. '20',
  623. '21',
  624. '22',
  625. '23',
  626. '11',
  627. '29',
  628. '33',
  629. '40',
  630. '41',
  631. '42',
  632. '43',
  633. ],
  634. value: '2',
  635. message: '',
  636. powerGrade: '',
  637. Content: '',
  638. Content2: '',
  639. reportTargetAll: {},
  640. reportContents: [{ dayContent: '' }],
  641. reportTarget: {},
  642. successContent: '',
  643. projectFollowNum: '',
  644. tucReportingSuccessNum: '',
  645. tucUndertakingNum: '',
  646. imgList: [],
  647. type: '-1',
  648. JZQuota: false,
  649. GZQuota: false,
  650. YFQuota: false, //应用服务
  651. titlejz: '',
  652. saptitle: '业绩目标SAP(千元)',
  653. ptitle: '',
  654. setShareFlag: false,
  655. source: '',
  656. reportRemarksIndex: -1,
  657. shareImgFlag: false,
  658. urlList: [],
  659. title: '',
  660. setDailyDetailsBoxFlag: true,
  661. sourceType: '',
  662. checkedPlan: true, //今日总结&明日规划
  663. //
  664. };
  665. },
  666. created() {
  667. this.source = this.$route.query.source || '';
  668. this.sourceType = this.$route.query.sourceType || '';
  669. this.powerGrade = localStorage.getItem('powerGrade');
  670. this.getDetailById();
  671. },
  672. watch: {
  673. $route(to, from) {
  674. this.powerGrade = localStorage.getItem('powerGrade');
  675. if (to.path == '/dailyDetails') {
  676. this.getDetailById();
  677. }
  678. // &&from.path=="/dailyApprovalList"
  679. // if(to.path=="/dailyDetails"&&from.path=="/myHistoricalDaily"){
  680. // this.getDetailById()
  681. // }
  682. },
  683. },
  684. activated() {
  685. this.setDailyDetailsBoxFlag = true;
  686. this.shareImgFlag = false;
  687. this.num = 0;
  688. this.userTodayPlanNum();
  689. this.setShareFlag = false;
  690. },
  691. methods: {
  692. setDailyDetailsBox(flag) {
  693. this.setDailyDetailsBoxFlag = flag;
  694. },
  695. setShareImg(flag) {
  696. this.setShareFlag = flag;
  697. },
  698. // 打开分享
  699. clickShareFlag(index = -1) {
  700. this.urlList = [];
  701. this.reportRemarksIndex = index;
  702. if (this.reportTarget.photos && this.reportTarget.photos.length) {
  703. // 重置分享图片状态
  704. this.reportTarget.photos.forEach((item) => {
  705. item.photos.forEach((val) => {
  706. this.$set(val, 'checked', false);
  707. });
  708. });
  709. // 选择分享的图片
  710. this.shareImgFlag = true;
  711. } else {
  712. this.setShareFlag = true;
  713. }
  714. },
  715. // 确认分享
  716. confirmShare() {
  717. this.reportTarget.photos.forEach((item) => {
  718. item.photos.forEach((val) => {
  719. if (val.checked) this.urlList.push(val.fileUrl);
  720. });
  721. });
  722. if (this.urlList.length == 0 && !this.checkedPlan) {
  723. this.$notify({ type: 'warning', message: '请选择分享内容!', className: 'notifyIndex' });
  724. return;
  725. }
  726. this.shareImgFlag = false;
  727. this.setShareFlag = true;
  728. },
  729. pviewFn(val, imgVal) {
  730. var imgList = [];
  731. var photos = this.reportTarget.photos[val].photos;
  732. for (let i = 0; i < photos.length; i++) {
  733. imgList.push(photos[i].fileUrl);
  734. }
  735. ImagePreview({ images: imgList, startPosition: imgVal });
  736. },
  737. submint() {
  738. this.$router.push({
  739. path: '/daily',
  740. query: { reportId: this.$route.query.reportId, temporaryShow: 'N' },
  741. });
  742. },
  743. getDetailById() {
  744. let loading1 = this.$toast.loading({
  745. duration: 0,
  746. message: '加载中...',
  747. forbidClick: true,
  748. });
  749. getDetailById({ reportId: this.$route.query.reportId }).then((res) => {
  750. loading1.clear();
  751. this.reportTargetAll = res.data.reportTargetAll;
  752. this.reportTarget = res.data;
  753. this.JZQuota = false;
  754. this.GZQuota = false;
  755. this.YFQuota = res.data.postType == 'YF' ? true : false;
  756. this.ptitle = res.data.pdeptName + '-' + res.data.ppostName + '-' + res.data.pnickName;
  757. this.title =
  758. res.data.deptName + '-' + res.data.postName + '-' + res.data.nickName + '的日报';
  759. if (res.data.postType == 'JZ') {
  760. this.JZQuota = true;
  761. } else if (res.data.postType == 'GZ') {
  762. this.GZQuota = true;
  763. this.saptitle = '公裝业绩SAP(千元)';
  764. } else {
  765. this.saptitle = '业绩目标SAP(千元)';
  766. }
  767. this.type = res.data.userType;
  768. if (res.data.status == 3) {
  769. this.successContent = res.data.successContent;
  770. } else {
  771. this.successContent = res.data.failContent;
  772. }
  773. if (res.data.reportContents.length > 0) {
  774. this.Content = res.data.reportContents[0].dayContent;
  775. if (res.data.reportContents.length > 1) {
  776. this.Content2 = res.data.reportContents[1].dayContent;
  777. } else {
  778. this.Content2 = '';
  779. }
  780. if (res.data.reportContents.length > 2) {
  781. this.projectFollowNum = res.data.reportContents[2].projectFollowNum;
  782. this.tucReportingSuccessNum = res.data.reportContents[3].tucReportingSuccessNum;
  783. }
  784. } else {
  785. this.Content = '';
  786. this.Content2 = '';
  787. }
  788. this.reportContents = res.data.reportContents;
  789. var imgList = [];
  790. if (res.data.photos != null) {
  791. for (var k = 0; k < res.data.photos.length; k++) {
  792. imgList.push(res.data.photos[k].fileUrl + '');
  793. }
  794. }
  795. this.imgList = imgList;
  796. if (this.sourceType == 'daily') {
  797. this.$nextTick(() => {
  798. this.clickShareFlag(-1);
  799. });
  800. }
  801. });
  802. },
  803. userTodayPlanNum() {
  804. userTodayPlanNum().then((res) => {
  805. if (res.code == 200) {
  806. this.todayGoal = res.data;
  807. this.progressWidth = (this.todayGoal.finishNum / this.todayGoal.planNum) * 100 + '%';
  808. localStorage.setItem('nickName', res.data.user.nickName);
  809. localStorage.setItem('storeType', res.data.user.type);
  810. } else {
  811. this.$toast.fail(res.msg);
  812. }
  813. });
  814. },
  815. onClickLeft() {
  816. this.$router.replace({
  817. path: 'myHistoricalDaily',
  818. });
  819. },
  820. wuliaoTableClose() {
  821. this.shareImgFlag = false;
  822. },
  823. // 选中的图片
  824. selectImg(item) {
  825. this.$set(item, 'checked', !item.checked);
  826. console.log(item);
  827. },
  828. },
  829. };
  830. </script>
  831. <style scoped lang="scss">
  832. .dailyDetails {
  833. position: relative;
  834. // background: #fff;
  835. width: 100%;
  836. height: 100%;
  837. .shareBtn {
  838. width: 22px;
  839. height: 22px;
  840. border-radius: 50%;
  841. background: #666;
  842. display: flex;
  843. align-items: center;
  844. justify-content: center;
  845. .van-icon {
  846. color: #fff;
  847. }
  848. }
  849. }
  850. .container {
  851. margin: 10px;
  852. }
  853. .container .van-collapse-item {
  854. margin-bottom: 10px;
  855. border-radius: 6px;
  856. overflow: hidden;
  857. }
  858. .linep p {
  859. margin: 6px 0 0 0;
  860. font-size: 14px;
  861. color: #666;
  862. }
  863. .linep .texttitle {
  864. color: #0057ba;
  865. position: relative;
  866. padding-left: 10px;
  867. }
  868. .linep .texttitledaily {
  869. color: #000;
  870. position: relative;
  871. padding-left: 10px;
  872. }
  873. .linep .texttitle2 {
  874. padding-left: 0;
  875. }
  876. .linep .texttitledaily .opint {
  877. position: absolute;
  878. left: 0px;
  879. top: 6px;
  880. margin-right: 6px;
  881. display: inline-block;
  882. width: 6px;
  883. height: 6px;
  884. border-radius: 10px;
  885. background-color: #0057ba;
  886. }
  887. .leftTitle {
  888. background-color: #74a4d9;
  889. color: #fff;
  890. display: inline-block;
  891. padding: 0 4px;
  892. border-radius: 2px;
  893. }
  894. .rightTitle {
  895. background-color: #e7b4bb;
  896. color: #fff;
  897. display: inline-block;
  898. padding: 0 4px;
  899. border-radius: 2px;
  900. }
  901. .redisplay {
  902. display: flex;
  903. align-items: center;
  904. justify-content: space-between;
  905. .nameTitle {
  906. flex: 1;
  907. }
  908. }
  909. </style>
  910. <style lang="scss">
  911. .linep .van-cell__title {
  912. color: #1e5398;
  913. font-weight: 500;
  914. }
  915. .linep .contentContainer {
  916. background-color: white;
  917. border-radius: 8px;
  918. padding: 10px 16px;
  919. margin-bottom: 10px;
  920. }
  921. .linep .contentContainer .contentContainerTitle {
  922. color: #222;
  923. }
  924. .linep .contentContainer .contentContainerTitle span {
  925. font-size: 12px;
  926. color: #666;
  927. }
  928. .linep .contentContainer .van-field__control {
  929. background-color: #ebf4ff;
  930. padding: 10px;
  931. border-radius: 8px;
  932. }
  933. .linep .contentContainer .van-cell {
  934. padding: 0;
  935. }
  936. .colorbalck {
  937. color: #333;
  938. }
  939. .visitIMG1 img {
  940. display: block;
  941. width: 100%;
  942. height: 75px;
  943. border-radius: 6px;
  944. }
  945. .el-dialog__wrapper {
  946. z-index: 9999 !important;
  947. display: flex;
  948. justify-content: center;
  949. align-items: center;
  950. background: rgba(0, 0, 0, 0.5) !important;
  951. .shareImgFlag {
  952. overflow: hidden;
  953. display: flex;
  954. flex-direction: column;
  955. max-height: 70%;
  956. margin-top: 0 !important;
  957. .el-dialog__header {
  958. height: 40px;
  959. display: flex;
  960. justify-content: right;
  961. .el-dialog__headerbtn {
  962. position: static !important;
  963. }
  964. }
  965. .el-dialog__body {
  966. padding: 30px 20px !important;
  967. overflow-y: auto;
  968. flex: 1;
  969. }
  970. .cell {
  971. font-size: 12px;
  972. }
  973. .footer-btn {
  974. display: flex;
  975. justify-content: space-around;
  976. }
  977. }
  978. }
  979. .shareImgFlag {
  980. .shareVisitImg {
  981. display: flex;
  982. flex-wrap: wrap;
  983. div {
  984. width: 22%;
  985. height: 80px;
  986. margin-right: 3%;
  987. margin-top: 10px;
  988. position: relative;
  989. img {
  990. width: 100%;
  991. height: 100%;
  992. }
  993. }
  994. }
  995. .el-dialog__header {
  996. display: flex;
  997. .el-dialog__title {
  998. flex: 1;
  999. display: flex;
  1000. align-items: center;
  1001. justify-content: center;
  1002. }
  1003. }
  1004. }
  1005. .notifyIndex {
  1006. z-index: 999999 !important;
  1007. }
  1008. </style>