_Report.cshtml 75 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987
  1. @using Abp.Configuration
  2. @using IwbZero.ToolCommon.StringModel
  3. @using WeApp.Configuration
  4. @using WeApp.Helpers
  5. @using WeApp.TrainingPortrait.Dto
  6. @model WeApp.Views.Shared.Camp.ReportModel
  7. @{
  8. GroupReportDto group = Model.Group;
  9. ViewBag.Title = $"{(StringExtensions.IsEmpty(group.Name) ? "" : $"[{group.Name}] ")}演练报告";
  10. }
  11. <style>
  12. .report-box {
  13. color: #02595a;
  14. width: 894px;
  15. display: flex;
  16. flex-direction: column;
  17. margin: 0 auto;
  18. padding: 0 50px
  19. }
  20. .first-page {
  21. width: 100%;
  22. height: 950pt;
  23. display: flex;
  24. flex-direction: column;
  25. justify-content: center;
  26. align-items: center;
  27. font-size: 24px;
  28. display: none;
  29. }
  30. .first-page .box {
  31. margin-top: 100px;
  32. width: 70%;
  33. padding: 15px 20px;
  34. border-left: 5px solid;
  35. }
  36. .first-page .box .name {
  37. font-size: 40px;
  38. font-weight: 600;
  39. margin: 50px 0;
  40. }
  41. .first-page .date-box {
  42. margin-top: 400px;
  43. font-size: 30px;
  44. }
  45. .box-info {
  46. width: 100%;
  47. }
  48. .box-info .info-header {
  49. width: 100%;
  50. padding: 10px 20px 5px 40px;
  51. border-bottom: 3px solid;
  52. font-size: 24px;
  53. font-weight: 600;
  54. }
  55. .box-info .info-body {
  56. width: 100%;
  57. padding: 10px;
  58. }
  59. .box-info .info-body dl {
  60. display: flex;
  61. align-items: center;
  62. }
  63. .box-info .info-body dl {
  64. margin-bottom: 10px;
  65. }
  66. .box-info .info-body dl:last-child {
  67. margin-bottom: 0;
  68. }
  69. .box-info .info-body dl dt, .box-info .info-body dl dd {
  70. display: inline-block;
  71. }
  72. .box-info .info-body dl dt {
  73. font-weight: 600;
  74. padding-right: 5px;
  75. white-space: nowrap;
  76. font-size: 18px;
  77. }
  78. .box-info .info-body dl dd {
  79. margin-bottom: 0;
  80. word-break: break-all;
  81. }
  82. .play-chart-box, .play-scene-box {
  83. width: 100%;
  84. display: flex;
  85. flex-direction: column;
  86. margin-top: 20px;
  87. }
  88. .chart-title {
  89. font-size: 18px;
  90. font-weight: 600;
  91. margin-bottom: 10px;
  92. }
  93. .round {
  94. text-align: center;
  95. }
  96. .round span {
  97. padding: 5px 15px 2px;
  98. font-size: 16px;
  99. font-weight: 600;
  100. border-bottom: 2px solid;
  101. }
  102. .scene-box {
  103. margin: 15px 10px;
  104. padding: 10px 0;
  105. border: 2px solid;
  106. border-radius: 5px;
  107. }
  108. .scene-box .scene-info {
  109. padding: 5px;
  110. border: 1px solid;
  111. border-radius: 5px;
  112. margin: 5px 10px;
  113. background: #c7f0f3;
  114. }
  115. .scene-box .scene-info .name {
  116. font-size: 16px;
  117. font-weight: 600;
  118. }
  119. .scene-box .scene-info .desc {
  120. text-indent: 2em;
  121. font-size: 14px;
  122. }
  123. .scene-box .scene-info .score {
  124. margin-top: 3px;
  125. font-size: 16px;
  126. display: flex;
  127. justify-content: center;
  128. }
  129. .scene-box .scene-info .score span {
  130. font-weight: 600;
  131. text-align: center;
  132. width: 100%;
  133. }
  134. .scene-box .behavior-info {
  135. border: 1px dashed;
  136. background: #e7f0f3;
  137. }
  138. .scene-box .behavior-info .progress {
  139. background: #c7f0f3;
  140. margin: 5px 0;
  141. }
  142. .scene-box .behavior-info .progress-bar {
  143. background-color: #02595a;
  144. }
  145. .btn.btn-iwb {
  146. color: #fff;
  147. background-color: #02595a;
  148. border-color: #02595a;
  149. box-shadow: none;
  150. }
  151. .table-box .table th, .table td {
  152. text-align: center;
  153. border-color: #02595a;
  154. padding: 8px 5px;
  155. }
  156. .table-box .table thead th {
  157. /*border-bottom: 2px solid;*/
  158. border-top: 1px solid #02595a;
  159. border-bottom: 1px solid #02595a;
  160. }
  161. .table-box th.round-tag {
  162. padding: 10px 10px 10px 75px;
  163. text-align: left;
  164. position: relative;
  165. }
  166. .table-box th.round-tag strong {
  167. font-size: 130%;
  168. letter-spacing: 10px;
  169. }
  170. .table-box th.scene {
  171. width: 200px;
  172. }
  173. .table-box th.b-title {
  174. vertical-align: middle;
  175. letter-spacing: 3px;
  176. font-size: 115%;
  177. }
  178. .table-box th.s-title, td {
  179. vertical-align: middle;
  180. font-size: 85%;
  181. }
  182. .table-box th.round-tag .level-box {
  183. position: absolute;
  184. right: 40px;
  185. top: 0;
  186. display: flex;
  187. flex-direction: row;
  188. height: 100%;
  189. font-weight: 400;
  190. }
  191. .table-box .level-box .l-box {
  192. display: inline-block;
  193. margin-right: 15px;
  194. display: flex;
  195. flex-direction: row;
  196. align-items: center;
  197. }
  198. .table-box .t-level {
  199. --wh: 15px;
  200. display: inline-block;
  201. width: var(--wh);
  202. height: var(--wh);
  203. border-radius: 50%;
  204. margin: 0 auto;
  205. }
  206. .table-box .t-level.big {
  207. --wh: 18px;
  208. margin: 0 8px;
  209. }
  210. .table-box .t-level.l-0 {
  211. background: #ddd;
  212. }
  213. .table-box .t-level.l-1 {
  214. background: #f00
  215. }
  216. .table-box .t-level.l-2 {
  217. background: orange;
  218. }
  219. .table-box .t-level.l-3 {
  220. background: #0f0
  221. }
  222. .review-box {
  223. padding: 0 20px 10px;
  224. }
  225. .review-box strong {
  226. font-size: 18px;
  227. }
  228. .review-box .review {
  229. margin-top: 10px;
  230. text-indent: 2em;
  231. }
  232. </style>
  233. <div class="report-box" id="report">
  234. <div class="first-page">
  235. <div class="box">
  236. <div class="">@(SettingManager.GetSettingValue(IwbSettingNames.ReportCompany))</div>
  237. <div class="name">@(SettingManager.GetSettingValue(IwbSettingNames.ReportName))</div>
  238. <div class=""> @(group.Name)</div>
  239. </div>
  240. <div class="date-box">@(group.EndDate!=null?group.EndDate?.ToString("yyyy-MM-dd"):DateTime.Now.ToString("yyyy-MM-dd")) </div>
  241. </div>
  242. <div class="base-info-box box-info">
  243. <div class="info-header">演练信息</div>
  244. <div class="info-body">
  245. <dl>
  246. <dt>演练分组:</dt>
  247. <dd>@(group.Name)</dd>
  248. </dl>
  249. <dl>
  250. <dt>培 训 营:</dt>
  251. <dd>@(group.CampName)</dd>
  252. </dl>
  253. <dl>
  254. <dt>演练主题:</dt>
  255. <dd>@(group.PackageName)</dd>
  256. </dl>
  257. @*<dl>
  258. <dt>演练目的:</dt>
  259. <dd>@(group.Purposes)</dd>
  260. </dl>
  261. <dl>
  262. <dt>主办单位:</dt>
  263. <dd>@(group.Organizer)</dd>
  264. </dl>*@
  265. <dl>
  266. <dt>演练时长:</dt>
  267. <dd>@(Convert.ToInt32(group.TrainingMinute))分钟 ( @(group.StartDate?.ToString("yyyy-MM-dd HH:mm:ss")) — @(group.EndDate?.ToString("yyyy-MM-dd HH:mm:ss")) )</dd>
  268. </dl>
  269. <dl>
  270. <dt>演练角色:</dt>
  271. <dd>
  272. @if (group.RoleNames.IsNotEmpty())
  273. {
  274. var arr = group.RoleNames.Split(',');
  275. foreach (var r in arr)
  276. {
  277. <span style="padding: 5px">@(r)</span>
  278. }
  279. }
  280. </dd>
  281. </dl>
  282. <dl>
  283. <dt>演练成绩:</dt>
  284. <dd id="eval-result">优秀</dd>
  285. </dl>
  286. </div>
  287. </div>
  288. @*<div class="base-info-box box-info">
  289. <div class="info-header">参演人员</div>
  290. <div class="info-body">
  291. <table class="table table-hover table-striped">
  292. <thead>
  293. <tr>
  294. <th style="width: 15px">#</th>
  295. <th style="width: 100px">用户名</th>
  296. <th>参演人</th>
  297. <th>参演角色</th>
  298. <th style="width: 120px">状态</th>
  299. </tr>
  300. </thead>
  301. <tbody id="play-user-box"></tbody>
  302. </table>
  303. </div>
  304. </div>*@
  305. <div class="base-info-box box-info">
  306. <div class="info-header">演练过程</div>
  307. <div class="info-body">
  308. <div class="play-chart-box">
  309. <div class="chart-title">情景演变图:</div>
  310. <div id="tree-chart" class="chart-box"></div>
  311. </div>
  312. <div class="play-chart-box">
  313. <div class="chart-title">情景蜂巢图:</div>
  314. <div id="fc-chart" class="chart-box"></div>
  315. </div>
  316. <div class="play-scene-box">
  317. <div class="chart-title">演练过程得分详解:</div>
  318. <div id="scene-box" class="scene-info-box">
  319. </div>
  320. </div>
  321. </div>
  322. </div>
  323. <div class="base-info-box box-info">
  324. <div class="info-header">演练能力</div>
  325. <div class="info-body">
  326. <div class="play-chart-box">
  327. <div class="chart-title">轮次评分:</div>
  328. <div id="round-chart" class="chart-box"></div>
  329. </div>
  330. <div class="play-chart-box">
  331. <div class="chart-title">四功评析:</div>
  332. <div id="sg-chart" class="chart-box"></div>
  333. </div>
  334. <div class="play-scene-box">
  335. <div class="chart-title">五力评析:</div>
  336. <div id="wl-chart" class="chart-box">
  337. </div>
  338. </div>
  339. </div>
  340. </div>
  341. <div class="base-info-box box-info">
  342. <div class="info-header">能力解析</div>
  343. <div class="info-body">
  344. <div class="play-chart-box">
  345. <div class="chart-title">四功五力解析详情:</div>
  346. <div id="tag-box" class="table-box"></div>
  347. </div>
  348. <div class="play-chart-box">
  349. <div class="chart-title">系统评语:</div>
  350. <div id="xt-review" class="review-box"></div>
  351. </div>
  352. <div class="play-scene-box">
  353. <div class="chart-title">专家评语:</div>
  354. <div id="zj-review" class="review-box">
  355. </div>
  356. </div>
  357. </div>
  358. </div>
  359. </div>
  360. @if (Model.IsSystem)
  361. {
  362. <div id="export" style="position: fixed; right: 17%; top: 80px; display: block;">
  363. <button type="button" class="btn btn-iwb btn-sm" onclick="ExportSql()">导出PDF</button>
  364. </div>
  365. }
  366. @using (Html.BeginScripts())
  367. {
  368. <script src="~/Content/Libs/eCharts/echarts.min.js"></script>
  369. @*<script type="text/javascript" src="https://code.highcharts.com.cn/highcharts/highcharts.js"></script>
  370. <script type="text/javascript" src="https://code.highcharts.com.cn/highcharts/modules/heatmap.js"></script>
  371. <script type="text/javascript" src="https://code.highcharts.com.cn/highcharts/modules/oldie.js"></script>
  372. <script type="text/javascript" src="https://code.highcharts.com.cn/highcharts/modules/tilemap.js"></script>*@
  373. <script src="~/Content/Libs/highcharts/highcharts.min.js"></script>
  374. <script src="~/Content/Libs/highcharts/modules/heatmap.min.js"></script>
  375. <script src="~/Content/Libs/highcharts/modules/oldie.min.js"></script>
  376. <script src="~/Content/Libs/highcharts/modules/tilemap.min.js"></script>
  377. <script src="~/Content/Libs/highcharts/modules/exporting.js"></script>
  378. @*<script src="~/Content/Libs/highcharts/modules/offline-exporting.src.js"></script>*@
  379. @*<script src="~/Content/Libs/highcharts/modules/exporting-image.src.js"></script>*@
  380. @*<script src="~/Content/Libs/html2canva/html2canvas.min.js"></script>
  381. <script src="~/Content/Libs/jsPdf/jspdf.min.js.js"></script>
  382. <script src="~/Content/Libs/jsPdf/html2pdf.js"></script>*@
  383. <script>
  384. </script>
  385. <script id="report-data-script">
  386. var t;
  387. function GetReportData() {
  388. $('body').append(loading.format('loading-data-tip','正在加载演练报告数据,请稍后!'));
  389. setTimeout(function() {
  390. $('#loading-data-tip').fadeIn(1000);
  391. },
  392. 1000);
  393. $.iwbAjax4({
  394. url: abp.appUrl + 'Portrait/GetGroupReportData?no=@(group.Id)',
  395. success: function(res) {
  396. if (res) {
  397. $('#report').data("report-info", res);
  398. $('#eval-result').html(res.evalQualitativeResult);
  399. ChartFormatter(res.chartData);
  400. SceneRoundFormatter(res.scenes);
  401. TagRoundFormatter(res.scenes);
  402. ReviewFormatter(res.reportEvalStrings);
  403. ScoreChartFormatter(res.scoreData);
  404. //window.Highcharts.charts.forEach(function(v) {
  405. // v.getImageData();
  406. //});
  407. }
  408. $('#loading-data-tip').fadeOut(1000, function() { $('#loading-data-tip').remove(); });
  409. clearTimeout(t);
  410. t = setTimeout(function() {
  411. $('#export').fadeIn(500);
  412. },
  413. 3000);
  414. },
  415. error: function() {
  416. $('#loading-data-tip').fadeOut(1000, function() { $('#loading-data-tip').remove(); });
  417. }
  418. });
  419. }
  420. function ChartFormatter(data) {
  421. if (data && data.length) {
  422. data.forEach(function(v) {
  423. var str = '<div id="{0}-container_{1}" style="width:100%;height:{2}px;"></div>';
  424. $('#tree-chart').append(str.format('tree', v.roundIndex, 500));
  425. TreePathChart(v, "tree");
  426. $('#fc-chart').append(str.format('fc', v.roundIndex, 420));
  427. FcRoundChart(v, 'fc');
  428. });
  429. }
  430. }
  431. function ScoreChartFormatter(data) {
  432. if (data) {
  433. var str = '<div id="score-container_{0}" style="width:100%;height:{1}px;"></div>';
  434. $('#round-chart').append(str.format('round', 50));
  435. RoundScoreChart(data.scoreInfos);
  436. $('#sg-chart').append(str.format('sg', 400));
  437. SiGongChart(data.siGongInfos);
  438. $('#wl-chart').append(str.format('wl', 300));
  439. WuLiChart(data.wuLiInfos);
  440. }
  441. }
  442. </script>
  443. <script id="scene-script">
  444. function SceneRoundFormatter(data) {
  445. var str = '';
  446. if (data && data.length) {
  447. data.forEach(function (v) {
  448. str += '<div class="round"><span>第{0}轮</span></div>'.format(v.roundIndex);
  449. v.sceneInfos.forEach(function (a) {
  450. str += SceneFormatter(a);
  451. });
  452. });
  453. }
  454. if (str) {
  455. $('#scene-box').html(str);
  456. }
  457. }
  458. function SceneFormatter(data) {
  459. var str = '';
  460. if (data) {
  461. str += '<div class="scene-box">';
  462. str += '<div class="scene-info">';
  463. str += '<div class="name">[情景]:{0}</div>'.format(data.name);
  464. str += '<div class="desc">{0}</div>'.format(data.description);
  465. str += '</div>';
  466. if (data.behaviors && data.behaviors.length) {
  467. data.behaviors.forEach(function (v) {
  468. str += BehaviorFormatter(v);
  469. });
  470. }
  471. str += '</div>';
  472. }
  473. return str;
  474. }
  475. function BehaviorFormatter(data) {
  476. var str = '';
  477. if (data) {
  478. str += '<div class="behavior-info scene-info">';
  479. str += '<div class="name">[规则]:{0}</div>'.format(data.name);
  480. str += '<div class="desc">{0}</div>'.format(data.description);
  481. str += '<div class="score"><span>实际评分:{0} 分</span><span>行为总分:{1} 分</span></div>'.format(data.score,
  482. data.fullScore);
  483. str += '<div class="progress"><div class="progress-bar" style="width:{0}%;"></div></div>'.format(
  484. data.fullScore ? (data.score * 100 / data.fullScore).toFixed(2) : 0);
  485. str += '</div>';
  486. }
  487. return str;
  488. }
  489. </script>
  490. <script id="tag-script">
  491. function TagRoundFormatter(data) {
  492. var str = '';
  493. if (data && data.length) {
  494. console.log("TG", data)
  495. str = '<table class="table table-bordered">';
  496. data.forEach(function (v) {
  497. var level = '<div class="l-box"><span class="t-level l-1 big"></span><span>及格</span></div>';
  498. level += '<div class="l-box"><span class="t-level l-2 big"></span><span>良好</span></div>';
  499. level += '<div class="l-box"><span class="t-level l-3 big"></span><span>优秀</span></div>';
  500. str +=
  501. '<thead><tr><th class="round-tag" colspan="20"><strong>第{0}轮</strong><div class="level-box">{1}</div></th></tr></thead>'
  502. .format(
  503. v.roundIndex,
  504. level);
  505. var isFirst = true;
  506. v.sceneInfos.forEach(function (a) {
  507. str += TagFormatter(a, isFirst);
  508. isFirst = false;
  509. });
  510. str += '<tr>';
  511. str += '<th class="b-title">{0}</th>'.format("轮次总结");
  512. v.behaviorTags.forEach(function (vv) {
  513. str += '<td class=""> <span class="t-level l-{0}"><span></td>'.format(vv.level);
  514. });
  515. str += '</tr></tbody>';
  516. });
  517. str += '</table>';
  518. }
  519. if (str) {
  520. $('#tag-box').html(str);
  521. }
  522. }
  523. function TagFormatter(data, isFirst) {
  524. var str = '';
  525. if (data && data.behaviorTags) {
  526. if (isFirst) {
  527. var head = '';
  528. head +=
  529. '<tr class="header"><th class="b-title scene" rowspan="2" >情景信息</th><th class="b-title" colspan="4">四项基本功</th><th class="b-title" colspan="5">五项能力</th></tr>';
  530. head += '<tr>';
  531. data.behaviorTags.forEach(function (v) {
  532. head += '<th class="s-title">{0}</th>'.format(v.tagNo);
  533. });
  534. head += '</tr>';
  535. str += ' <thead>{0}</thead><tbody>'.format(head);;
  536. }
  537. str += '<tr>';
  538. str += '<td class="">{0}</td>'.format(data.name);
  539. if (data.behaviorTags.length) {
  540. data.behaviorTags.forEach(function (v) {
  541. str += '<td class=""> <span class="t-level l-{0}"><span></td>'.format(v.level);
  542. });
  543. } else {
  544. for (var i = 0; i < 9; i++) {
  545. str += '<td class=""> <span class="t-level l-0"><span></td>';
  546. }
  547. }
  548. str += '</tr>';
  549. }
  550. return str;
  551. }
  552. </script>
  553. <script id="pingYu-script">
  554. function ReviewFormatter(data) {
  555. var str = "";
  556. if (data && data.length) {
  557. data.forEach(function(v) {
  558. if (v.type == @(PortraitRemarkTypeDefinition.ZhuanJia)) {
  559. var s = '<div class="review"><span>{0}</span></div>'.format(v.content || "无");
  560. if (s) {
  561. $('#zj-review').html(s);
  562. }
  563. } else {
  564. str += '<div class="review">';
  565. str += '<strong>{0}</strong>'.format(GetReviewName(v.type));
  566. str += '<span>{0}</span>'.format(v.content || "无");
  567. str += '</div>';
  568. }
  569. });
  570. }
  571. if (str) {
  572. $('#xt-review').html(str);
  573. }
  574. }
  575. function GetReviewName(type) {
  576. switch (type) {
  577. case @(PortraitRemarkTypeDefinition.Scene):
  578. return "场景:";
  579. case @(PortraitRemarkTypeDefinition.SiGong):
  580. return "四项基本功:";
  581. case @(PortraitRemarkTypeDefinition.WuLi):
  582. return "五项能力:";
  583. case @(PortraitRemarkTypeDefinition.Short):
  584. return "成绩与不足:";
  585. case @(PortraitRemarkTypeDefinition.ZhuanJia):
  586. return "专家评语:";
  587. default:
  588. return "";
  589. }
  590. }
  591. </script>
  592. <script id="chart-script">
  593. var color = ['#FF3030', '#FF6A6A', '#FFD700', '#54FF9F', '#00E5EE'];
  594. var roundColor = ['#FFA939', '#FF6A69', '#35D480', '#FFA939', '#FF6A69', '#35D480'];
  595. var mainColor = '#02595a';
  596. //推演网格
  597. function TreePathChart(data, idStr) {
  598. if (data) {
  599. //console.log("TreePath", data);
  600. } else {
  601. console.log("TreePath-Null");
  602. return;
  603. }
  604. //var isRadial = idStr == "hx";
  605. idStr = idStr + '-container_' + data.roundIndex;
  606. if ($('#' + idStr).data('use') === true) {
  607. return;
  608. }
  609. var treeChart = echarts.init(document.getElementById(idStr)), seriesOpt = {};
  610. var d = ConvertTreeData(data.infos, false); // isRadial);
  611. //console.log("ConvertTreeData", d);
  612. //if (isRadial) {
  613. // seriesOpt = {
  614. // layout: 'radial'
  615. // }
  616. //}
  617. var opt = {
  618. type: 'tree',
  619. data: d,
  620. top: '5%',
  621. left: '5%',
  622. bottom: '5%',
  623. right: '5%',
  624. symbolSize: 10,
  625. initialTreeDepth: -1,
  626. label: {
  627. position: 'top',
  628. rotate: 0,
  629. fontSize: 11,
  630. fontWeight: 'normal',
  631. distance: 1
  632. },
  633. lineStyle: {
  634. width: 2
  635. },
  636. itemStyle: {
  637. borderWidth: 1
  638. },
  639. leaves: {
  640. itemStyle: {
  641. borderWidth: 1.5
  642. }
  643. },
  644. expandAndCollapse: true,
  645. animationDuration: 550,
  646. animationDurationUpdate: 450
  647. };
  648. var o = $.extend(true, {}, opt, seriesOpt);
  649. //console.log(o);
  650. var option = {
  651. title: {
  652. text: "第" + data.roundIndex + "轮情景演变示意图",
  653. show: true,
  654. left: 'center',
  655. textStyle: {
  656. color: mainColor
  657. }
  658. },
  659. tooltip: {
  660. trigger: 'item',
  661. triggerOn: 'mousemove',
  662. formatter: function (p) {
  663. return p.data.showName;
  664. },
  665. backgroundColor: "#c7f0f3",
  666. textStyle: { color: mainColor, fontSize: 12 },
  667. padding: [8, 15]
  668. },
  669. series: [o]
  670. };
  671. treeChart.setOption(option);
  672. $('#' + idStr).data('use', true);
  673. }
  674. //蜂巢网格
  675. function FcRoundChart(data, idStr) {
  676. if (data) {
  677. var seriesData = [];
  678. seriesData.push($.extend({}, { name: data.fcInfo.name, type: 'tilemap', data: data.fcInfo.fcInfos }));
  679. if (data.fcFlowInfo && data.fcFlowInfo.length > 0) {
  680. data.fcFlowInfo.forEach(function (v) {
  681. seriesData.push($.extend({}, { name: v.name, type: 'spline', data: v.flowInfos }));
  682. });
  683. }
  684. console.log(seriesData);
  685. idStr = idStr + '-container_' + data.roundIndex;
  686. if ($('#' + idStr).data('use') === true) {
  687. return;
  688. }
  689. window.Highcharts.chart(idStr,
  690. {
  691. chart: {
  692. //events:{
  693. // load:function(e){
  694. // var curDiv=this.container;
  695. // //svg标签转img标签,某些邮件客户端支持img_svg,不支持svg标签
  696. // var svg=curDiv.innerHTML;
  697. // var imgStr="<img src=\"data:image/svg+xml;base64,"+utoa(svg)+"\" >";
  698. // curDiv.outerHTML=imgStr;
  699. // }
  700. //},
  701. reflow: true,
  702. height: '60%',
  703. margin: 10,
  704. inverted: false,
  705. //backgroundColor: {
  706. // linearGradient: [0, 0, 500, 500],
  707. // stops: [
  708. // [0, 'rgba(255, 255, 255,0)'],
  709. // [1, 'rgba(200, 200, 255,0)']
  710. // ]
  711. //}
  712. backgroundColor: '#ffffff'
  713. //plotBackgroundColor:'#f3fffe'
  714. //plotBackgroundColor: {
  715. // linearGradient: { x1: 0, y1: 0, x2: 0, y2: 1 },
  716. // stops: [
  717. // [0, '#F5F5F5'],
  718. // [0.5, '#FFffFF'],
  719. // [1, '#F5F5F5']
  720. // ]
  721. //}
  722. },
  723. exporting: {
  724. enabled: false
  725. },
  726. title: {
  727. text: "第" + data.roundIndex + "轮情景流蜂巢示意图",
  728. align: 'center',
  729. floating: false,
  730. margin: 125,
  731. style: {
  732. 'color': mainColor,
  733. 'fontWeight': '600',
  734. 'fontFamily': 'sans-serif'
  735. },
  736. y: 25
  737. },
  738. xAxis: {
  739. visible: false
  740. },
  741. yAxis: {
  742. visible: false,
  743. reversed: true
  744. },
  745. colorAxis: {
  746. visible: false,
  747. dataClasses: [
  748. {
  749. from: 0,
  750. to: 1,
  751. color: '#c7f0f3',
  752. name: ''
  753. }, {
  754. from: 1,
  755. to: 2,
  756. color: mainColor,
  757. name: ''
  758. }
  759. ]
  760. },
  761. tooltip: {
  762. enabled: false,
  763. headerFormat: '',
  764. pointFormat: ''
  765. },
  766. colors: ['#c7f0f3'],
  767. legend: {
  768. enabled: false
  769. },
  770. credits: {
  771. enabled: false
  772. },
  773. plotOptions: {
  774. tilemap: {
  775. allowPointSelect: true,
  776. clip: true,
  777. cursor: 'pointer',
  778. enableMouseTracking: false
  779. },
  780. spline: {
  781. enableMouseTracking: false,
  782. lineWidth: 5,
  783. marker: {
  784. enabled: false
  785. },
  786. series: {
  787. animation: {
  788. duration: 3000
  789. }
  790. }
  791. }
  792. },
  793. series: seriesData
  794. });
  795. $('#' + idStr).data('use', true);
  796. }
  797. }
  798. //轮次得分条
  799. function RoundScoreChart(data) {
  800. if ($('#score-container_round').data('use') === true) {
  801. return;
  802. }
  803. if (data && data.length > 0) {
  804. console.log("RoundScore", data);
  805. } else {
  806. console.log("RoundScore-Null");
  807. return;
  808. }
  809. var scoreChart = echarts.init(document.getElementById('score-container_round'));
  810. var series = [];
  811. for (var i = 0; i < data.length; i++) {
  812. var temp = {
  813. name: '第 ' + (i + 1) + ' 轮',
  814. type: 'bar',
  815. stack: '总分',
  816. label: {
  817. normal: {
  818. show: true,
  819. position: 'inside',
  820. color: "#fff",
  821. fontSize: 14,
  822. fontWeight: 'bold',
  823. formatter: '{a}: {c} 分'
  824. }
  825. },
  826. barWidth: 40,
  827. barMinHeight: 150,
  828. itemStyle: {},
  829. data: [data[i]]
  830. };
  831. if (i === 0 && i === data.length - 1) {
  832. temp.itemStyle = {
  833. barBorderRadius: [30]
  834. }
  835. } else if (i === 0) {
  836. temp.itemStyle = {
  837. barBorderRadius: [30, 0, 0, 30]
  838. }
  839. } else if (i === data.length - 1) {
  840. temp.itemStyle = {
  841. barBorderRadius: [0, 30, 30, 0]
  842. }
  843. }
  844. temp.itemStyle.color = roundColor[i % 3];
  845. series.push(temp);
  846. }
  847. var option = {
  848. grid: {
  849. left: 0,
  850. right: 0
  851. },
  852. xAxis: {
  853. show: false,
  854. type: 'value'
  855. },
  856. yAxis: {
  857. show: false,
  858. type: 'category',
  859. data: ['分数']
  860. },
  861. series: series
  862. };
  863. //console.log(option);
  864. scoreChart.setOption(option);
  865. $('#score-container_round').data('use', true);
  866. }
  867. //四功
  868. function SiGongChart(data) {
  869. if ($('#score-container_sg').data('use') === true) {
  870. return;
  871. }
  872. if (data && data.length > 0) {
  873. //console.log("SiGong", data);
  874. } else {
  875. console.log("SiGong-Null");
  876. return;
  877. }
  878. var series = [];
  879. var legendDate = [];
  880. var sgData = [];
  881. for (var i = 1; i <= data.length; i++) {
  882. if (i > 4) {
  883. return;
  884. }
  885. var item = data[i - 1];
  886. legendDate.push(item.name);
  887. sgData.push([]);
  888. }
  889. if (data[0] && data[0].tagScoreInfos) {
  890. var roundCount = data[0].tagScoreInfos.length;
  891. for (var w = 1; w <= data.length; w++) {
  892. if (w > 4) {
  893. return;
  894. }
  895. var scores = data[w - 1].tagScoreInfos;
  896. for (var q = 0; q < scores.length; q++) {
  897. sgData[q].push(scores[q]);
  898. }
  899. }
  900. for (var j = 0; j < roundCount; j++) {
  901. var temp = {
  902. name: '第 ' + (j + 1) + ' 轮',
  903. type: 'bar',
  904. label: {
  905. normal: {
  906. show: true,
  907. formatter: '{a}:{c} 分',
  908. color: "#fff",
  909. rotate: 90
  910. }
  911. },
  912. barMinHeight: 150,
  913. itemStyle: {
  914. color: {
  915. type: 'linear',
  916. x: 0,
  917. y: 0,
  918. x2: 0,
  919. y2: 1,
  920. colorStops: [
  921. {
  922. offset: 0,
  923. color: roundColor[j % 3] // 0% 处的颜色
  924. }, {
  925. offset: 1,
  926. color: '#27303f' // 100% 处的颜色
  927. }
  928. ]
  929. },
  930. barBorderRadius: [50, 50, 0, 0]
  931. //shadowBlur: 2,
  932. //shadowColor: "#666",
  933. //shadowOffsetX: 2,
  934. //shadowOffsetY: 1
  935. },
  936. data: sgData[j]
  937. };
  938. series.push(temp);
  939. }
  940. }
  941. var option = {
  942. grid: {
  943. top: 40,
  944. bottom: 40,
  945. left: 30,
  946. right: 30,
  947. borderColor: mainColor
  948. },
  949. title: {
  950. text: "四功能力评析示意图",
  951. show: true,
  952. left: 'center',
  953. textStyle: {
  954. color: mainColor
  955. }
  956. },
  957. //legend: {
  958. // data: legendDate
  959. //},
  960. xAxis: {
  961. type: 'category',
  962. data: legendDate,
  963. axisLabel: {
  964. color: mainColor
  965. },
  966. axisLine: {
  967. show: true,
  968. lineStyle: {
  969. color: mainColor
  970. }
  971. }
  972. },
  973. yAxis: {
  974. type: 'value',
  975. axisLabel: {
  976. color: mainColor
  977. },
  978. axisLine: {
  979. show: true,
  980. lineStyle: {
  981. color: mainColor
  982. }
  983. },
  984. splitLine: {
  985. lineStyle: {
  986. color: mainColor
  987. }
  988. }
  989. },
  990. series: series
  991. };
  992. //console.log(option);
  993. var siGongChart = echarts.init(document.getElementById('score-container_sg'));
  994. siGongChart.setOption(option);
  995. $('#score-container_sg').data('use', true);
  996. }
  997. //五力
  998. function WuLiChart(data) {
  999. if ($('#score-container_wl').data('use') === true) {
  1000. return;
  1001. }
  1002. if (data && data.length > 0) {
  1003. //console.log("WuLi", data);
  1004. } else {
  1005. console.log("WuLi-Null");
  1006. return;
  1007. }
  1008. var indicatorData = [];
  1009. for (var i = 1; i <= data.length; i++) {
  1010. if (i > 5) {
  1011. return;
  1012. }
  1013. var item = data[i - 1];
  1014. indicatorData.push({ text: item.name, max: 100, color: color[i - 1] });
  1015. }
  1016. var series = [];
  1017. var wlData = [];
  1018. var radar = [
  1019. {
  1020. indicator: indicatorData,
  1021. center: ['30%', '50%'],
  1022. radius: 120,
  1023. splitNumber: 5,
  1024. axisLine: {
  1025. lineStyle: {
  1026. color: ['#C1CDCD']
  1027. }
  1028. },
  1029. splitLine: {
  1030. lineStyle: {
  1031. color: ['#00ced1', mainColor]
  1032. }
  1033. }
  1034. }
  1035. ];
  1036. if (data[0] && data[0].tagScoreInfos) {
  1037. var roundCount = data[0].tagScoreInfos.length;
  1038. var h = 175 * roundCount;
  1039. if (h > 300) {
  1040. $('#score-container_wl').height(h);
  1041. }
  1042. var radarTemp = {
  1043. indicator: indicatorData,
  1044. radius: 40,
  1045. center: ['77%', '25%'],
  1046. splitNumber: 3,
  1047. nameGap: 5,
  1048. axisLine: {
  1049. show: false
  1050. },
  1051. splitLine: {
  1052. lineStyle: {
  1053. color: ['#00ced1', mainColor]
  1054. }
  1055. }
  1056. };
  1057. var minSplit = (100 / (roundCount + 1)).toFixed(2);
  1058. for (var j = 0; j <= roundCount; j++) {
  1059. var temp = {
  1060. name: '第 ' + j + ' 轮',
  1061. type: 'radar',
  1062. radarIndex: j
  1063. }
  1064. if (j === 0) {
  1065. temp.name = '五力雷达图';
  1066. temp.data = wlData;
  1067. } else {
  1068. wlData.push({ name: '第 ' + j + ' 轮', value: [], lineStyle: { color: roundColor[j - 1] } });
  1069. temp.lineStyle = {
  1070. color: roundColor[j - 1]
  1071. };
  1072. temp.data = [wlData[j - 1]];
  1073. radar.push($.extend(true, {}, radarTemp, { center: ['77%', (minSplit * j) + '%'] }));
  1074. }
  1075. series.push(temp);
  1076. }
  1077. for (var w = 1; w <= data.length; w++) {
  1078. if (w > 5) {
  1079. return;
  1080. }
  1081. var scores = data[w - 1].tagScoreInfos;
  1082. for (var q = 0; q < scores.length; q++) {
  1083. wlData[q].value.push(scores[q]);
  1084. }
  1085. }
  1086. }
  1087. var option = {
  1088. grid: { top: 10, bottom: 10, left: 30, right: 30 },
  1089. title: {
  1090. text: "五力能力评析示意图",
  1091. show: true,
  1092. left: 'center',
  1093. textStyle: {
  1094. color: mainColor
  1095. }
  1096. },
  1097. radar: radar,
  1098. series: series
  1099. };
  1100. //console.log(option);
  1101. var wuLiChart = echarts.init(document.getElementById('score-container_wl'));
  1102. wuLiChart.setOption(option);
  1103. $('#score-container_wl').data('use', true);
  1104. }
  1105. function ConvertTreeData(data, isRadial) {
  1106. var newData = [];
  1107. var color1 = "#02595a",
  1108. color2 = "#999",
  1109. width1 = 2, // isRadial ? 2 : 4,
  1110. width2 = 1; // isRadial ? 1 : 3;
  1111. if (data && data.length) {
  1112. data.forEach(function (v) {
  1113. var newItem = $.extend(true,
  1114. {},
  1115. {
  1116. itemStyle: {
  1117. color: color2,
  1118. borderColor: color2,
  1119. width: width2
  1120. },
  1121. label: {
  1122. color: "#999"
  1123. },
  1124. lineStyle: {
  1125. color: color2,
  1126. borderColor: color2,
  1127. width: width2
  1128. }
  1129. },
  1130. v);
  1131. newItem.showName = newItem.name;
  1132. newItem.name = newItem.name.indexOf('情景流') == 0
  1133. ? "情景流"
  1134. : newItem.name.indexOf('情景') == 0
  1135. ? "情景"
  1136. : newItem.name;
  1137. newItem.collapsed = true;
  1138. if (v.isRun) {
  1139. newItem.itemStyle.color = color1;
  1140. newItem.itemStyle.borderColor = color1;
  1141. newItem.itemStyle.width = width1;
  1142. newItem.label.color = color1;
  1143. newItem.label.fontWeight = 'bold';
  1144. newItem.lineStyle.color = color1;
  1145. newItem.lineStyle.borderColor = color1;
  1146. newItem.lineStyle.width = width1;
  1147. newItem.collapsed = false;
  1148. }
  1149. if (v.children && v.children.length) {
  1150. newItem.children = ConvertTreeData(v.children, isRadial);
  1151. }
  1152. newData.push(newItem);
  1153. });
  1154. }
  1155. return newData;
  1156. }
  1157. // 使用utf-8字符集进行base64编码
  1158. function utoa(str) {
  1159. return window.btoa(unescape(encodeURIComponent(str)));
  1160. }
  1161. // 使用utf-8字符集解析base64字符串
  1162. function atou(str) {
  1163. return decodeURIComponent(escape(window.atob(str)));
  1164. }
  1165. </script>
  1166. <script>
  1167. var loading =
  1168. '<div id="{0}" style="position: fixed; top: 0;right:0; bottom: 0; left: 0; margin: 0 auto; background: rgba(255, 255, 255, .5); color: #02595a; font-size: 24px; font-weight: 600;z-index:9999;display:none;"><div style="width:100%;height:100%;display: flex; justify-content: center; align-items: center; ">{1}</div></div>';
  1169. $('#report').data("group-info", @(Html.Raw(group.Obj2StringCamelCase())));
  1170. GetReportData();
  1171. </script>
  1172. if (Model.IsSystem)
  1173. {
  1174. <script>
  1175. setTimeout(function () { $('.preloader').fadeOut(600); }, 50);
  1176. var hasLoad = false;
  1177. $(function() {
  1178. $('#export button').text("导出PDF").prop("disabled", false);
  1179. hasLoad = true;
  1180. });
  1181. function ExportSql() {
  1182. if (!hasLoad) {
  1183. $('#export button').text("正在加载PDF导出插件").prop("disabled", true);
  1184. abp.message.warn("PDF导出插件正在加载中,请稍后...!");
  1185. return;
  1186. }
  1187. $('body').append(loading.format('loading-report-tip','正在导出演练报告,请稍后!'));
  1188. $('#loading-report-tip').fadeIn(500,
  1189. function() {
  1190. try {
  1191. ReportToPdf();
  1192. } catch (e) {
  1193. console.log("ReportToPdf", e);
  1194. abp.message.error("导出失败!");
  1195. } finally {
  1196. $('#loading-report-tip').fadeOut(1000, function () { $('#loading-report-tip').remove(); });
  1197. }
  1198. });
  1199. @*$('#report .first-page').css('display', 'flex');
  1200. ExportSqlPdf('report', '@(group.Name)演练报告-' + new Date().format('yyMMddhhmm'));
  1201. $('#report .first-page').css('display', 'none');*@
  1202. }
  1203. </script>
  1204. <script src="~/Content/Libs/canvg/umd.js"></script>
  1205. <script src="~/Content/Libs/jsPdf/dist/jspdf.umd.min.js"></script>
  1206. <script src="~/Content/Libs/jsPdf/CustomFonts/jspdf.customfonts.min.js"></script>
  1207. <script src="~/Content/Libs/jsPdf/CustomFonts/iwbyue-normal.js"></script>
  1208. <script src="~/Content/Libs/jsPdf/CustomFonts/iwbyue-bold.js"></script>
  1209. <script id="pdf-script">
  1210. window.jsPDF = window.jspdf.jsPDF;
  1211. var doc, mr = 20, mw = 210 - mr, mh = 297 - mr, w = 0, h = 0;
  1212. function ReportToPdf() {
  1213. var group = $('#report').data("group-info"), data = $('#report').data("report-info");
  1214. //console.log("ReportToPdf", group, data);
  1215. doc = new jsPDF('p', 'mm', 'a4');
  1216. doc.addFileToVFS('iwbyue-normal.ttf', font);
  1217. doc.addFont('iwbyue-normal.ttf', 'iwbyue', 'normal');
  1218. doc.addFileToVFS('iwbyue-bold.ttf', fontb);
  1219. doc.addFont('iwbyue-bold.ttf', 'iwbyue', 'bold');
  1220. // set font
  1221. doc.setFont("iwbyue", "normal");
  1222. doc.setTextColor(2, 89, 90);
  1223. w = mr;
  1224. h = mr;
  1225. Face(group);
  1226. if (group) {
  1227. WriteTitle("演练信息");
  1228. Info1(group);
  1229. }
  1230. if (data) {
  1231. WriteTitle("演练过程");
  1232. Info2(data);
  1233. WriteTitle("演练能力");
  1234. Info3(data);
  1235. WriteTitle("能力解析");
  1236. Info4(data);
  1237. }
  1238. doc.save("@(group.Name)演练报告@(DateTime.Now.ToString("yyyyMMddHHmm")).pdf");
  1239. }
  1240. //封面
  1241. function Face(group) {
  1242. //var name = "@(SettingManager.GetSettingValue(IwbSettingNames.ReportCompany))";
  1243. var name = group.campName;
  1244. var hh = mh / 2 - 50;
  1245. doc.setFontSize(30);
  1246. var l = doc.getTextDimensions(name), lw = Math.ceil(l.w), lh = Math.ceil(l.h );
  1247. var ww = ((mw - lw - mr) / 2) + mr;
  1248. doc.text(name, ww, hh);
  1249. hh = hh + lh+10;
  1250. doc.setFontSize(28);
  1251. name = "@(SettingManager.GetSettingValue(IwbSettingNames.ReportName))";
  1252. l = doc.getTextDimensions(name), lw = Math.ceil(l.w), lh = Math.ceil(l.h);
  1253. ww = ((mw - lw - mr) / 2) + mr;
  1254. doc.text(name, ww, hh);
  1255. hh = mh / 2 + 50;
  1256. var date = new Date().format("yyyy - MM - dd");
  1257. doc.setFontSize(24);
  1258. l = doc.getTextDimensions(date), lw = Math.ceil(l.w);
  1259. ww = ((mw - lw - mr) / 2) + mr;
  1260. doc.text(date, ww, hh);
  1261. }
  1262. //演练信息
  1263. function Info1(group) {
  1264. doc.setFont("iwbyue", "bold");
  1265. var ww = WriteTitleSm("演练分组:");
  1266. WriteText(group.name, ww);
  1267. //WriteText("演练分组:{0}".format(group.name));
  1268. ww = WriteTitleSm("培 训 营:");
  1269. WriteText(group.campName, ww + 1);
  1270. ww = WriteTitleSm("演练主题:");
  1271. WriteText(group.packageName, ww);
  1272. ww = WriteTitleSm("演练时长:");
  1273. WriteText("{0} 分钟( {1} — {2} ) ".format(group.trainingMinute, new Date(group.startDate).format("yyyy-MM-dd hh:mm:ss"), new Date(group.endDate).format("yyyy-MM-dd hh:mm:ss")), ww);
  1274. ww = WriteTitleSm("演练角色:");
  1275. WriteText(group.roleNames, ww, true);
  1276. ww = WriteTitleSm("演练成绩:");
  1277. WriteText($("#eval-result").text(), ww);
  1278. }
  1279. //演练过程
  1280. function Info2(data) {
  1281. WriteTitleSm("情景演变图:", true);
  1282. h = h - 5;
  1283. C1();
  1284. AddPage();
  1285. @*WriteTitleSm("情景蜂巢图:", true);
  1286. h = h - 5;
  1287. C2();
  1288. AddPage();*@
  1289. WriteTitleSm("演练过程得分详解:", true);
  1290. C3(data.scenes);
  1291. function C1() {
  1292. $('#tree-chart').find('canvas').each(function (i, v) {
  1293. var chart = echarts.getInstanceByDom(document.getElementById('tree-container_' + (i + 1)));
  1294. var img = new Image();
  1295. img.src = chart.getDataURL({
  1296. pixelRatio: 1,
  1297. backgroundColor: '#fff'
  1298. });
  1299. h = h - 5;
  1300. var hh = 83;
  1301. if (h+hh > mh) {
  1302. AddPage();
  1303. }
  1304. doc.addImage(img, 'JPEG', w+15, h, mw - mr-15, hh);
  1305. h = hh + h;
  1306. });
  1307. }
  1308. function C2() {
  1309. //console.log(window.Highcharts.charts);
  1310. //window.Highcharts.charts.forEach(function (v) {
  1311. // var hh = 100;
  1312. // if (h + hh > mh) {
  1313. // AddPage();
  1314. // }
  1315. // var svg = v.getSVG();
  1316. // //var canvas = document.createElement('canvas');
  1317. // //var dataUrl = v.getImageData();
  1318. // //console.log("111",dataUrl);
  1319. // //var img = new Image();
  1320. // //img.src = dataUrl;
  1321. // //var imgData = canvas.toDataURL('image/png');
  1322. // //var img = v.getImageData();
  1323. // //doc.addImage(imgData, 'JPEG', w, h, mw - mr, hh);
  1324. // doc.addSvgAsImage(svg, w, h, mw - mr, hh);
  1325. // h = hh + h;
  1326. //});
  1327. //window.Highcharts.charts.forEach(function (v) {
  1328. // var hh = 90;
  1329. // if (h + hh > mh) {
  1330. // AddPage();
  1331. // }
  1332. // var svg = v.getSVG();
  1333. // var canvas = document.createElement('canvas');
  1334. // canvas.width = mw - mr;
  1335. // canvas.height = hh;
  1336. // var ctx = canvas.getContext("2d");
  1337. // ctx.fillStyle = "#fff";
  1338. // ctx.fillRect(0, 0, canvas.width, canvas.height);
  1339. // var ops = {
  1340. // ignoreMouse: true,
  1341. // ignoreAnimation: true,
  1342. // ignoreDimensions: true
  1343. // };
  1344. // var vv = window.canvg.Canvg.fromString(ctx, svg, ops);
  1345. // vv.render(ops);
  1346. // doc.addImage(canvas.toDataURL("image/jpeg", 1.0),"png" , w, h, mw - mr, hh);
  1347. // h = hh + h;
  1348. //});
  1349. $('#fc-chart').find('svg').each(function (i,v) {
  1350. var hh = 83;
  1351. if (h + hh > mh) {
  1352. AddPage();
  1353. }
  1354. var svg = $(v).parent()[0].innerHTML;
  1355. if (svg)
  1356. svg = svg.replace(/\r?\n|\r/g, '').trim();
  1357. var canvas = document.createElement('canvas');
  1358. var www=15,ww = mw - mr - www;
  1359. canvas.width =ww;
  1360. canvas.height = hh;
  1361. var ctx = canvas.getContext("2d");
  1362. ctx.fillStyle = "#fff";
  1363. ctx.fillRect(0, 0, canvas.width, canvas.height);
  1364. var ops = {
  1365. ignoreMouse: true,
  1366. ignoreAnimation: true,
  1367. ignoreDimensions: true
  1368. };
  1369. var vv = window.canvg.Canvg.fromString(ctx, svg, ops);
  1370. vv.resize();
  1371. vv.start();
  1372. //vv.render(ops);
  1373. doc.addImage(canvas.toDataURL("image/png"),"png" , w+www, h, ww, hh);
  1374. h = hh + h;
  1375. });
  1376. //$('#fc-chart').find('svg').each(function (i, v) {
  1377. // var hh = 90;
  1378. // if (h + hh > mh) {
  1379. // AddPage();
  1380. // }
  1381. // //var svg = $('#fc-container_' + (i + 1)).find('svg').parent()[0].innerHTML;
  1382. // //var svg = $(v).parent()[0].innerHTML;
  1383. // //var canvas = document.createElement('canvas');
  1384. // //console.log(svg);
  1385. // //if (svg)
  1386. // // svg = svg.replace(/\r?\n|\r/g, '').trim();
  1387. // //var vv = window.canvg.Canvg.fromString(canvas, svg);
  1388. // //vv.start();
  1389. // //console.log(canvas);
  1390. // // $(body).append(canvas);
  1391. // //var imgData = canvas.toDataURL('image/png');
  1392. // //var img = v.getImageData();
  1393. // //var img = new Image();
  1394. // //var imgData = $(v).attr("src").replace("data:image/svg+xml;base64,", "");
  1395. // //img.src = imgData
  1396. // //console.log(imgData);
  1397. // //var img = ImgToDataUrl($(v).attr("src"), CallbackBase64);
  1398. // //doc.addImage(svg, 'png', w, h, mw - mr, hh);
  1399. // doc.addSvgAsImage($(v).attr("src"), w, h, mw - mr, hh);
  1400. // h = hh + h;
  1401. //});
  1402. }
  1403. function C3(data) {
  1404. if (data&&data.length) {
  1405. data.forEach(function(v) {
  1406. Round(v.roundIndex);
  1407. Scene(v.sceneInfos);
  1408. });
  1409. }
  1410. function Round(index) {
  1411. var txt = "第 {0} 轮".format(index);
  1412. doc.setFontSize(16);
  1413. doc.setFont("iwbyue", "bold");
  1414. var l = doc.getTextDimensions(txt), lw = Math.ceil(l.w), lh = Math.ceil(l.h);
  1415. //console.log(l);
  1416. var ww = ((mw - lw - mr) / 2) + mr;
  1417. doc.text(txt, ww, h);
  1418. doc.setFont("iwbyue", "normal");
  1419. h = h + 2;
  1420. doc.setLineWidth(1);
  1421. doc.setLineDash([0]);
  1422. doc.setDrawColor(2, 89, 90);
  1423. doc.line(ww - 3, h, ww + lw + 3, h);
  1424. doc.setFontSize(16);
  1425. h = h + 10;
  1426. if (h > mh) {
  1427. AddPage();
  1428. }
  1429. }
  1430. function Scene(data) {
  1431. if (data && data.length) {
  1432. data.forEach(function (v) {
  1433. WriteTitleSm("[情景] {0}".format(v.name), true);
  1434. WriteText(v.description, 5, true, 13, 2);
  1435. Behavior(v.behaviors);
  1436. doc.setLineWidth(0.1);
  1437. doc.setLineDash([2.5]);
  1438. doc.setDrawColor(2, 89, 90);
  1439. h = h - 5;
  1440. doc.line(mr - 5, h, mw + 5, h);
  1441. h = h + 10;
  1442. if (h > mh) {
  1443. AddPage();
  1444. }
  1445. doc.setFontSize(16);
  1446. });
  1447. }
  1448. }
  1449. function Behavior(data) {
  1450. if (data && data.length) {
  1451. data.forEach(function (v) {
  1452. // WriteTitleSm("[规则][得分:{1}/{2}] {0}".format(v.name, v.score, v.fullScore), true);
  1453. WriteTitleSm("[规则] [得分:{1}/{2}] {0}".format("", v.score, v.fullScore), true,14);
  1454. WriteText(v.description, 5, true, 12, 2);
  1455. if (h > mh) {
  1456. AddPage();
  1457. }
  1458. });
  1459. }
  1460. }
  1461. }
  1462. function ImgToDataUrl(src, callback, imageType) {
  1463. var img = new Image();
  1464. imageType = imageType || 'image/png';
  1465. img.setAttribute('crossOrigin', 'anonymous');
  1466. img.onload = function () {
  1467. /*image completely converted to base64string */
  1468. var canvas = document.createElement('CANVAS');
  1469. var ctx = canvas.getContext('2d');
  1470. canvas.height = this.height;
  1471. canvas.width = this.width;
  1472. ctx.drawImage(this, 0, 0);
  1473. var dataURL = canvas.toDataURL(imageType);
  1474. //img.src = dataURL;
  1475. /* call back function */
  1476. callback(dataURL);
  1477. };
  1478. img.src = src;
  1479. if (img.complete || img.complete === undefined) {
  1480. img.src = src;
  1481. }
  1482. return img;
  1483. }
  1484. function CallbackBase64(base64Img)
  1485. {
  1486. /*base64Img contains full base64string of image */
  1487. console.log("XXXXX",base64Img);
  1488. }
  1489. }
  1490. //演练能力
  1491. function Info3(data) {
  1492. WriteTitleSm("轮次评分:", true);
  1493. C4();
  1494. WriteTitleSm("四功评析:", true);
  1495. C5();
  1496. WriteTitleSm("五力评析:", true);
  1497. C6(data.scenes);
  1498. function C4() {
  1499. var chart = echarts.getInstanceByDom(document.getElementById('score-container_round'));
  1500. var img = new Image();
  1501. img.src = chart.getDataURL({
  1502. pixelRatio: 1,
  1503. backgroundColor: '#fff'
  1504. });
  1505. h = h - 5;
  1506. var hh = 12;
  1507. if (h+hh > mh) {
  1508. AddPage();
  1509. }
  1510. doc.addImage(img, 'JPEG', w, h, mw - mr, hh);
  1511. h = hh + h+10;
  1512. }
  1513. function C5() {
  1514. var chart = echarts.getInstanceByDom(document.getElementById('score-container_sg'));
  1515. var img = new Image();
  1516. img.src = chart.getDataURL({
  1517. pixelRatio: 1,
  1518. backgroundColor: '#fff'
  1519. });
  1520. h = h - 5;
  1521. var hh = 90;
  1522. if (h+hh > mh) {
  1523. AddPage();
  1524. }
  1525. doc.addImage(img, 'JPEG', w, h, mw - mr, hh);
  1526. h = hh + h+10;
  1527. }
  1528. function C6(data) {
  1529. var chart = echarts.getInstanceByDom(document.getElementById('score-container_wl'));
  1530. var img = new Image();
  1531. img.src = chart.getDataURL({
  1532. pixelRatio: 1,
  1533. backgroundColor: '#fff'
  1534. });
  1535. h = h - 5;
  1536. var hh = 35 * data.length || 105;
  1537. if (h+hh > mh) {
  1538. AddPage();
  1539. }
  1540. doc.addImage(img, 'JPEG', w, h, mw - mr, hh);
  1541. h = hh + h+10;
  1542. }
  1543. }
  1544. var th = 13, th2 = 9, tw1 = 34, tw2 = 14, tw3 = 19,mr2=5;
  1545. function Info4(data) {
  1546. doc.setFontSize(10);
  1547. var ll = doc.getTextDimensions("我");
  1548. var c = Math.floor((tw1 - mr2) / ll.w);
  1549. WriteTitleSm("四功五力解析详情:", true);
  1550. h = h - 5;
  1551. C9(data.scenes);
  1552. h = h + 10;
  1553. //WriteTitle("系统评语:", true);
  1554. WriteTitleSm("四项基本功:", true);
  1555. WriteText(data.reportEvalStrings[0].content || "无", 0, true, 12, 2);
  1556. WriteTitleSm("五项能力:", true);
  1557. WriteText(data.reportEvalStrings[1].content || "无", 0, true, 12, 2);
  1558. WriteTitleSm("成绩与不足:", true);
  1559. WriteText(data.reportEvalStrings[2].content || "无", 0, true, 12, 2);
  1560. WriteTitleSm("专家评语:", true);
  1561. WriteText(data.reportEvalStrings[3].content || "无", 0, true, 12, 2);
  1562. function C9(data) {
  1563. if (data&&data.length) {
  1564. data.forEach(function (v) {
  1565. RoundTh(v.roundIndex);
  1566. SceneTd(v.sceneInfos);
  1567. var hh = WriteSceneName("轮次总结");
  1568. Tags(v.behaviorTags, hh);
  1569. h=h+hh;
  1570. doc.line(mr, h, mw, h);
  1571. });
  1572. }
  1573. function RoundTh(index) {
  1574. //var th = window.th, tw1 = window.tw1, tw2 = window.tw2, tw3 = window.tw3;
  1575. w = mr;
  1576. //doc.setFontType("bold");
  1577. doc.setFontSize(20);
  1578. doc.setFont("iwbyue", "bold");
  1579. var txt = "第 {0} 轮".format(index);
  1580. var l = doc.getTextDimensions(txt);
  1581. var ww = mr + 15;
  1582. var hh = h + (th - l.h) / 2 + l.h;
  1583. doc.setLineWidth(0.2);
  1584. doc.setDrawColor(2, 89, 90);
  1585. doc.line(mr, h, mw, h);
  1586. doc.line(mr, h, mr, h+th);
  1587. doc.line(mw, h, mw, h + th);
  1588. doc.text(txt, ww, hh);
  1589. doc.setFontSize(14);
  1590. doc.setLineWidth(0.1);
  1591. doc.setDrawColor(255, 0, 0);
  1592. doc.setFillColor(255, 0, 0);
  1593. //doc.setFontType("normal");
  1594. var tw = 20;
  1595. ww = mw - tw * 3 - 10;
  1596. doc.circle(ww, h+th/2, 2.5, "FD");
  1597. doc.text("及格", ww + 5, h + th/2+2);
  1598. ww = ww + tw;
  1599. doc.setDrawColor(255, 165, 0);
  1600. doc.setFillColor(255, 165, 0);
  1601. doc.circle(ww, h+th/2, 2.5, "FD");
  1602. doc.text("良好", ww + 5, h + th/2 +2 );
  1603. ww = ww + tw;
  1604. doc.setDrawColor(0,255, 0);
  1605. doc.setFillColor(0,255, 0);
  1606. doc.circle(ww, h+th/2, 2.5, "FD");
  1607. doc.text("优秀", ww + 5, h + th / 2 + 2);
  1608. doc.setLineWidth(0.2);
  1609. h = th + h;
  1610. doc.setDrawColor(2, 89, 90);
  1611. doc.line(mr, h, mw, h);
  1612. //doc.setFontType("bold");
  1613. doc.line(mr,h,mr,h+th2*2);
  1614. doc.line(mr + tw1, h, mr + tw1, h + th2 *2);
  1615. txt = "情 景 信 息";
  1616. l = doc.getTextDimensions(txt);
  1617. ww = mr + (tw1 - l.w) / 2;
  1618. hh = h + (th2*2 - l.h) / 2 + l.h;
  1619. doc.text(txt, ww, hh);
  1620. doc.line(mr + tw1 + tw2 * 3 + tw3, h, mr + tw1 + tw2 * 3 + tw3, h + th2*2);
  1621. txt = "四 项 基 本 功";
  1622. l = doc.getTextDimensions(txt);
  1623. hh = h + (th2 - l.h) / 2 + l.h;
  1624. ww = mr+tw1 + (tw2 * 3 + tw3 - l.w) / 2;
  1625. doc.text(txt, ww, hh);
  1626. doc.line(mw, h, mw, h + th2*2);
  1627. txt = "五 项 能 力";
  1628. l = doc.getTextDimensions(txt);
  1629. ww = mr + tw1 + tw2 * 3 + tw3+ (tw2 * 4 + tw3 - l.w) / 2;
  1630. hh = h + (th2 - l.h) / 2 + l.h;
  1631. doc.text(txt, ww, hh );
  1632. doc.line(mr + tw1, h + th2, mw, h + th2);
  1633. h = th2 + h;
  1634. doc.setFontSize(10);
  1635. //doc.setFontType("normal");
  1636. w = mr + tw1 + tw2;
  1637. doc.line(w, h, w, h + th2);
  1638. txt = "对上级";
  1639. l = doc.getTextDimensions(txt);
  1640. ww = w - (tw2 - l.w) / 2 - l.w;
  1641. hh = h + (th2 - l.h) / 2 + l.h;
  1642. doc.text(txt, ww, hh);
  1643. w = w+ tw2;
  1644. doc.line(w, h, w, h + th2);
  1645. txt = "对下级";
  1646. ww = w - (tw2 - l.w) / 2 - l.w;
  1647. doc.text(txt, ww, hh);
  1648. w = w+ tw3;
  1649. doc.line(w, h, w, h + th2);
  1650. txt = "对相关单位";
  1651. //doc.setFontSize(8);
  1652. l = doc.getTextDimensions(txt);
  1653. ww = w - (tw3 - l.w) / 2 - l.w;
  1654. doc.text(txt, ww, hh);
  1655. w = w+ tw2;
  1656. txt = "对媒体";
  1657. //doc.setFontSize(10);
  1658. l = doc.getTextDimensions(txt);
  1659. ww = w - (tw2 - l.w) / 2 - l.w;
  1660. doc.text(txt, ww, hh);
  1661. w = w + tw2;
  1662. doc.line(w, h, w, h + th2);
  1663. txt = "协调力";
  1664. ww = w - (tw2 - l.w) / 2 - l.w;
  1665. doc.text(txt, ww, hh);
  1666. w = w + tw2;
  1667. doc.line(w, h, w, h + th2);
  1668. txt = "决策力";
  1669. ww = w - (tw2 - l.w) / 2 - l.w;
  1670. doc.text(txt, ww, hh);
  1671. w = w + tw2;
  1672. doc.line(w, h, w, h + th2);
  1673. txt = "掌控力";
  1674. ww = w - (tw2 - l.w) / 2 - l.w;
  1675. doc.text(txt, ww, hh);
  1676. w = w + tw3;
  1677. doc.line(w, h, w, h + th2);
  1678. txt = "舆论引导力";
  1679. //doc.setFontSize(8);
  1680. l = doc.getTextDimensions(txt);
  1681. ww = w - (tw3 - l.w) / 2 - l.w;
  1682. doc.text(txt, ww, hh);
  1683. w = w + tw2;
  1684. txt = "研判力";
  1685. //doc.setFontSize(10);
  1686. l = doc.getTextDimensions(txt);
  1687. ww = w - (tw2 - l.w) / 2 - l.w;
  1688. doc.text(txt, ww, hh);
  1689. h = h + th2;
  1690. doc.line(mr, h, mw, h);
  1691. }
  1692. function SceneTd(data) {
  1693. doc.setFontSize(10);
  1694. if (data&&data.length) {
  1695. data.forEach(function (v) {
  1696. var hh= WriteSceneName(v.name);
  1697. Tags(v.behaviorTags, hh);
  1698. h=h+hh;
  1699. doc.line(mr, h, mw, h);
  1700. });
  1701. }
  1702. }
  1703. function WriteSceneName(txt) {
  1704. var cc = Math.ceil(txt.length / c);
  1705. var hh = cc * ll.h + mr2;
  1706. doc.setLineWidth(0.2);
  1707. doc.setDrawColor(2, 89, 90);
  1708. doc.line(mr, h, mr, h + hh);
  1709. doc.line(mr + tw1, h, mr + tw1, h + hh);
  1710. var txt2 = doc.splitTextToSize(txt, tw1 - mr2);
  1711. doc.text(txt2, mr + mr2 / 2, h + ll.h + mr2 / 2);
  1712. return hh;
  1713. }
  1714. function Tags(tags, hh) {
  1715. if (tags ) {
  1716. w = mr + tw1;
  1717. for (var i = 0; i < 9; i++) {
  1718. var tag = tags[i]||{level:0};
  1719. var ww = i == 2 || i == 7 ? tw3 : tw2;
  1720. Tag(tag.level, ww, hh);
  1721. }
  1722. }
  1723. }
  1724. function Tag(level, ww, hh) {
  1725. switch (level) {
  1726. case 1:
  1727. doc.setDrawColor(255, 0, 0);
  1728. doc.setFillColor(255, 0, 0);
  1729. break;
  1730. case 2:
  1731. doc.setDrawColor(255, 165, 0);
  1732. doc.setFillColor(255, 165, 0);
  1733. break;
  1734. case 3:
  1735. doc.setDrawColor(0, 255, 0);
  1736. doc.setFillColor(0, 255, 0);
  1737. break;
  1738. default:
  1739. doc.setDrawColor(221, 221, 221);
  1740. doc.setFillColor(221, 221, 221);
  1741. break;
  1742. }
  1743. doc.circle(w + ww / 2, h + hh / 2, 2, "FD");
  1744. w = w + ww;
  1745. doc.setDrawColor(2, 89, 90);
  1746. doc.line(w, h, w, h + hh);
  1747. }
  1748. }
  1749. }
  1750. function AddPage() {
  1751. w = mr;
  1752. h = mr;
  1753. doc.addPage("a4");
  1754. }
  1755. function WriteTitle(title) {
  1756. if (doc&&title) {
  1757. AddPage();
  1758. w = mr;
  1759. doc.setFontSize(24);
  1760. doc.setFont("iwbyue");
  1761. //doc.setFontType("bold");
  1762. doc.text(title, w + 10, h);
  1763. //doc.setFontType("normal");
  1764. h = h + 5;
  1765. doc.setLineWidth(1);
  1766. doc.setDrawColor(2, 89, 90);
  1767. doc.line(mr - 5, h, mw + 5, h);
  1768. doc.setFontSize(16);
  1769. h = h + 10;
  1770. if (h > mh) {
  1771. AddPage();
  1772. }
  1773. }
  1774. }
  1775. function WriteTitleSm(title, hh,fs) {
  1776. if (doc&&title) {
  1777. w = mr;
  1778. fs = fs || 16;
  1779. doc.setFontSize(fs);
  1780. //doc.setFontType("bold");
  1781. doc.text(title, w, h);
  1782. var dim = doc.getTextDimensions(title);
  1783. //console.log(dim);
  1784. if (hh) {
  1785. h = h + 10;
  1786. if (h > mh) {
  1787. AddPage();
  1788. }
  1789. }
  1790. //doc.setFontType("normal");
  1791. return Math.ceil(dim.w);
  1792. }
  1793. }
  1794. function WriteText(txt, ww, long, fs, ti, rw) {
  1795. var hh = 0;
  1796. if (doc) {
  1797. fs = fs || 16;
  1798. doc.setFontSize(fs);
  1799. var www = mr;
  1800. rw = rw || mw;
  1801. if (ww) {
  1802. www = mr + ww;
  1803. }
  1804. if (txt) {
  1805. if (long) {
  1806. var txt1 = txt.split('');
  1807. var l = GetTextDimensions(txt1, doc), lw = l.w, lh = Math.ceil(l.h + 2);
  1808. hh = lh;
  1809. if (ti) {
  1810. www = www + ti * lw;
  1811. }
  1812. txt = txt.split('');
  1813. for (var i = 0; i < txt.length; i++) {
  1814. doc.text(txt[i], www, h);
  1815. www = www + lw;
  1816. if (www >= rw) {
  1817. www = mr + ww;
  1818. h = h + lh;
  1819. hh = hh + lh;
  1820. if (h > mh) {
  1821. AddPage();
  1822. }
  1823. }
  1824. }
  1825. } else {
  1826. doc.text(txt, www, h);
  1827. }
  1828. }
  1829. h = h + 10;
  1830. if (h > mh) {
  1831. AddPage();
  1832. }
  1833. }
  1834. return hh;
  1835. }
  1836. function GetTextDimensions(txt, doc,i) {
  1837. if (txt[0] || i < 10) {
  1838. i = i || 0;
  1839. var reg = /\p{Unified_Ideograph}/u;
  1840. if (reg.test(txt[0])) {
  1841. return doc.getTextDimensions(txt[0]);
  1842. } else {
  1843. if (!txt[0]) {
  1844. i++;
  1845. }
  1846. txt.shift();
  1847. return GetTextDimensions(txt, doc,i);
  1848. }
  1849. }
  1850. return { w: 0, h: 0 };
  1851. }
  1852. </script>
  1853. }
  1854. }