index.html 39 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003
  1. <style>
  2. /* 本页在 iframe 内:收紧外层边距,但保留少量内边距,避免左侧月份栏/上方工具栏被裁切 */
  3. html, body.inside-aside, body.inside-header {
  4. margin: 0 !important;
  5. padding: 0 !important;
  6. background: #fff !important;
  7. }
  8. #main,
  9. #content,
  10. .tab-content.tab-addtabs {
  11. margin-left: 0 !important;
  12. margin-right: 0 !important;
  13. }
  14. .content {
  15. padding: 10px 8px 0 8px !important;
  16. }
  17. #procuremen-layout > .panel-body {
  18. padding: 4px 0 0 0 !important;
  19. }
  20. #procuremen-layout.panel-default,
  21. #procuremen-layout.panel-intro {
  22. margin: 0 !important;
  23. border-radius: 0 !important;
  24. border-left: none !important;
  25. border-right: none !important;
  26. border-top: none !important;
  27. box-shadow: none !important;
  28. }
  29. #procuremen-layout.panel-intro > .panel-heading {
  30. padding: 8px 8px 0 8px !important;
  31. overflow: visible;
  32. min-height: 0;
  33. }
  34. #procuremen-layout.panel-intro > .panel-heading .panel-lead {
  35. margin-bottom: 0;
  36. }
  37. #procuremen-layout .tab-content,
  38. #procuremen-layout .tab-pane {
  39. padding: 0;
  40. margin: 0;
  41. }
  42. /* 月份栏与表格并排:主区 width:0 + flex:1,防止撑破导致左侧列被裁切 */
  43. .procuremen-layout { margin: 0 !important; }
  44. #procuremen-layout .procuremen-layout.row {
  45. display: flex !important;
  46. flex-direction: row !important;
  47. flex-wrap: nowrap !important;
  48. align-items: stretch;
  49. margin-left: 0 !important;
  50. margin-right: 0 !important;
  51. }
  52. @media (min-width: 768px) {
  53. #procuremen-layout .procuremen-layout.row {
  54. min-height: calc(100vh - 132px);
  55. }
  56. #procuremen-layout .procuremen-layout > .procuremen-sidebar,
  57. #procuremen-layout .procuremen-layout > .procuremen-main {
  58. float: none !important;
  59. display: flex;
  60. flex-direction: column;
  61. padding-left: 0 !important;
  62. padding-right: 0 !important;
  63. }
  64. #procuremen-layout .procuremen-layout > .procuremen-sidebar {
  65. flex: 0 0 96px !important;
  66. max-width: 96px !important;
  67. width: 96px !important;
  68. min-width: 96px !important;
  69. }
  70. #procuremen-layout .procuremen-layout > .procuremen-main {
  71. flex: 1 1 0% !important;
  72. width: 0 !important;
  73. max-width: none !important;
  74. min-width: 0 !important;
  75. }
  76. }
  77. #procuremen-layout .procuremen-main {
  78. overflow: hidden !important;
  79. padding-left: 0 !important;
  80. padding-right: 0 !important;
  81. flex: 1 1 0%;
  82. min-width: 0;
  83. width: 0;
  84. max-width: none !important;
  85. background: #fff;
  86. position: relative;
  87. z-index: 0;
  88. }
  89. .procuremen-sidebar {
  90. flex: 0 0 96px;
  91. width: 96px;
  92. min-width: 96px;
  93. max-width: 96px;
  94. align-self: stretch;
  95. min-height: 0;
  96. overflow-x: hidden;
  97. overflow-y: auto;
  98. border-right: 1px solid #d9d9d9;
  99. background: #fff;
  100. margin: 0 !important;
  101. padding: 4px 0 !important;
  102. box-sizing: border-box;
  103. position: relative;
  104. z-index: 1;
  105. float: none !important;
  106. }
  107. /* 手机:必须覆盖上方 nowrap/row !important,否则侧栏占满宽度、主表被挤成 0 宽呈空白 */
  108. @media (max-width: 767px) {
  109. #procuremen-layout .procuremen-layout.row {
  110. flex-direction: column !important;
  111. flex-wrap: nowrap !important;
  112. min-height: calc(100vh - 120px);
  113. align-items: stretch;
  114. }
  115. .procuremen-sidebar {
  116. flex: 0 0 auto !important;
  117. width: 100% !important;
  118. min-width: 0 !important;
  119. max-width: 100% !important;
  120. border-right: none;
  121. border-bottom: 1px solid #d9d9d9;
  122. max-height: 160px;
  123. align-self: stretch;
  124. }
  125. #procuremen-layout .procuremen-main {
  126. display: flex !important;
  127. flex-direction: column !important;
  128. flex: 1 1 auto !important;
  129. width: 100% !important;
  130. min-width: 0 !important;
  131. min-height: 280px;
  132. }
  133. #procuremen-layout .procuremen-main > .tab-content,
  134. #procuremen-layout .procuremen-main .tab-pane,
  135. #procuremen-layout .procuremen-main .widget-body {
  136. flex: 1 1 auto;
  137. min-height: 0;
  138. min-width: 0;
  139. display: flex;
  140. flex-direction: column;
  141. }
  142. }
  143. .procuremen-sidebar .year-title {
  144. font-weight: 600;
  145. padding: 8px 4px 4px;
  146. margin: 4px 0 2px;
  147. background: transparent;
  148. border-radius: 0;
  149. font-size: 12px;
  150. color: #8c8c8c;
  151. }
  152. .procuremen-sidebar .procuremen-ym-item {
  153. display: block;
  154. padding: 7px 4px;
  155. margin: 2px 6px;
  156. color: #595959;
  157. border-radius: 6px;
  158. text-decoration: none;
  159. border: none;
  160. font-size: 13px;
  161. text-align: center;
  162. }
  163. .procuremen-sidebar .procuremen-ym-item:hover {
  164. background: #f0f0f0;
  165. color: #1f1f1f;
  166. }
  167. .procuremen-sidebar .procuremen-ym-item.active {
  168. background: #e6f4ff;
  169. color: #1677ff;
  170. font-weight: 500;
  171. }
  172. #procuremen-layout .procuremen-main .widget-body {
  173. overflow: hidden;
  174. flex: 1 1 auto;
  175. min-height: 0;
  176. min-width: 0;
  177. display: flex;
  178. flex-direction: column;
  179. }
  180. /* 工具栏必须在 overflow 裁切区之外,否则会被裁掉上半截 */
  181. .procuremen-toolbar-host {
  182. display: block !important;
  183. flex: 0 0 auto !important;
  184. flex-shrink: 0 !important;
  185. height: auto !important;
  186. min-height: 44px !important;
  187. max-height: none !important;
  188. padding: 8px 8px 8px 4px !important;
  189. margin: 0 !important;
  190. border: none !important;
  191. border-bottom: 1px solid #f0f0f0 !important;
  192. width: 100%;
  193. box-sizing: border-box;
  194. overflow: visible !important;
  195. position: relative;
  196. z-index: 40;
  197. background: #fff;
  198. visibility: visible !important;
  199. opacity: 1 !important;
  200. }
  201. #procuremen-layout .procuremen-toolbar-host,
  202. #procuremen-layout .procuremen-wff-tabs {
  203. flex-shrink: 0;
  204. }
  205. #procuremen-layout .procuremen-main .fixed-table-pagination {
  206. background: #fff;
  207. border-top: 1px solid #e7e7e7;
  208. box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.04);
  209. }
  210. /* 主表 loading 遮罩盖不住右侧固定列克隆体,刷新时短暂露出旧「操作」按钮,加载中先隐藏 */
  211. #procuremen-layout .fixed-columns-right.procuremen-hide-fixed-right-loading {
  212. visibility: hidden !important;
  213. pointer-events: none !important;
  214. }
  215. /* 表格内若残留工具栏占位则隐藏(已挪到 host) */
  216. #procuremen-layout .procuremen-table-area .bootstrap-table > .fixed-table-toolbar {
  217. display: none !important;
  218. height: 0 !important;
  219. margin: 0 !important;
  220. padding: 0 !important;
  221. overflow: hidden !important;
  222. border: 0 !important;
  223. }
  224. /* 宿主内工具栏:完整可见 */
  225. #procuremen-layout .procuremen-toolbar-host > .fixed-table-toolbar,
  226. .procuremen-toolbar-host .fixed-table-toolbar {
  227. border: none !important;
  228. margin: 0 !important;
  229. padding: 0 !important;
  230. display: flex !important;
  231. align-items: center;
  232. justify-content: flex-start !important;
  233. flex-wrap: nowrap !important;
  234. flex-direction: row !important;
  235. gap: 12px;
  236. width: 100% !important;
  237. box-sizing: border-box;
  238. overflow: visible !important;
  239. min-height: 36px;
  240. height: auto !important;
  241. max-height: none !important;
  242. background: #fff;
  243. visibility: visible !important;
  244. opacity: 1 !important;
  245. position: relative;
  246. z-index: 20;
  247. }
  248. .procuremen-toolbar-host .fixed-table-toolbar .btn-group,
  249. .procuremen-toolbar-host .fixed-table-toolbar .columns {
  250. overflow: visible !important;
  251. }
  252. .procuremen-toolbar-host .fixed-table-toolbar .dropdown-menu {
  253. z-index: 2000;
  254. max-height: min(70vh, 520px);
  255. overflow-y: auto;
  256. overflow-x: hidden;
  257. }
  258. .procuremen-toolbar-host .fixed-table-toolbar > .pull-left,
  259. .procuremen-toolbar-host .fixed-table-toolbar > .bars.pull-left,
  260. .procuremen-toolbar-host .fixed-table-toolbar > .bs-bars.pull-left {
  261. float: none !important;
  262. margin: 0 !important;
  263. flex: 0 0 auto;
  264. max-width: 100%;
  265. visibility: visible !important;
  266. }
  267. .procuremen-toolbar-host .fixed-table-toolbar .toolbar,
  268. .procuremen-toolbar-host .fixed-table-toolbar .bs-bars .toolbar {
  269. display: inline-block !important;
  270. visibility: visible !important;
  271. margin: 0 !important;
  272. }
  273. .procuremen-toolbar-host .fixed-table-toolbar .toolbar .btn:not(.hide):not(.procuremen-stage-hide):not(.btn-selected-tips),
  274. .procuremen-toolbar-host .fixed-table-toolbar .btn:not(.hide):not(.procuremen-stage-hide):not(.btn-selected-tips) {
  275. display: inline-block !important;
  276. visibility: visible !important;
  277. opacity: 1 !important;
  278. font-size: 13px !important;
  279. line-height: 1.4 !important;
  280. height: auto !important;
  281. min-height: 30px;
  282. max-height: none !important;
  283. padding: 5px 12px !important;
  284. vertical-align: middle;
  285. overflow: visible !important;
  286. }
  287. /* 跨页选择提示 / 非本阶段按钮:必须能隐藏 */
  288. #procuremen-layout .btn-selected-tips,
  289. .procuremen-toolbar-host .btn-selected-tips,
  290. .procuremen-toolbar-host .fixed-table-toolbar .toolbar .btn.btn-selected-tips,
  291. .procuremen-toolbar-host .fixed-table-toolbar .btn.btn-selected-tips,
  292. .procuremen-toolbar-host .fixed-table-toolbar .toolbar .btn.hide,
  293. .procuremen-toolbar-host .fixed-table-toolbar .btn.hide,
  294. .procuremen-toolbar-host .fixed-table-toolbar .toolbar .btn.procuremen-stage-hide,
  295. .procuremen-toolbar-host .fixed-table-toolbar .btn.procuremen-stage-hide,
  296. #toolbar .btn.procuremen-stage-hide,
  297. #toolbar .btn.hide {
  298. display: none !important;
  299. visibility: hidden !important;
  300. pointer-events: none !important;
  301. }
  302. .procuremen-toolbar-host .fixed-table-toolbar .toolbar .btn .fa {
  303. font-size: 14px !important;
  304. }
  305. /* 表头标题文字后的小筛选图标 */
  306. #procuremen-layout .bootstrap-table th .th-inner.procuremen-th-with-filter {
  307. display: inline-flex !important;
  308. flex-direction: row;
  309. align-items: center;
  310. justify-content: center;
  311. gap: 4px;
  312. white-space: nowrap !important;
  313. line-height: 1.3 !important;
  314. }
  315. #procuremen-layout .bootstrap-table th .procuremen-th-label {
  316. display: inline;
  317. font-weight: 600;
  318. }
  319. #procuremen-layout .bootstrap-table th .procuremen-th-filter-dd {
  320. display: inline-block;
  321. vertical-align: middle;
  322. position: relative;
  323. }
  324. #procuremen-layout .bootstrap-table th .procuremen-th-filter-btn {
  325. color: #999;
  326. padding: 0 2px;
  327. font-size: 12px;
  328. line-height: 1;
  329. text-decoration: none !important;
  330. cursor: pointer;
  331. }
  332. #procuremen-layout .bootstrap-table th .procuremen-th-filter-btn:hover,
  333. #procuremen-layout .bootstrap-table th .procuremen-th-filter-btn.active {
  334. color: #3c8dbc;
  335. }
  336. #procuremen-layout .bootstrap-table th .procuremen-th-filter-dd > .dropdown-menu {
  337. min-width: 140px;
  338. max-height: 260px;
  339. overflow-y: auto;
  340. font-size: 12px;
  341. z-index: 1060;
  342. }
  343. body > .procuremen-th-filter-menu-float.dropdown-menu {
  344. min-width: 140px;
  345. max-height: 260px;
  346. overflow-y: auto;
  347. font-size: 12px;
  348. display: block;
  349. }
  350. #procuremen-layout .bootstrap-table th .procuremen-th-filter-dd > .dropdown-menu > li > a,
  351. body > .procuremen-th-filter-menu-float.dropdown-menu > li > a {
  352. padding: 4px 12px;
  353. white-space: nowrap;
  354. }
  355. #procuremen-layout .bootstrap-table th .procuremen-th-filter-dd > .dropdown-menu > li.active > a,
  356. body > .procuremen-th-filter-menu-float.dropdown-menu > li.active > a {
  357. background: #3c8dbc;
  358. color: #fff;
  359. }
  360. .procuremen-toolbar-host .fixed-table-toolbar > .pull-right,
  361. .procuremen-toolbar-host .fixed-table-toolbar > .columns.pull-right,
  362. .procuremen-toolbar-host .fixed-table-toolbar > .columns.columns-right,
  363. .procuremen-toolbar-host .fixed-table-toolbar .procuremen-toolbar-search-wrap {
  364. float: none !important;
  365. clear: none !important;
  366. margin: 0 0 0 auto !important;
  367. margin-right: 0 !important;
  368. padding: 0 !important;
  369. flex: 0 0 auto !important;
  370. display: flex !important;
  371. flex-direction: row !important;
  372. flex-wrap: nowrap !important;
  373. align-items: center !important;
  374. gap: 6px !important;
  375. visibility: visible !important;
  376. width: auto !important;
  377. max-width: none !important;
  378. order: 9 !important;
  379. white-space: nowrap !important;
  380. line-height: normal !important;
  381. }
  382. /* 图二:右侧图标按钮紧凑方形,与左侧彩色操作按钮区分 */
  383. .procuremen-toolbar-host .procuremen-toolbar-search-wrap > .btn,
  384. .procuremen-toolbar-host .procuremen-toolbar-search-wrap > .btn-group > .btn,
  385. .procuremen-toolbar-host .procuremen-toolbar-search-wrap .keep-open > .btn,
  386. .procuremen-toolbar-host .procuremen-toolbar-search-wrap .export > .btn {
  387. padding: 5px 10px !important;
  388. min-width: 34px;
  389. min-height: 30px !important;
  390. line-height: 1.2 !important;
  391. background: #fff !important;
  392. border: 1px solid #d9d9d9 !important;
  393. color: #595959 !important;
  394. border-radius: 4px !important;
  395. box-shadow: none !important;
  396. float: none !important;
  397. flex: 0 0 auto !important;
  398. }
  399. .procuremen-toolbar-host .procuremen-toolbar-search-wrap > .btn-group,
  400. .procuremen-toolbar-host .procuremen-toolbar-search-wrap .keep-open,
  401. .procuremen-toolbar-host .procuremen-toolbar-search-wrap .export {
  402. margin: 0 !important;
  403. float: none !important;
  404. display: inline-flex !important;
  405. flex: 0 0 auto !important;
  406. }
  407. /* 搜索框:仅作为 wrap 内子项;勿盖掉 .procuremen-toolbar-search-wrap 的 flex */
  408. .procuremen-toolbar-host .procuremen-toolbar-search-wrap > .search,
  409. .procuremen-toolbar-host .fixed-table-toolbar > .search:not(.procuremen-toolbar-search-wrap) {
  410. float: none !important;
  411. clear: none !important;
  412. margin: 0 !important;
  413. padding: 0 !important;
  414. display: inline-block !important;
  415. visibility: visible !important;
  416. width: auto !important;
  417. max-width: none !important;
  418. flex: 0 0 auto !important;
  419. line-height: normal !important;
  420. position: static !important;
  421. order: 0 !important;
  422. }
  423. /* 兜底:万一 wrap 落在 .search 上,仍强制单行 flex */
  424. .procuremen-toolbar-host .fixed-table-toolbar .search.procuremen-toolbar-search-wrap {
  425. display: flex !important;
  426. flex-direction: row !important;
  427. flex-wrap: nowrap !important;
  428. align-items: center !important;
  429. margin-left: auto !important;
  430. }
  431. .procuremen-toolbar-host .fixed-table-toolbar .search .form-control,
  432. .procuremen-toolbar-host .procuremen-toolbar-search-wrap .search .form-control {
  433. display: inline-block !important;
  434. width: 160px !important;
  435. min-width: 140px !important;
  436. max-width: 180px !important;
  437. height: 30px !important;
  438. margin: 0 !important;
  439. opacity: 1 !important;
  440. border-radius: 4px !important;
  441. border: 1px solid #d9d9d9 !important;
  442. box-shadow: none !important;
  443. vertical-align: middle;
  444. }
  445. /* 顺序:搜索框(0) → 切换/列/导出(2) → 通用搜索放大镜(5) */
  446. .procuremen-toolbar-host .fixed-table-toolbar .procuremen-toolbar-search-wrap > .search {
  447. order: 0 !important;
  448. }
  449. .procuremen-toolbar-host .fixed-table-toolbar .procuremen-toolbar-search-wrap > button[name="toggle"] {
  450. order: 1 !important;
  451. }
  452. .procuremen-toolbar-host .fixed-table-toolbar .procuremen-toolbar-search-wrap > .keep-open {
  453. order: 2 !important;
  454. }
  455. .procuremen-toolbar-host .fixed-table-toolbar .procuremen-toolbar-search-wrap > .export {
  456. order: 3 !important;
  457. }
  458. .procuremen-toolbar-host .fixed-table-toolbar .procuremen-toolbar-search-wrap > button[name="commonSearch"] {
  459. order: 5 !important;
  460. }
  461. .procuremen-toolbar-host .fixed-table-toolbar .procuremen-toolbar-search-wrap > *:not(.search):not([name="toggle"]):not(.keep-open):not(.export):not([name="commonSearch"]) {
  462. order: 4;
  463. }
  464. #procuremen-layout .procuremen-main .procuremen-table-area {
  465. flex: 1 1 auto;
  466. min-height: 0;
  467. min-width: 0;
  468. overflow: hidden;
  469. display: flex;
  470. flex-direction: column;
  471. }
  472. /* 表格高度由 JS 控制,勿再 flex 压缩,避免连带裁切 */
  473. #procuremen-layout .procuremen-table-area > .bootstrap-table {
  474. flex: 0 0 auto;
  475. min-height: 0;
  476. min-width: 0;
  477. width: 100%;
  478. overflow: visible !important;
  479. }
  480. #procuremen-layout .bootstrap-table .fixed-table-container {
  481. width: 100% !important;
  482. }
  483. .procuremen-table-area .toolbar.procuremen-toolbar-empty {
  484. display: none !important;
  485. }
  486. .procuremen-wff-tabs {
  487. margin-bottom: 0;
  488. margin-top: 0;
  489. border-bottom: 1px solid #f0f0f0;
  490. background: #fff;
  491. }
  492. .procuremen-wff-tabs > li > a {
  493. padding: 10px 16px;
  494. color: #8c8c8c;
  495. border: none !important;
  496. border-bottom: 2px solid transparent !important;
  497. border-radius: 0 !important;
  498. margin-right: 0;
  499. }
  500. .procuremen-wff-tabs > li.active > a,
  501. .procuremen-wff-tabs > li.active > a:hover,
  502. .procuremen-wff-tabs > li.active > a:focus {
  503. color: #1677ff !important;
  504. background: transparent !important;
  505. border: none !important;
  506. border-bottom: 2px solid #1677ff !important;
  507. }
  508. /* 表头:padding 只写在 .th-inner;th 自身 padding:0,避免色条与文字分离 */
  509. #procuremen-layout .bootstrap-table .table > thead > tr > th {
  510. padding: 0 !important;
  511. line-height: 1.4;
  512. vertical-align: middle;
  513. height: auto !important;
  514. }
  515. #procuremen-layout .bootstrap-table .fixed-table-container thead th .th-inner {
  516. padding: 8px 10px !important;
  517. line-height: 1.4;
  518. box-sizing: border-box;
  519. }
  520. #procuremen-layout .bootstrap-table .table > tbody > tr > td {
  521. padding: 8px 10px;
  522. line-height: 1.4;
  523. vertical-align: middle;
  524. height: auto !important;
  525. }
  526. /* 复选框列:表头 .th-inner 与表体 td 内边距一致,避免全选与行勾选框错位 */
  527. #procuremen-layout .bootstrap-table th.bs-checkbox,
  528. #procuremen-layout .bootstrap-table td.bs-checkbox {
  529. width: 42px !important;
  530. min-width: 42px !important;
  531. max-width: 42px !important;
  532. padding: 0 !important;
  533. text-align: center !important;
  534. vertical-align: middle !important;
  535. box-sizing: border-box;
  536. }
  537. #procuremen-layout .bootstrap-table th.bs-checkbox .th-inner {
  538. padding: 8px 4px !important;
  539. margin: 0 !important;
  540. text-align: center !important;
  541. line-height: 1;
  542. min-height: 0;
  543. }
  544. #procuremen-layout .bootstrap-table td.bs-checkbox {
  545. padding: 8px 4px !important;
  546. }
  547. #procuremen-layout .bootstrap-table th.bs-checkbox input[type="checkbox"],
  548. #procuremen-layout .bootstrap-table td.bs-checkbox input[type="checkbox"] {
  549. margin: 0 auto !important;
  550. vertical-align: middle !important;
  551. float: none;
  552. position: static;
  553. top: auto;
  554. width: 16px;
  555. height: 16px;
  556. cursor: pointer;
  557. display: block;
  558. }
  559. #procuremen-layout .bootstrap-table tbody td.bs-checkbox {
  560. min-height: 28px;
  561. cursor: pointer;
  562. }
  563. /* 表头与表体同步横向滚动;强制 table-layout:fixed,避免内容把表体列撑宽导致竖线错位 */
  564. #procuremen-layout .bootstrap-table .fixed-table-body {
  565. overflow: auto !important;
  566. -webkit-overflow-scrolling: touch;
  567. box-sizing: border-box;
  568. }
  569. #procuremen-layout .bootstrap-table .fixed-table-header > table.table,
  570. #procuremen-layout .bootstrap-table .fixed-table-body > table.table,
  571. #procuremen-layout .bootstrap-table .fixed-columns-right table.table {
  572. margin-right: 0 !important;
  573. margin-left: 0 !important;
  574. table-layout: fixed !important;
  575. }
  576. #procuremen-layout .bootstrap-table .fixed-table-header {
  577. overflow: hidden;
  578. padding-right: 0 !important;
  579. box-sizing: border-box;
  580. }
  581. #procuremen-layout .bootstrap-table .fixed-table-header,
  582. #procuremen-layout .bootstrap-table .fixed-table-body {
  583. box-sizing: border-box;
  584. }
  585. #procuremen-layout .bootstrap-table .fixed-table-header .fht-cell {
  586. display: block !important;
  587. height: 0 !important;
  588. overflow: hidden !important;
  589. box-sizing: border-box !important;
  590. }
  591. #procuremen-layout .bootstrap-table .table > thead > tr > th,
  592. #procuremen-layout .bootstrap-table .table > tbody > tr > td {
  593. box-sizing: border-box;
  594. overflow: hidden;
  595. text-overflow: ellipsis;
  596. white-space: nowrap;
  597. vertical-align: middle;
  598. line-height: 1.4;
  599. }
  600. /* 表头:浅灰底 + 完整边框 */
  601. #procuremen-layout .bootstrap-table .table > thead > tr > th,
  602. #procuremen-layout .bootstrap-table .fixed-table-header .table > thead > tr > th,
  603. #procuremen-layout .bootstrap-table .fixed-columns-right .table > thead > tr > th {
  604. background: #f5f7fa !important;
  605. color: #303133 !important;
  606. font-weight: 600 !important;
  607. border: 1px solid #e4e7ed !important;
  608. padding: 0 !important;
  609. }
  610. /* 表体:白底 + 单元格边框 */
  611. #procuremen-layout .bootstrap-table .table > tbody > tr > td,
  612. #procuremen-layout .bootstrap-table .fixed-columns-right .table > tbody > tr > td {
  613. background: #fff !important;
  614. border: 1px solid #ebeef5 !important;
  615. color: #606266;
  616. }
  617. #procuremen-layout .bootstrap-table .table,
  618. #procuremen-layout .bootstrap-table .table-bordered {
  619. border: 1px solid #e4e7ed !important;
  620. }
  621. /* 长文本列:不省略,允许换行完整显示 */
  622. #procuremen-layout .bootstrap-table .table > tbody > tr > td.procuremen-cell-wrap,
  623. #procuremen-layout .bootstrap-table .table > thead > tr > th.procuremen-cell-wrap,
  624. #procuremen-layout .bootstrap-table .table > tbody > tr > td[data-field="CYJMC"],
  625. #procuremen-layout .bootstrap-table .table > tbody > tr > td[data-field="CCLBMMC"],
  626. #procuremen-layout .bootstrap-table .table > tbody > tr > td[data-field="CGYMC"],
  627. #procuremen-layout .bootstrap-table .table > tbody > tr > td[data-field="CDF"],
  628. #procuremen-layout .bootstrap-table .table > tbody > tr > td[data-field="cGzzxMc"],
  629. #procuremen-layout .bootstrap-table .table > tbody > tr > td[data-field="MBZ"],
  630. #procuremen-layout .bootstrap-table .table > tbody > tr > td[data-field="notify_supplier_text"],
  631. #procuremen-layout .bootstrap-table .table > tbody > tr > td[data-field="picked_supplier_name"] {
  632. white-space: normal !important;
  633. word-break: break-all !important;
  634. overflow: visible !important;
  635. text-overflow: clip !important;
  636. line-height: 1.4 !important;
  637. vertical-align: middle !important;
  638. }
  639. /* 操作列按钮不可省略裁切 */
  640. #procuremen-layout .bootstrap-table thead th[data-field="operate"],
  641. #procuremen-layout .bootstrap-table tbody td[data-field="operate"],
  642. #procuremen-layout .bootstrap-table .fixed-columns-right td[data-field="operate"],
  643. #procuremen-layout .bootstrap-table .fixed-columns-right th[data-field="operate"] {
  644. overflow: visible !important;
  645. text-overflow: clip !important;
  646. white-space: nowrap !important;
  647. }
  648. /* 固定右列:外层定宽即可,内部必须是整表 + scrollLeft 到最右,禁止压成单列宽的假表 */
  649. #procuremen-layout .bootstrap-table .fixed-columns-right {
  650. min-width: 156px;
  651. overflow: hidden !important;
  652. background: #fff;
  653. }
  654. #procuremen-layout .bootstrap-table .fixed-columns-right .fixed-table-header,
  655. #procuremen-layout .bootstrap-table .fixed-columns-right .fixed-table-body {
  656. overflow-x: hidden !important;
  657. }
  658. #procuremen-layout .bootstrap-table .fixed-columns-right table {
  659. /* 勿强制单列宽,否则只能看到左侧复选框/订单号 */
  660. width: auto !important;
  661. min-width: 100% !important;
  662. max-width: none !important;
  663. }
  664. #procuremen-layout .bootstrap-table thead th[data-field="operate"],
  665. #procuremen-layout .bootstrap-table tbody td[data-field="operate"] {
  666. width: 168px !important;
  667. min-width: 156px !important;
  668. max-width: 176px !important;
  669. padding-left: 6px !important;
  670. padding-right: 6px !important;
  671. }
  672. /* 日期列加宽并禁止省略,避免滚到最右仍被竖向滚动条挡住 */
  673. #procuremen-layout .bootstrap-table thead th[data-field="dStamp"],
  674. #procuremen-layout .bootstrap-table thead th[data-field="dputrecord"],
  675. #procuremen-layout .bootstrap-table thead th[data-field="issue_time"],
  676. #procuremen-layout .bootstrap-table thead th[data-field="confirm_time"],
  677. #procuremen-layout .bootstrap-table thead th[data-field="approve_time"],
  678. #procuremen-layout .bootstrap-table tbody td[data-field="dStamp"],
  679. #procuremen-layout .bootstrap-table tbody td[data-field="dputrecord"],
  680. #procuremen-layout .bootstrap-table tbody td[data-field="issue_time"],
  681. #procuremen-layout .bootstrap-table tbody td[data-field="confirm_time"],
  682. #procuremen-layout .bootstrap-table tbody td[data-field="approve_time"] {
  683. min-width: 160px !important;
  684. width: 160px !important;
  685. max-width: 176px !important;
  686. white-space: nowrap;
  687. overflow: hidden;
  688. text-overflow: clip;
  689. }
  690. #procuremen-layout .nice-validator .bootstrap-table td.bs-checkbox input[type="checkbox"],
  691. #procuremen-layout .nice-validator .bootstrap-table th.bs-checkbox input[type="checkbox"] {
  692. vertical-align: middle !important;
  693. }
  694. #procuremen-layout .bootstrap-table .table > tbody > tr > td .btn-xs {
  695. padding: 2px 6px;
  696. font-size: 12px;
  697. }
  698. /*
  699. * 右固定列与主表 .fixed-table-body 为同级兄弟,主表全宽时最后一列会叠在固定层「下面」。
  700. * 全局 backend.css 里 .fixed-columns-right 仅 z-index:2,易被主表内层盖住,表现为要点多次才打开弹窗。
  701. * 抬高固定列整体叠层,并把主表滚动区压在 z-index:0,保证命中的是固定层上的按钮。
  702. */
  703. #procuremen-layout .bootstrap-table .fixed-table-container > .fixed-table-body {
  704. position: relative;
  705. z-index: 0;
  706. }
  707. #procuremen-layout .bootstrap-table .fixed-columns-right {
  708. box-shadow: none !important;
  709. border-left: 1px solid #e3e6ea;
  710. background-color: #fff;
  711. z-index: 18 !important;
  712. /* 盖住主表横向滚动条伸到操作列下方的那段,避免「操作按钮下面还能滑」 */
  713. height: 100% !important;
  714. bottom: 0 !important;
  715. }
  716. #procuremen-layout .bootstrap-table .fixed-columns-right::after {
  717. content: '';
  718. position: absolute;
  719. left: 0;
  720. right: 0;
  721. bottom: 0;
  722. height: 17px;
  723. background: #fff;
  724. pointer-events: none;
  725. z-index: 1;
  726. }
  727. #procuremen-layout .bootstrap-table .fixed-columns-right .fixed-table-header,
  728. #procuremen-layout .bootstrap-table .fixed-columns-right .fixed-table-body {
  729. background: #fff;
  730. }
  731. #procuremen-layout .bootstrap-table .fixed-columns-right .fixed-table-header table thead th,
  732. #procuremen-layout .bootstrap-table .fixed-columns-right .fixed-table-body table tbody td {
  733. border-left-color: transparent;
  734. }
  735. /* 操作列按钮在固定层内置于可点区域之上,减少与主表透明重叠导致的「多点一次」 */
  736. /* 固定列操作按钮:抬高层级 + 明确可点,减轻与主表空白区域叠层的「点了没反应」 */
  737. #procuremen-layout .bootstrap-table .fixed-columns-right .fixed-table-body {
  738. pointer-events: auto;
  739. }
  740. #procuremen-layout .bootstrap-table .fixed-columns-right a.procuremen-op-open {
  741. position: relative;
  742. z-index: 6;
  743. pointer-events: auto;
  744. display: inline-block;
  745. vertical-align: middle;
  746. }
  747. #procuremen-layout .procuremen-op-btns .btn + .btn {
  748. margin-left: 6px;
  749. }
  750. /* 可排序列表头:去掉默认排序背景图,保留 .th-inner 内边距与文字对齐 */
  751. #procuremen-layout .bootstrap-table thead th.sortable,
  752. #procuremen-layout .bootstrap-table thead th .th-inner.sortable {
  753. background-image: none !important;
  754. background-position: unset !important;
  755. }
  756. #procuremen-layout .bootstrap-table thead th.sortable .th-inner,
  757. #procuremen-layout .bootstrap-table thead th .th-inner.sortable {
  758. display: block !important;
  759. width: 100% !important;
  760. max-width: 100%;
  761. padding: 8px 10px !important;
  762. box-sizing: border-box;
  763. vertical-align: middle;
  764. white-space: nowrap;
  765. overflow: hidden;
  766. text-overflow: ellipsis;
  767. }
  768. #procuremen-layout .bootstrap-table thead th.sortable .th-inner:after,
  769. #procuremen-layout .bootstrap-table thead th .th-inner.sortable:after {
  770. content: '\f0dc';
  771. font-family: FontAwesome;
  772. font-size: 11px;
  773. line-height: 1;
  774. color: #bbb;
  775. margin-left: 4px;
  776. vertical-align: middle;
  777. }
  778. #procuremen-layout .bootstrap-table thead th.sortable.asc .th-inner:after,
  779. #procuremen-layout .bootstrap-table thead th.sortable.desc .th-inner:after,
  780. #procuremen-layout .bootstrap-table thead th .th-inner.sortable.asc:after,
  781. #procuremen-layout .bootstrap-table thead th .th-inner.sortable.desc:after {
  782. color: #337ab7;
  783. }
  784. /* 采购确认弹层(完结/删除等) */
  785. body .layui-layer-procuremen-finish {
  786. display: flex !important;
  787. flex-direction: column !important;
  788. height: 400px !important;
  789. border-radius: 8px;
  790. overflow: hidden;
  791. box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
  792. }
  793. body .layui-layer-procuremen-finish .layui-layer-title {
  794. background: #fff !important;
  795. color: #1f1f1f !important;
  796. border-bottom: 1px solid #f0f0f0;
  797. height: 48px;
  798. line-height: 48px;
  799. font-size: 15px;
  800. font-weight: 600;
  801. flex-shrink: 0;
  802. padding: 0 20px;
  803. }
  804. body .layui-layer-procuremen-finish .layui-layer-setwin {
  805. top: 2px;
  806. right: 12px;
  807. }
  808. body .layui-layer-procuremen-finish .layui-layer-content {
  809. flex: 1 1 auto !important;
  810. min-height: 0 !important;
  811. padding: 16px 20px !important;
  812. overflow: hidden !important;
  813. height: auto !important;
  814. display: flex !important;
  815. flex-direction: column !important;
  816. }
  817. body .layui-layer-procuremen-finish .procuremen-confirm-body {
  818. flex: 1 1 auto;
  819. min-height: 0;
  820. display: flex;
  821. flex-direction: column;
  822. text-align: left;
  823. line-height: 1.6;
  824. font-size: 13px;
  825. color: #434343;
  826. }
  827. body .layui-layer-procuremen-finish .procuremen-confirm-intro {
  828. margin: 0 0 12px;
  829. flex-shrink: 0;
  830. }
  831. body .layui-layer-procuremen-finish .procuremen-confirm-scroll {
  832. flex: 1 1 auto;
  833. min-height: 0;
  834. overflow-y: auto;
  835. overflow-x: hidden;
  836. border: 1px solid #f0f0f0;
  837. border-radius: 6px;
  838. background: #fafafa;
  839. }
  840. body .layui-layer-procuremen-finish .procuremen-confirm-table {
  841. margin: 0;
  842. font-size: 12px;
  843. border: none;
  844. background: #fff;
  845. width: 100%;
  846. table-layout: fixed;
  847. }
  848. body .layui-layer-procuremen-finish .procuremen-confirm-table th:nth-child(1),
  849. body .layui-layer-procuremen-finish .procuremen-confirm-table td:nth-child(1) {
  850. width: 150px;
  851. white-space: nowrap;
  852. }
  853. body .layui-layer-procuremen-finish .procuremen-confirm-table th:nth-child(2),
  854. body .layui-layer-procuremen-finish .procuremen-confirm-table td:nth-child(2) {
  855. width: 140px;
  856. }
  857. body .layui-layer-procuremen-finish .procuremen-confirm-table th:nth-child(3),
  858. body .layui-layer-procuremen-finish .procuremen-confirm-table td:nth-child(3) {
  859. width: auto;
  860. }
  861. body .layui-layer-procuremen-finish .procuremen-confirm-table thead th {
  862. position: sticky;
  863. top: 0;
  864. background: #f5f5f5;
  865. z-index: 1;
  866. border: 1px solid #ddd !important;
  867. color: #333;
  868. font-weight: 600;
  869. }
  870. body .layui-layer-procuremen-finish .procuremen-confirm-table tbody td {
  871. border: 1px solid #ddd !important;
  872. color: #434343;
  873. }
  874. body .layui-layer-procuremen-finish .layui-layer-btn {
  875. flex-shrink: 0 !important;
  876. text-align: right !important;
  877. padding: 12px 20px !important;
  878. background: #fff !important;
  879. border-top: 1px solid #f0f0f0;
  880. margin-top: auto;
  881. }
  882. body .layui-layer-procuremen-finish .layui-layer-btn a {
  883. height: 32px;
  884. line-height: 32px;
  885. margin: 0 0 0 8px;
  886. padding: 0 16px;
  887. font-size: 13px;
  888. border-radius: 4px;
  889. }
  890. body .layui-layer-procuremen-finish .layui-layer-btn1 {
  891. background: #fff !important;
  892. border: 1px solid #d9d9d9 !important;
  893. color: #333 !important;
  894. }
  895. body .layui-layer-procuremen-finish .layui-layer-btn1:hover {
  896. border-color: #1677ff !important;
  897. color: #1677ff !important;
  898. }
  899. body .layui-layer-procuremen-finish .layui-layer-btn0 {
  900. background-color: #27C24C !important;
  901. border-color: #23ad44 !important;
  902. color: #fff !important;
  903. }
  904. body .layui-layer-procuremen-finish .layui-layer-btn0:hover {
  905. background-color: #1e983e !important;
  906. border-color: #1a8737 !important;
  907. color: #fff !important;
  908. }
  909. #procuremen-layout .procuremen-po-field.procuremen-po-dirty {
  910. border-color: #f0ad4e;
  911. box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 4px rgba(240, 173, 78, 0.45);
  912. }
  913. .procuremen-po-popover {
  914. position: fixed;
  915. z-index: 100050;
  916. padding: 6px 8px;
  917. background: #fff;
  918. border: 1px solid #d2d6de;
  919. border-radius: 4px;
  920. box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  921. }
  922. .procuremen-po-popover-inner {
  923. white-space: nowrap;
  924. }
  925. .procuremen-po-popover-inner .btn + .btn {
  926. margin-left: 6px;
  927. }
  928. #procuremen-layout .procuremen-supplier-lines-cell {
  929. position: relative;
  930. }
  931. #procuremen-layout .procuremen-supplier-lines-cell .procuremen-supplier-caret {
  932. position: absolute;
  933. right: 0;
  934. top: 0;
  935. height: 100%;
  936. line-height: 1;
  937. background: #eee;
  938. color: #ddd;
  939. padding: 0 5px;
  940. display: flex;
  941. justify-content: center;
  942. align-items: center;
  943. cursor: pointer;
  944. }
  945. #procuremen-layout .procuremen-supplier-lines-cell .procuremen-supplier-caret:hover {
  946. color: #999;
  947. }
  948. </style>
  949. <div class="panel panel-default panel-intro" id="procuremen-layout"
  950. data-default-ym="{$defaultYm|htmlentities}"
  951. data-procuremen-redis-api="{$procuremenRedisApi|htmlentities}"
  952. data-procuremen-stage="{$procuremenStage|default='pick'|htmlentities}"
  953. data-can-dispatch="{$procuremenBtnDispatch|default=0}"
  954. data-can-pick-delete="{$procuremenBtnPickDelete|default=0}"
  955. data-can-complete="{$procuremenBtnComplete|default=0}"
  956. data-can-audit-abandon="{$procuremenBtnAuditAbandon|default=0}">
  957. {:build_heading()}
  958. <div class="panel-body">
  959. <div class="row procuremen-layout">
  960. <div class="procuremen-sidebar">
  961. {foreach name="sidebarYearMonths" item="block"}
  962. <div class="procuremen-year-block">
  963. <div class="year-title">{$block.year}年</div>
  964. {foreach name="block.months" item="item"}
  965. <a href="javascript:;" class="procuremen-ym-item{if $item.ym == $defaultYm} active{/if}" data-ym="{$item.ym|htmlentities}">{$item.label|htmlentities}</a>
  966. {/foreach}
  967. </div>
  968. {/foreach}
  969. </div>
  970. <div class="procuremen-main">
  971. <div id="myTabContent" class="tab-content">
  972. <div class="tab-pane fade active in" id="one">
  973. <div class="widget-body no-padding">
  974. <div id="procuremen-toolbar-host" class="procuremen-toolbar-host clearfix"></div>
  975. <div class="procuremen-table-area">
  976. <div id="toolbar" class="toolbar">
  977. <a href="javascript:;" class="btn btn-primary btn-refresh" title="{:__('Refresh')}" >刷新 <i class="fa fa-refresh"></i> </a>
  978. {if isset($procuremenBtnAuditAbandon) && $procuremenBtnAuditAbandon}
  979. <a href="javascript:;" class="btn btn-danger procuremen-stage-hide hide" id="btn-procuremen-audit-abandon" title="勾选一条或多条订单退回协助初选重新下发(历史记录保留)"><i class="fa fa-repeat"></i> 重新下发</a>
  980. {/if}
  981. {if isset($procuremenBtnDispatch) && $procuremenBtnDispatch}
  982. <a href="javascript:;" class="btn btn-info procuremen-stage-hide hide" id="btn-procuremen-pick-review" title="勾选一条或多条工序进行下发(多条须同一订单号)"><i class="fa fa-paper-plane"></i> 下发</a>
  983. {/if}
  984. {if isset($procuremenBtnComplete) && $procuremenBtnComplete}
  985. <a href="javascript:;" class="btn btn-success procuremen-stage-hide hide" id="btn-procuremen-batch-finish" title="勾选一条或多条工序标记为已完结"><i class="fa fa-flag-checkered"></i> 完结</a>
  986. {/if}
  987. {if isset($procuremenBtnPickDelete) && $procuremenBtnPickDelete}
  988. <a href="javascript:;" class="btn btn-danger procuremen-stage-hide hide" id="btn-procuremen-pick-delete" title="勾选一条或多条工序从初选列表移除"><i class="fa fa-trash"></i> 删除</a>
  989. {/if}
  990. </div>
  991. <table id="table"
  992. class="table table-bordered table-hover">
  993. </table>
  994. </div>
  995. </div>
  996. </div>
  997. </div>
  998. </div>
  999. </div>
  1000. </div>
  1001. </div>