event_form.html 60 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244
  1. <section id="page-title">
  2. <div class="row">
  3. <div class="col-sm-8">
  4. <h1 class="mainTitle">事件报表
  5. <i tooltip='请点击对应报表名称,查看相关数据。' tooltip-placement="right"
  6. class="fa ti-help-alt margin-left-10 fontcolor-five pointfont"></i>
  7. </h1>
  8. </div>
  9. </div>
  10. </section>
  11. <div class="col-md-12 col-sm-12">
  12. <div class="row deck_body" ng-controller="event_formCtrl">
  13. <div class="event_head">
  14. <div class="deck_head_L" ng-class="{ac:tap=='SJZS'}" ng-click="active('SJZS')">
  15. <span>事件总数</span>
  16. </div>
  17. <div class="deck_head_L" ng-class="{ac:tap=='SJLX'}" ng-click="active('SJLX')">
  18. <span>事件类型</span>
  19. </div>
  20. <div class="deck_head_L" ng-class="{ac:tap=='CLRZ'}" ng-click="active('CLRZ')">
  21. <span>处理人/组</span>
  22. </div>
  23. <div class="deck_head_L" ng-class="{ac:tap=='SFGS'}" ng-click="active('SFGS')">
  24. <span>三方公司</span>
  25. </div>
  26. <div class="deck_head_L" ng-class="{ac:tap=='QYDD'}" ng-click="active('QYDD')">
  27. <span>区域地点</span>
  28. </div>
  29. <div class="deck_head_L" ng-class="{ac:tap=='SJLY'}" ng-click="active('SJLY')">
  30. <span>事件来源</span>
  31. </div>
  32. </div>
  33. <div class="deck_cont">
  34. <!-- 筛选条件 -->
  35. <div class="deck_cont_head">
  36. <form class="col-xs-12 col-sm-12 form-inline P-0 clearfix">
  37. <!-- 按日/月/年统计 -->
  38. <div class="count fl" ng-if="tap=='SJZS'">
  39. <div class="dateItem dayBy" ng-click="dateItemClick('day')"
  40. ng-class="{active:dateItem == 'day'}">按日统计</div>
  41. <div class="dateItem monthBy" ng-click="dateItemClick('month')"
  42. ng-class="{active:dateItem == 'month'}">按月统计</div>
  43. <div class="dateItem yearBy" ng-click="dateItemClick('year')"
  44. ng-class="{active:dateItem == 'year'}">按年统计</div>
  45. </div>
  46. <!-- 选择日期 -->
  47. <div class="selectDate P-0 fl">
  48. <div class="selectDate-hd clearfix">
  49. <p class="fl">选择日期:</p>
  50. <div class="lastDate fr">
  51. <span ng-class="{active:searchstate=='year3'}" ng-click="chooseDate('year3')"
  52. ng-if="dateItem == 'year'">近三年</span>
  53. <strong ng-if="dateItem == 'year'">|</strong>
  54. <span ng-class="{active:searchstate=='year5'}" ng-click="chooseDate('year5')"
  55. ng-if="dateItem == 'year'">近五年</span>
  56. <span ng-class="{active:searchstate=='month3'}" ng-click="chooseDate('month3')"
  57. ng-if="dateItem == 'month'">近三月</span>
  58. <strong ng-if="dateItem == 'month'">|</strong>
  59. <span ng-class="{active:searchstate=='month6'}" ng-click="chooseDate('month6')"
  60. ng-if="dateItem == 'month'">近六月</span>
  61. <span ng-class="{active:searchstate=='week1'}" ng-click="chooseDate('week1')"
  62. ng-if="dateItem == 'day'">上一周</span>
  63. <strong ng-if="dateItem == 'day'">|</strong>
  64. <span ng-class="{active:searchstate=='month1'}" ng-click="chooseDate('month1')"
  65. ng-if="dateItem == 'day'">上一月</span>
  66. <strong ng-if="tap=='SJLY'">|</strong>
  67. <span ng-class="{active:searchstate=='year1'}" ng-click="chooseDate('year1')"
  68. ng-if="tap=='SJLY'">上一年</span>
  69. </div>
  70. </div>
  71. <div class="clearfix">
  72. <div class="form-group fl">
  73. <input type="text" ng-readonly="true" ng-change="timesChange(datepickerOptionsStart.datepickerMode)" ng-required="true" class="form-control smallline" uib-datepicker-popup="{{datepickerPopuptime}}" ng-model="starttimesModel" is-open="startOpened" ng-init="startOpened = false" ng-click="startOpen($event)" datepicker-options="datepickerOptionsStart" show-button-bar="false" />
  74. <i class="iconfont icon-yuqixinxiu form-dataIcon"></i>
  75. </div>
  76. <span class="form-line fl">一</span>
  77. <div class="form-group fl">
  78. <input type="text" ng-readonly="true" ng-change="timesChange(datepickerOptionsEnd.datepickerMode)" ng-required="true" class="form-control smallline" uib-datepicker-popup="{{datepickerPopuptime}}" ng-model="endtimesModel" is-open="endOpened" ng-init="endOpened = false" ng-click="endOpen($event)" datepicker-options="datepickerOptionsEnd" show-button-bar="false" />
  79. <i class="iconfont icon-yuqixinxiu form-dataIcon"></i>
  80. </div>
  81. </div>
  82. </div>
  83. <!-- 事件分类级别 -->
  84. <div class="selectSj P-0 fl" ng-if="tap=='SJLX'">
  85. <div class="selectSj-hd">
  86. <p>事件分类级别:</p>
  87. </div>
  88. <ui-select class="sj-select" ng-model="sjSelectedOne.value" theme="bootstrap">
  89. <ui-select-match placeholder="一级分类">
  90. {{$select.selected.name}}
  91. </ui-select-match>
  92. <ui-select-choices repeat="item in sjSelected">
  93. <div ng-bind-html="item.name"></div>
  94. </ui-select-choices>
  95. </ui-select>
  96. </div>
  97. <!-- 选择处理人/组 -->
  98. <div class="selectSj P-0 fl" ng-if="tap=='CLRZ'">
  99. <div class="selectSj-hd">
  100. <p>选择处理人/组:</p>
  101. </div>
  102. <ui-select class="sj-select" ng-model="groupSelectedOne.value" theme="bootstrap">
  103. <ui-select-match placeholder="全部">
  104. {{$select.selected.groupName}}
  105. </ui-select-match>
  106. <ui-select-choices repeat="item in groupSelected">
  107. <div ng-bind-html="item.groupName"></div>
  108. </ui-select-choices>
  109. </ui-select>
  110. </div>
  111. <!-- 选择三方公司 -->
  112. <div class="selectSj P-0 fl" ng-if="tap=='SFGS'">
  113. <div class="selectSj-hd">
  114. <p>选择三方公司:</p>
  115. </div>
  116. <ui-select class="sj-select" ng-model="companySelectedOne.value" theme="bootstrap">
  117. <ui-select-match placeholder="请选择">
  118. {{$select.selected.name}}
  119. </ui-select-match>
  120. <ui-select-choices repeat="item in companySelected">
  121. <div ng-bind-html="item.name"></div>
  122. </ui-select-choices>
  123. </ui-select>
  124. </div>
  125. <!-- 区域地点 -->
  126. <div class="selectSj P-0 fl" ng-if="tap=='QYDD'">
  127. <div class="selectSj-hd">
  128. <p>区域/地点:</p>
  129. </div>
  130. <ui-select class="sj-select" ng-model="areaSelectedOne.value" theme="bootstrap">
  131. <ui-select-match placeholder="区域">
  132. {{$select.selected.name}}
  133. </ui-select-match>
  134. <ui-select-choices repeat="item in areaSelected">
  135. <div ng-bind-html="item.name"></div>
  136. </ui-select-choices>
  137. </ui-select>
  138. </div>
  139. <!-- 搜索重置 -->
  140. <div class="col-xs-3 col-sm-3 pull-right P-0 searchBtnBox">
  141. <div class="btn btn_search fl" ng-click="mdxquery()">搜索</div>
  142. <div class="btn btn_reset fl" ng-click="reload()" ng-disabled="disabledParentGroup">重置</div>
  143. <div class="btn btn_export fl" ng-click="export()" id="exportToExcel"
  144. ng-disabled="disabledParentGroup">导出</div>
  145. </div>
  146. </form>
  147. </div>
  148. <!-- 事件总数 -->
  149. <div class="deck_cont_body" ng-if="tap=='SJZS'">
  150. <div class="deck_cont_body_TB1">
  151. <div class="TB">
  152. <div class="TB_head" ng-if="isArrays(sjzs_list)&&sjzs_list.length>0">
  153. <div class="TB_head_L">
  154. <div class="TB_LDZH fl" tooltip='事件状态已关单,并且有处理人的单子' tooltip-placement="top">
  155. <p>事件总数</p>
  156. <span>{{sjzs_num}}</span>
  157. </div>
  158. <div class="TB_ITEMS fl">
  159. <div class="TB_ITEM" tooltip='接单时间 – 建单时间' tooltip-placement="top">
  160. <p>平均响应时间</p>
  161. <span>{{sjzs_responseTime}}</span>
  162. </div>
  163. <div class="TB_ITEM" tooltip='处理完成时间 – 接单时间' tooltip-placement="top">
  164. <p>平均解决时间</p>
  165. <span>{{sjzs_resolvedTime}}</span>
  166. </div>
  167. <div class="TB_ITEM" tooltip='服务台关单回访满意度' tooltip-placement="top">
  168. <p>满意度</p>
  169. <span>{{sjzs_satisfactionRatio}}%</span>
  170. </div>
  171. </div>
  172. </div>
  173. </div>
  174. <div class="TB_cont">
  175. <table class="jry_table jry_table_head" cellspacing="0" cellpadding="16"
  176. style="font-weight:normal !important;table-layout:fixed">
  177. <thead>
  178. <tr>
  179. <th style="width:6%">
  180. 序号
  181. </th>
  182. <th style="width:10%" ng-click="tableSort('accdate')" tooltip='统计标的,当天(00:00:00 – 23:59:59)' tooltip-placement="top">
  183. <strong>
  184. 时间
  185. <em class="sort-wrap">
  186. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'accdatetop'}"></i>
  187. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'accdatebottom'}"></i>
  188. </em>
  189. </strong>
  190. </th>
  191. <th style="width:8%" ng-click="tableSort('sum')" tooltip='事件数量' tooltip-placement="top">
  192. <strong>
  193. 事件数量
  194. <em class="sort-wrap">
  195. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'sumtop'}"></i>
  196. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'sumbottom'}"></i>
  197. </em>
  198. </strong>
  199. </th>
  200. <th style="width:18%" ng-click="tableSort('responseTime')" tooltip='接单时间 – 建单时间' tooltip-placement="top">
  201. <strong>
  202. 平均响应时间
  203. <em class="sort-wrap">
  204. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'responseTimetop'}"></i>
  205. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'responseTimebottom'}"></i>
  206. </em>
  207. </strong>
  208. </th>
  209. <th style="width:18%" ng-click="tableSort('resolvedTime')" tooltip='处理完成时间 – 接单时间' tooltip-placement="top">
  210. <strong>
  211. 平均解决时间
  212. <em class="sort-wrap">
  213. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'resolvedTimetop'}"></i>
  214. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'resolvedTimebottom'}"></i>
  215. </em>
  216. </strong>
  217. </th>
  218. <th style="width:10%" tooltip='处理结果为:完全解决的单数' tooltip-placement="top">
  219. 完全解决
  220. </th>
  221. <th style="width:10%" tooltip='处理结果为:部分解决的单数' tooltip-placement="top">
  222. 部分解决
  223. </th>
  224. <th style="width:6%" tooltip='处理结果为:其它的工单数' tooltip-placement="top">
  225. 其他
  226. </th>
  227. <th style="width:14%" ng-click="tableSort('satisfactionRatio')" tooltip='服务台关单回访满意度' tooltip-placement="top">
  228. <strong>
  229. 满意度(%)
  230. <em class="sort-wrap">
  231. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'satisfactionRatiotop'}"></i>
  232. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'satisfactionRatiobottom'}"></i>
  233. </em>
  234. </strong>
  235. </th>
  236. </tr>
  237. </thead>
  238. </table>
  239. <div class="jry_table_wrap" ng-nicescroll nice-scroll-end="topEndComplete()">
  240. <table class="jry_table jry_table_body" cellspacing="0" cellpadding="16"
  241. style="font-weight:normal !important;margin-bottom: 16px;table-layout:fixed">
  242. <tbody class="tbody-hover">
  243. <tr ng-repeat="rowData in sjzs_list">
  244. <td style="width:6%">
  245. {{$index+1}}
  246. </td>
  247. <td style="width:10%">
  248. {{rowData.accdate}}
  249. </td>
  250. <td style="width:8%">
  251. {{rowData.sum}}
  252. </td>
  253. <td style="width:18%">
  254. {{rowData.responseTime}}
  255. </td>
  256. <td style="width:18%">
  257. {{rowData.resolvedTime}}
  258. </td>
  259. <td style="width:10%">
  260. {{rowData.allresult}}
  261. </td>
  262. <td style="width:10%">
  263. {{rowData.partresult}}
  264. </td>
  265. <td style="width:6%">
  266. {{rowData.otherresult}}
  267. </td>
  268. <td style="width:14%">
  269. {{rowData.satisfactionRatio}}%
  270. </td>
  271. </tr>
  272. </tbody>
  273. </table>
  274. </div>
  275. </div>
  276. </div>
  277. </div>
  278. <div class="noData" ng-if="isArrays(sjzs_list)&&sjzs_list.length==0">查询无记录</div>
  279. <div class="noData" ng-if="!isArrays(sjzs_list)"><img src="/assets/images/loading.gif" alt=""></div>
  280. </div>
  281. <!-- 事件类型 -->
  282. <div class="deck_cont_body" ng-if="tap=='SJLX'">
  283. <div class="deck_cont_body_TB1">
  284. <div class="TB">
  285. <div class="TB_head" ng-if="isArrays(sjlx_list)&&sjlx_list.length>0">
  286. <div class="TB_head_L">
  287. <div class="TB_LDZH fl" tooltip='事件状态已关单,并且有处理人的单子' tooltip-placement="top">
  288. <p>事件总数</p>
  289. <span>{{sjlx_num}}</span>
  290. </div>
  291. </div>
  292. </div>
  293. <div class="TB_cont">
  294. <table class="jry_table jry_table_head" cellspacing="0" cellpadding="16"
  295. style="font-weight:normal !important;table-layout:fixed">
  296. <thead>
  297. <tr>
  298. <th style="width:6%">
  299. 序号
  300. </th>
  301. <th style="width:22%" tooltip='统计标的,事件分类' tooltip-placement="top">
  302. 事件类型
  303. </th>
  304. <th style="width:10%" ng-click="tableSort('sum')" tooltip='此事件分类下的事件工单数量(包含子级工单)' tooltip-placement="top">
  305. <strong>
  306. 类型数量
  307. <em class="sort-wrap">
  308. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'sumtop'}"></i>
  309. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'sumbottom'}"></i>
  310. </em>
  311. </strong>
  312. </th>
  313. <th style="width:10%" tooltip='分类下工单占比' tooltip-placement="top">
  314. 类型占比
  315. </th>
  316. <th style="width:14%" ng-click="tableSort('responseTime')" tooltip='接单时间 – 建单时间' tooltip-placement="top">
  317. <strong>
  318. 平均响应时间
  319. <em class="sort-wrap">
  320. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'responseTimetop'}"></i>
  321. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'responseTimebottom'}"></i>
  322. </em>
  323. </strong>
  324. </th>
  325. <th style="width:14%" ng-click="tableSort('resolvedTime')" tooltip='处理完成时间 – 接单时间' tooltip-placement="top">
  326. <strong>
  327. 平均解决时间
  328. <em class="sort-wrap">
  329. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'resolvedTimetop'}"></i>
  330. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'resolvedTimebottom'}"></i>
  331. </em>
  332. </strong>
  333. </th>
  334. <th style="width:8%" tooltip='处理结果为:完全解决的单数' tooltip-placement="top">
  335. 完全解决
  336. </th>
  337. <th style="width:8%" tooltip='处理结果为:部分的工单数' tooltip-placement="top">
  338. 部分解决
  339. </th>
  340. <th style="width:8%" tooltip='处理结果为:其它的工单数' tooltip-placement="top">
  341. 其他
  342. </th>
  343. </tr>
  344. </thead>
  345. </table>
  346. <div class="jry_table_wrap" ng-nicescroll>
  347. <table class="jry_table jry_table_body" cellspacing="0" cellpadding="16"
  348. style="font-weight:normal !important;margin-bottom: 16px;table-layout:fixed">
  349. <tbody class="tbody-hover">
  350. <tr
  351. ng-repeat="rowData in sjlx_list">
  352. <td style="width:6%">
  353. {{$index+1}}
  354. </td>
  355. <td style="width:22%">
  356. {{rowData.category}}
  357. </td>
  358. <td style="width:10%">
  359. {{rowData.sum}}
  360. </td>
  361. <td style="width:10%">
  362. {{rowData.proportion}}
  363. </td>
  364. <td style="width:14%">
  365. {{rowData.responseTime}}
  366. </td>
  367. <td style="width:14%">
  368. {{rowData.resolvedTime}}
  369. </td>
  370. <td style="width:8%">
  371. {{rowData.allresult}}
  372. </td>
  373. <td style="width:8%">
  374. {{rowData.partresult}}
  375. </td>
  376. <td style="width:8%">
  377. {{rowData.otherresult}}
  378. </td>
  379. </tr>
  380. </tbody>
  381. </table>
  382. </div>
  383. </div>
  384. </div>
  385. </div>
  386. <div class="noData" ng-if="isArrays(sjlx_list)&&sjlx_list.length==0">查询无记录</div>
  387. <div class="noData" ng-if="!isArrays(sjlx_list)"><img src="/assets/images/loading.gif" alt=""></div>
  388. </div>
  389. <!-- 处理人/组 -->
  390. <div class="deck_cont_body" ng-if="tap=='CLRZ'">
  391. <div class="deck_cont_body_TB1">
  392. <div class="TB">
  393. <div class="TB_head">
  394. <div class="TB_head_L">
  395. <div class="TB_LDZH fl" tooltip='事件状态已关单,并且有处理人的单子' tooltip-placement="top">
  396. <p>事件总数</p>
  397. <span>{{clrz_num}}</span>
  398. </div>
  399. <div class="TB_ITEMS fl">
  400. <div class="TB_ITEM" tooltip='接单时间 – 建单时间' tooltip-placement="top">
  401. <p>平均响应时间</p>
  402. <span>{{clrz_responseTime}}</span>
  403. </div>
  404. <div class="TB_ITEM" tooltip='处理完成时间 – 接单时间' tooltip-placement="top">
  405. <p>平均解决时间</p>
  406. <span>{{clrz_resolvedTime}}</span>
  407. </div>
  408. <div class="TB_ITEM" tooltip='服务台关单回访满意度' tooltip-placement="top">
  409. <p>满意度</p>
  410. <span>{{clrz_satisfactionRatio}}%</span>
  411. </div>
  412. </div>
  413. </div>
  414. </div>
  415. <div class="TB_cont" ng-if="isArrays(clrz_list)&&clrz_list.length>0">
  416. <table class="jry_table jry_table_head" cellspacing="0" cellpadding="16"
  417. style="font-weight:normal !important;table-layout:fixed">
  418. <thead>
  419. <tr>
  420. <th style="width:6%" rowspan="2">
  421. 序号
  422. </th>
  423. <th style="width:7%" rowspan="2">
  424. <span tooltip='统计标的,事件分类' tooltip-placement="top">处理{{tableGroupSelectedOne == 1?'组':'人'}}</span>
  425. </th>
  426. <th style="width:7%" rowspan="2" ng-click="tableSort('sum')">
  427. <strong tooltip='此事件分类下的事件工单数量(包含子级工单)' tooltip-placement="top">
  428. 事件数量
  429. <em class="sort-wrap">
  430. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'sumtop'}"></i>
  431. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'sumbottom'}"></i>
  432. </em>
  433. </strong>
  434. </th>
  435. <th style="width:7%" rowspan="2">
  436. <span tooltip='分类下工单占比' tooltip-placement="top">事件占比</span>
  437. </th>
  438. <th style="width:32%" colspan="4">
  439. <span tooltip='按时响应次数' tooltip-placement="top">按时响应</span>
  440. </th>
  441. <th style="width:32%" colspan="4">
  442. <span tooltip='按时解决次数' tooltip-placement="top">按时解决</span>
  443. </th>
  444. <th style="width:7%" rowspan="2">
  445. <span tooltip='服务台关单回访满意度' tooltip-placement="top">满意度(%)</span>
  446. </th>
  447. </tr>
  448. <tr>
  449. <th style="width:8%">
  450. <span tooltip='按时响应次数' tooltip-placement="top">按时响应</span>
  451. </th>
  452. <th style="width:8%">
  453. <span tooltip='超时响应次数' tooltip-placement="top">超时响应</span>
  454. </th>
  455. <th style="width:8%">
  456. <span tooltip='接单时间 – 建单时间' tooltip-placement="top">平均响应时间</span>
  457. </th>
  458. <th style="width:8%">
  459. <span tooltip='超时响应次数占比,对比按时响应次数' tooltip-placement="top">超时响应占比</span>
  460. </th>
  461. <th style="width:8%">
  462. <span tooltip='按时解决次数' tooltip-placement="top">按时解决</span>
  463. </th>
  464. <th style="width:8%">
  465. <span tooltip='超时解决次数' tooltip-placement="top">超时解决</span>
  466. </th>
  467. <th style="width:8%">
  468. <span tooltip='处理完成时间 – 接单时间' tooltip-placement="top">平均解决时间</span>
  469. </th>
  470. <th style="width:8%">
  471. <span tooltip='超时解决次数占比,对比按时解决次数' tooltip-placement="top">超时解决占比</span>
  472. </th>
  473. </tr>
  474. </thead>
  475. </table>
  476. <div class="jry_table_wrap jry_table_wrap2" ng-nicescroll>
  477. <table class="jry_table jry_table_body" cellspacing="0" cellpadding="16"
  478. style="font-weight:normal !important;margin-bottom: 16px;table-layout:fixed">
  479. <tbody class="tbody-hover">
  480. <tr
  481. ng-repeat="rowData in clrz_list">
  482. <td style="width:6%">
  483. {{$index+1}}
  484. </td>
  485. <td style="width:7%">
  486. {{rowData.name}}
  487. </td>
  488. <td style="width:7%">
  489. {{rowData.sum}}
  490. </td>
  491. <td style="width:7%">
  492. {{rowData.proportion}}
  493. </td>
  494. <td style="width:8%">
  495. {{rowData.responseOnTime}}
  496. </td>
  497. <td style="width:8%">
  498. {{rowData.responseOverTime}}
  499. </td>
  500. <td style="width:8%">
  501. {{rowData.responseTime}}
  502. </td>
  503. <td style="width:8%">
  504. {{rowData.overTimeProportion}}%
  505. </td>
  506. <td style="width:8%">
  507. {{rowData.resolvedOnTime}}
  508. </td>
  509. <td style="width:8%">
  510. {{rowData.resolvedOverTime}}
  511. </td>
  512. <td style="width:8%">
  513. {{rowData.resolvedTime}}
  514. </td>
  515. <td style="width:8%">
  516. {{rowData.resolvedTimeProportion}}%
  517. </td>
  518. <td style="width:7%">
  519. {{rowData.satisfactionRatio}}%
  520. </td>
  521. </tr>
  522. </tbody>
  523. </table>
  524. </div>
  525. </div>
  526. </div>
  527. </div>
  528. <div class="noData" ng-if="isArrays(clrz_list)&&clrz_list.length==0">查询无记录</div>
  529. <div class="noData" ng-if="!isArrays(clrz_list)"><img src="/assets/images/loading.gif" alt=""></div>
  530. </div>
  531. <!-- 三方公司 -->
  532. <div class="deck_cont_body" ng-if="tap=='SFGS'">
  533. <div class="deck_cont_body_TB1">
  534. <div class="TB">
  535. <div class="TB_head">
  536. <div class="TB_head_L">
  537. <div class="TB_LDZH fl" tooltip='第三方公司名称' tooltip-placement="top">
  538. <p>公司总数</p>
  539. <span>{{sfgs_c_total}}</span>
  540. </div>
  541. <div class="TB_ITEMS fl">
  542. <div class="TB_ITEM" tooltip='第三方公司下面的人员总数' tooltip-placement="top">
  543. <p>人员总数</p>
  544. <span>{{sfgs_u_total}}</span>
  545. </div>
  546. <div class="TB_ITEM" tooltip='第三方公司人员处理事件总数。已关闭的单子' tooltip-placement="top">
  547. <p>解决事件总数</p>
  548. <span>{{sfgs_p_total}}</span>
  549. </div>
  550. <div class="TB_ITEM" tooltip='每个单子的平均解决时长' tooltip-placement="top">
  551. <p>平均解决时长</p>
  552. <span>{{sfgs_p_time}}</span>
  553. </div>
  554. </div>
  555. </div>
  556. </div>
  557. <div class="TB_cont" ng-if="isArrays(sfgs_list)&&sfgs_list.length>0">
  558. <table class="jry_table jry_table_head" cellspacing="0" cellpadding="16"
  559. style="font-weight:normal !important;table-layout:fixed">
  560. <thead>
  561. <tr>
  562. <th style="width:6%">
  563. 序号
  564. </th>
  565. <th style="width:22%" ng-click="tableSort('userName')" tooltip='第三方公司名称' tooltip-placement="top">
  566. 公司名称
  567. </th>
  568. <th style="width:18%" ng-click="tableSort('u_total')" tooltip='此公司下的人员数量' tooltip-placement="top">
  569. <strong>
  570. 人员总数
  571. <em class="sort-wrap">
  572. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'u_totaltop'}"></i>
  573. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'u_totalbottom'}"></i>
  574. </em>
  575. </strong>
  576. </th>
  577. <th style="width:18%" ng-click="tableSort('i_total')" tooltip='此公司处理的工单数量' tooltip-placement="top">
  578. <strong>
  579. 事件数量
  580. <em class="sort-wrap">
  581. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'i_totaltop'}"></i>
  582. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'i_totalbottom'}"></i>
  583. </em>
  584. </strong>
  585. </th>
  586. <th style="width:18%" ng-click="tableSort('response_time')" tooltip='接单时间 – 建单时间' tooltip-placement="top">
  587. <strong>
  588. 平均响应时长
  589. <em class="sort-wrap">
  590. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'response_timetop'}"></i>
  591. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'response_timebottom'}"></i>
  592. </em>
  593. </strong>
  594. </th>
  595. <th style="width:18%" ng-click="tableSort('resolved_time')" tooltip='处理完成时间 – 接单时间' tooltip-placement="top">
  596. <strong>
  597. 平均解决时长
  598. <em class="sort-wrap">
  599. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'resolved_timetop'}"></i>
  600. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'resolved_timebottom'}"></i>
  601. </em>
  602. </strong>
  603. </th>
  604. </tr>
  605. </thead>
  606. </table>
  607. <div class="jry_table_wrap" ng-nicescroll nice-scroll-end="topEndComplete()">
  608. <table class="jry_table jry_table_body" cellspacing="0" cellpadding="16"
  609. style="font-weight:normal !important;margin-bottom: 16px;table-layout:fixed">
  610. <tbody class="tbody-hover">
  611. <tr ng-repeat="rowData in sfgs_list">
  612. <td style="width:6%">
  613. {{$index+1}}
  614. </td>
  615. <td style="width:22%">
  616. {{rowData.userName}}
  617. </td>
  618. <td style="width:18%">
  619. {{rowData.u_total}}
  620. </td>
  621. <td style="width:18%">
  622. {{rowData.i_total}}
  623. </td>
  624. <td style="width:18%">
  625. {{rowData.response_time}}
  626. </td>
  627. <td style="width:18%">
  628. {{rowData.resolved_time}}
  629. </td>
  630. </tr>
  631. </tbody>
  632. </table>
  633. </div>
  634. </div>
  635. </div>
  636. </div>
  637. <div class="noData" ng-if="isArrays(sjzs_list)&&sjzs_list.length==0">查询无记录</div>
  638. <div class="noData" ng-if="!isArrays(sjzs_list)"><img src="/assets/images/loading.gif" alt=""></div>
  639. </div>
  640. <!-- 区域地点 -->
  641. <div class="deck_cont_body" ng-if="tap=='QYDD'">
  642. <div class="deck_cont_body_TB1">
  643. <div class="TB">
  644. <div class="TB_head">
  645. <div class="TB_head_L">
  646. <div class="TB_LDZH fl" tooltip='事件状态已关单,并且有处理人的单子' tooltip-placement="top">
  647. <p>事件总数</p>
  648. <span>{{qydd_num}}</span>
  649. </div>
  650. </div>
  651. </div>
  652. <div class="TB_cont" ng-if="isArrays(qydd_list)&&qydd_list.length>0">
  653. <table class="jry_table jry_table_head" cellspacing="0" cellpadding="16"
  654. style="font-weight:normal !important;table-layout:fixed">
  655. <thead>
  656. <tr>
  657. <th style="width:10%">
  658. 序号
  659. </th>
  660. <th style="width:30%" tooltip='统计标的,区域或者地点' tooltip-placement="top">
  661. 区域/地点
  662. </th>
  663. <th style="width:30%" ng-click="tableSort('sum')" tooltip='此标的下的事件工单数量(不包含子级工单)' tooltip-placement="top">
  664. <strong>
  665. 事件数量
  666. <em class="sort-wrap">
  667. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'sumtop'}"></i>
  668. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'sumbottom'}"></i>
  669. </em>
  670. </strong>
  671. </th>
  672. <th style="width:30%" tooltip='标的总体占比' tooltip-placement="top">
  673. 事件占比
  674. </th>
  675. </tr>
  676. </thead>
  677. </table>
  678. <div class="jry_table_wrap" ng-nicescroll>
  679. <table class="jry_table jry_table_body" cellspacing="0" cellpadding="16"
  680. style="font-weight:normal !important;margin-bottom: 16px;table-layout:fixed">
  681. <tbody class="tbody-hover">
  682. <tr
  683. ng-repeat="rowData in qydd_list">
  684. <td style="width:10%">
  685. {{$index+1}}
  686. </td>
  687. <td style="width:30%">
  688. {{rowData.name}}
  689. </td>
  690. <td style="width:30%">
  691. {{rowData.sum}}
  692. </td>
  693. <td style="width:30%">
  694. {{rowData.proportion}}
  695. </td>
  696. </tr>
  697. </tbody>
  698. </table>
  699. </div>
  700. </div>
  701. </div>
  702. </div>
  703. <div class="noData" ng-if="isArrays(qydd_list)&&qydd_list.length==0">查询无记录</div>
  704. <div class="noData" ng-if="!isArrays(qydd_list)"><img src="/assets/images/loading.gif" alt=""></div>
  705. </div>
  706. <!-- 事件来源 -->
  707. <div class="deck_cont_body" ng-if="tap=='SJLY'">
  708. <div class="deck_cont_body_TB1">
  709. <div class="TB">
  710. <div class="TB_head">
  711. <div class="TB_head_L">
  712. <div class="TB_LDZH fl" tooltip='事件状态已关单,并且有处理人的单子' tooltip-placement="top">
  713. <p>事件总数</p>
  714. <span>{{sjly_num}}</span>
  715. </div>
  716. </div>
  717. </div>
  718. <div class="TB_cont" ng-if="isArrays(sjly_list)&&sjly_list.length>0">
  719. <table class="jry_table jry_table_head" cellspacing="0" cellpadding="16"
  720. style="font-weight:normal !important;table-layout:fixed">
  721. <thead>
  722. <tr>
  723. <th style="width:10%">
  724. 序号
  725. </th>
  726. <th style="width:30%" tooltip='统计标的,工单的事件来源' tooltip-placement="top">
  727. 事件来源
  728. </th>
  729. <th style="width:30%" ng-click="tableSort('sum')" tooltip='此标的下的事件工单数量' tooltip-placement="top">
  730. <strong>
  731. 事件数量
  732. <em class="sort-wrap">
  733. <i class="sortItem iconfont icon-xiangshang" ng-class="{active:sortActive == 'sumtop'}"></i>
  734. <i class="sortItem iconfont icon-xiangxia" ng-class="{active:sortActive == 'sumbottom'}"></i>
  735. </em>
  736. </strong>
  737. </th>
  738. <th style="width:30%" tooltip='标的总体占比' tooltip-placement="top">
  739. 事件来源占比
  740. </th>
  741. </tr>
  742. </thead>
  743. </table>
  744. <div class="jry_table_wrap" ng-nicescroll>
  745. <table class="jry_table jry_table_body" cellspacing="0" cellpadding="16"
  746. style="font-weight:normal !important;margin-bottom: 16px;table-layout:fixed">
  747. <tbody class="tbody-hover">
  748. <tr
  749. ng-repeat="rowData in sjly_list">
  750. <td style="width:10%">
  751. {{$index+1}}
  752. </td>
  753. <td style="width:30%">
  754. {{rowData.name}}
  755. </td>
  756. <td style="width:30%">
  757. {{rowData.sum}}
  758. </td>
  759. <td style="width:30%">
  760. {{rowData.proportion}}
  761. </td>
  762. </tr>
  763. </tbody>
  764. </table>
  765. </div>
  766. </div>
  767. </div>
  768. </div>
  769. <div class="noData" ng-if="isArrays(sjly_list)&&sjly_list.length==0">查询无记录</div>
  770. <div class="noData" ng-if="!isArrays(sjly_list)"><img src="/assets/images/loading.gif" alt=""></div>
  771. </div>
  772. </div>
  773. </div>
  774. </div>
  775. </div>
  776. <style>
  777. p {
  778. margin-bottom: 0;
  779. }
  780. em,
  781. i,
  782. strong {
  783. font-style: normal;
  784. font-weight: normal;
  785. }
  786. .searchBtnBox {
  787. padding-top: 30px;
  788. }
  789. .deck_body {
  790. height: 100%;
  791. background: #f9f9f9;
  792. padding: 16px;
  793. }
  794. .event_head {
  795. height: 50px;
  796. width: 100%
  797. }
  798. .event_head .deck_head_L {
  799. float: left;
  800. width: 16.66%;
  801. height: 100%;
  802. text-align: center;
  803. border-top: 5px solid #EAEAEA;
  804. color: #717171;
  805. font-size: 14px;
  806. line-height: 45px;
  807. cursor: pointer;
  808. }
  809. .event_head .deck_head_R {
  810. float: left;
  811. width: 50%;
  812. height: 100%;
  813. text-align: center;
  814. border-top: 5px solid #EAEAEA;
  815. color: #717171;
  816. font-size: 14px;
  817. line-height: 45px;
  818. cursor: pointer;
  819. }
  820. .ac {
  821. background: #E6EEF4;
  822. color: #353535 !important;
  823. border-top: 5px solid #79A3C4 !important;
  824. }
  825. .deck_cont {
  826. width: 100%;
  827. height: 100%;
  828. padding: 16px;
  829. background: #fff;
  830. border-width: 0px 1px 1px 1px;
  831. border-width: 0px 1px 1px 1px;
  832. border-color: #EAEAEA;
  833. border-style: solid;
  834. }
  835. .deck_cont_head {
  836. border-bottom: 1px solid #EAEAEA;
  837. padding: 16px 10px 16px 10px;
  838. zoom: 1;
  839. }
  840. .deck_cont_head::after {
  841. content: "";
  842. display: block;
  843. height: 0;
  844. clear: both;
  845. visibility: hidden;
  846. }
  847. .P-0 {
  848. padding-left: 0px;
  849. padding-right: 0px;
  850. }
  851. .P-T-15 {
  852. padding-top: 16px;
  853. }
  854. .form-control.smallline {
  855. width: 120px;
  856. height: 34px;
  857. padding-left: 8px;
  858. padding-right: 8px;
  859. color: #999;
  860. font-size: 12px;
  861. }
  862. .deck_cont_body_TB1 {
  863. padding-top: 16px;
  864. }
  865. .deck_cont_body_TB2 {
  866. padding-top: 16px;
  867. }
  868. .TB_head {
  869. width: 100%;
  870. height: 54px
  871. }
  872. .TB_head_L {
  873. float: left;
  874. height: 100%;
  875. border-left: 8px solid #005395;
  876. padding: 0px 16px;
  877. }
  878. .TB_head_R {
  879. float: left;
  880. height: 100%;
  881. border-left: 8px solid #49A9EE;
  882. padding: 0px 16px;
  883. }
  884. .TB_ITEM {
  885. float: left;
  886. margin-right: 16px;
  887. text-align: center;
  888. }
  889. .MR_15 {
  890. margin-right: 16px;
  891. }
  892. .TB_ITEM p {
  893. font-size: 12px;
  894. color: #666
  895. }
  896. .TB_ITEM span {
  897. font-size: 24px;
  898. color: #333;
  899. line-height: 1.2;
  900. }
  901. .TB_LDZH{
  902. text-align: center;
  903. }
  904. .TB_LDZH p {
  905. font-size: 14px;
  906. color: #666
  907. }
  908. .TB_LDZH span {
  909. font-size: 32px;
  910. color: #333;
  911. line-height: 1.2;
  912. }
  913. .TB_ZHL {
  914. height: 100%;
  915. padding-top: 22px;
  916. }
  917. .TB_ZHL p {
  918. font-size: 12px;
  919. color: #7B7B7B
  920. }
  921. .TB_ZHL span {
  922. font-weight: 600;
  923. font-size: 22px;
  924. }
  925. .TB_cont {
  926. height: 350px;
  927. width: 100%;
  928. /* overflow-x: hidden; */
  929. /* overflow-y: auto; */
  930. }
  931. .TB_cont #ldzh {
  932. height: 100%;
  933. }
  934. .TB_cont #sjfx {
  935. height: 100%;
  936. }
  937. .TB_cont #sjqs {
  938. height: 100%;
  939. }
  940. .TB_cont #sjpd {
  941. height: 100%;
  942. }
  943. .TB_head_R1 {
  944. border-color: #005395;
  945. }
  946. .TB_LB {
  947. height: 100%;
  948. width: 100%;
  949. border: 1px solid #EAEAEA;
  950. }
  951. .TB_LB_head {
  952. height: 50px;
  953. background: #FAFAFA;
  954. border-bottom: 1px solid #EAEAEA;
  955. color: #333;
  956. font-size: 14px;
  957. }
  958. .TB_LB_body {
  959. height: 40px;
  960. border-bottom: 1px solid #EAEAEA;
  961. color: #7B7B7B;
  962. }
  963. .TB_LB_item {
  964. height: 100%;
  965. float: left;
  966. text-align: center;
  967. line-height: 40px;
  968. border-right: 1px solid #EAEAEA;
  969. }
  970. .TB_LB_head .TB_LB_item {
  971. line-height: 50px;
  972. font-weight: 600;
  973. }
  974. .btn-default {
  975. height: 30px;
  976. }
  977. .form-line {
  978. height: 34px;
  979. line-height: 34px;
  980. padding-left: 8px;
  981. padding-right: 8px;
  982. color: #979797;
  983. }
  984. .form-dataIcon {
  985. color: #ddd;
  986. font-size: 16px;
  987. position: absolute;
  988. right: 8px;
  989. top: 50%;
  990. transform: translateY(-50%);
  991. }
  992. .selectDate {
  993. width: 270px;
  994. }
  995. .selectDate .selectDate-hd {
  996. margin-bottom: 8px;
  997. }
  998. .selectDate .lastDate {
  999. color: #ddd;
  1000. }
  1001. .selectDate .lastDate span {
  1002. margin-left: 4px;
  1003. margin-right: 4px;
  1004. color: #005395;
  1005. font-size: 12px;
  1006. cursor: pointer;
  1007. }
  1008. .selectDate .lastDate span.active {
  1009. border-bottom: 1px solid #005395;
  1010. }
  1011. .selectDate .lastDate span:last-child {
  1012. margin-right: 0;
  1013. }
  1014. .searchBtnBox .btn {
  1015. width: 60px;
  1016. height: 34px;
  1017. line-height: 26px;
  1018. margin: 0 0 0 8px;
  1019. }
  1020. .btn_search {
  1021. background-color: #005395;
  1022. }
  1023. .btn_reset {
  1024. background-color: #fff;
  1025. border: 1px solid #ddd;
  1026. }
  1027. .btn_reset:hover {
  1028. border: 1px solid #999;
  1029. color: #666;
  1030. }
  1031. .btn_export {
  1032. padding: 3px 16px;
  1033. background-color: #e6eef4;
  1034. border: 1px #005395 solid;
  1035. color: #005395;
  1036. }
  1037. .btn_export:hover {
  1038. color: #79a3c4;
  1039. border-color: #79a3c4;
  1040. }
  1041. .TB_ITEMS {
  1042. margin-left: 24px;
  1043. margin-top: 10px;
  1044. }
  1045. /* table */
  1046. .jry_table_wrap {
  1047. margin-top: -1px;
  1048. height: 311px;
  1049. overflow-x: hidden;
  1050. overflow-y: auto;
  1051. }
  1052. .jry_table_wrap2 {
  1053. height: 280px;
  1054. }
  1055. .jry_table {
  1056. border: 1px solid #ddd;
  1057. text-align: center;
  1058. width: 100%;
  1059. position: relative;
  1060. font-size: 13px;
  1061. }
  1062. .jry_table_head {
  1063. margin-top: 16px;
  1064. background-color: #f9f9f9;
  1065. }
  1066. .jry_table_head th {
  1067. cursor: pointer;
  1068. }
  1069. .jry_table_head * {
  1070. font-weight: bold;
  1071. }
  1072. .jry_table_body .tbody-hover {
  1073. width: 100%;
  1074. }
  1075. .jry_table th,
  1076. .jry_table td {
  1077. word-wrap: break-word;
  1078. padding: 6px 2px;
  1079. border: 1px solid #ddd;
  1080. }
  1081. .jry_table th {
  1082. text-align: center;
  1083. }
  1084. .jry_table strong {
  1085. position: relative;
  1086. }
  1087. .sort-wrap {
  1088. position: absolute;
  1089. right: -12px;
  1090. top: 50%;
  1091. transform: translateY(-50%);
  1092. width: 12px;
  1093. display: flex;
  1094. flex-direction: column;
  1095. justify-content: center;
  1096. line-height: normal;
  1097. }
  1098. .sortItem {
  1099. font-size: 12px;
  1100. color: #ddd;
  1101. height: 12px;
  1102. cursor: pointer;
  1103. position: absolute;
  1104. }
  1105. .sortItem.active {
  1106. color: #999;
  1107. }
  1108. .sortItem.icon-xiangshang {
  1109. bottom: -2px;
  1110. }
  1111. .sortItem.icon-xiangxia {
  1112. top: -2px;
  1113. }
  1114. /* 按年月日统计 */
  1115. .count {
  1116. margin-top: 28px;
  1117. margin-right: 16px;
  1118. }
  1119. .count .dateItem {
  1120. width: 80px;
  1121. height: 34px;
  1122. text-align: center;
  1123. line-height: 34px;
  1124. border: 1px solid #ddd;
  1125. float: left;
  1126. cursor: pointer;
  1127. }
  1128. .count .dateItem:hover {
  1129. border-color: #e6eef4;
  1130. background-color: #e6eef4;
  1131. }
  1132. .count .dateItem.active {
  1133. border-color: #005395;
  1134. background-color: #e6eef4;
  1135. color: #005395;
  1136. }
  1137. /* 事件分类级别 */
  1138. .selectSj {
  1139. width: 258px;
  1140. margin-left: 16px;
  1141. }
  1142. .selectSj .selectSj-hd {
  1143. margin-bottom: 8px;
  1144. }
  1145. .selectSj .sj-select {
  1146. width: 100%;
  1147. }
  1148. .selectSj .sj-select .ui-select-match-text {
  1149. color: #999;
  1150. }
  1151. /* 查询无记录 */
  1152. .noData{
  1153. font-size: 16px;
  1154. text-align: center;
  1155. font-weight: bold;
  1156. margin-top: 16px;
  1157. width: 100%;
  1158. min-height: 420px;
  1159. }
  1160. .form-control.smallline{
  1161. background-color: #fff;
  1162. }
  1163. </style>