dailyDetails.vue 36 KB

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