dailyHistoricalDetails.vue 39 KB

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