rxform.css 26 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417
  1. /*表单预览样式*/
  2. body * p{
  3. margin: 0;
  4. padding: 0;
  5. }
  6. /*子表*/
  7. .ant-input-group .ant-input{
  8. margin-right: 6px;
  9. }
  10. .rx-table-body .table-header-tool{
  11. padding: 6px 0;
  12. display: flex;
  13. line-height: normal;
  14. }
  15. .rx-table-body .table-header-tool .title:before{
  16. content: '';
  17. display: inline-block;
  18. height: 100%;
  19. width: 0;
  20. vertical-align: middle;
  21. }
  22. .rx-table-body .table-header-tool .title >div{
  23. padding-left: 6px;
  24. font-size: 14px;
  25. display: inline-block;
  26. white-space: nowrap;
  27. text-overflow: ellipsis;
  28. overflow: hidden;
  29. max-width: 300px;
  30. border-left: 3px solid #4d9eff;
  31. vertical-align: middle;
  32. }
  33. .rx-table-body .table-header-tool .ant-btn-group{
  34. flex: 1;
  35. text-align: right;
  36. padding-right: 4px;
  37. font-size: 0;
  38. }
  39. .rx-table-body .ant-btn-group .ant-button{
  40. font-size: 14px;
  41. font-weight: normal;
  42. border: 1px solid #ddd;
  43. border-radius: 3px;
  44. padding: 4px 6px;
  45. margin-left: 6px;
  46. display: inline-block;
  47. }
  48. .rx-table tr.firstRow th{
  49. text-align: left;
  50. border: 1px solid #E8E8E8;
  51. background: #fafafa;
  52. font-weight: normal;
  53. font-size: 14px;
  54. color: #000000d9;
  55. padding:8px 4px;
  56. }
  57. .rx-table tr.firstRow th:first-child,
  58. .rx-table tr td:first-child{
  59. width: 70px;
  60. text-align: center;
  61. }
  62. .rx-table{
  63. table-layout: fixed;
  64. }
  65. .rx-table tr td{
  66. font-size: 14px;
  67. color: #555;
  68. }
  69. .rx-table tr th,
  70. .rx-table tr td{
  71. height: 30px;
  72. }
  73. .rx-table-box{
  74. border: 1px solid #E8E8E8;
  75. overflow-x: auto;
  76. }
  77. table.rx-table{
  78. width: 100%;
  79. margin: 0 auto;
  80. border: 0;
  81. }
  82. .tableEmpty{
  83. padding: 10px 0;
  84. }
  85. table.rx-table >thead>tr {
  86. background-color: #fafafa;
  87. }
  88. table.rx-table >thead>tr >th {
  89. font-weight: bold;
  90. text-align: left;
  91. font-size: 14px;
  92. color: #999;
  93. }
  94. table.rx-table >tbody>tr {
  95. height:2.5rem;
  96. line-height: 2.5rem;
  97. }
  98. table.rx-table >tbody>tr >td{
  99. border: 1px solid #e8e8e8;
  100. padding: 4px;
  101. line-height: normal;
  102. vertical-align: middle;
  103. text-align: left;
  104. }
  105. table.rx-table >tbody>tr >td:first-child,
  106. table.rx-table >thead>tr >th:first-child
  107. {
  108. border-left: 0;
  109. }
  110. table.rx-table >tbody>tr >td:last-child,
  111. table.rx-table >thead>tr >th:last-child
  112. {
  113. border-right:0;
  114. }
  115. table.rx-table >thead>tr >th{
  116. border-top: 0!important;
  117. border-bottom: 0!important;
  118. }
  119. table.rx-table >tbody>tr:last-child >td{
  120. border-bottom: 0;
  121. }
  122. table.rx-table >tbody>tr.active{
  123. background-color: #e6f7ff;
  124. }
  125. table.rx-table tfoot td:first-child{
  126. text-align: center;
  127. }
  128. table.rx-table tfoot td[align="left"]:first-child{
  129. text-align: left;
  130. }
  131. table.rx-table tfoot td[align="right"]:first-child{
  132. text-align: right;
  133. }
  134. .previewBox{
  135. /*padding-left: 10px;
  136. padding-right: 10px;*/
  137. background: #fff;
  138. padding: 10px;
  139. border-radius: 6px;
  140. }
  141. input.input{
  142. border: none;
  143. }
  144. .table-form{
  145. table-layout: fixed;
  146. }
  147. .table-form>tbody>tr>td{
  148. border: 0;
  149. height: 32px;
  150. padding: 4px;
  151. vertical-align: middle;/*文字上下对齐*/
  152. }
  153. /*块模式子表*/
  154. .blockTable{
  155. border: 1px solid #dadde0;
  156. border-radius:4px;
  157. }
  158. .blockTableUl,.blockLi{
  159. list-style: none;
  160. margin:0;
  161. padding:0;
  162. font-size: 0;
  163. }
  164. .bolckTableHeader{
  165. border-bottom: 1px solid #dadde0;
  166. display: flex;
  167. height: 40px;
  168. align-items: center;
  169. padding: 0 10px;
  170. background-color:#f5f7fa;
  171. border-top-left-radius: 4px;
  172. border-top-right-radius: 4px;
  173. }
  174. .bolckTableHeader .headTitle{
  175. display: inline-block;
  176. padding-left: 10px;
  177. position: relative;
  178. }
  179. .bolckTableHeader .headTitle:before{
  180. content: '';
  181. display: inline-block;
  182. height: 14px;
  183. width: 2px;
  184. background-color: #1890FF;
  185. position: absolute;
  186. left: 0;
  187. top: 50%;
  188. margin-top: -6px;
  189. }
  190. .bolckTableHeader a-button-group{
  191. flex: 1;
  192. }
  193. .blockTableContent{
  194. padding: 4px 10px 10px;
  195. }
  196. .itemBox{
  197. position: relative;
  198. padding-top: 40px;
  199. margin-top: 14px;
  200. border-top: 1px solid transparent;
  201. }
  202. .itemBox .itemBtnBox{
  203. position: absolute;
  204. right: 0;
  205. top: 0px;
  206. font-size: 0;
  207. display: none;
  208. }
  209. .itemBox.itemBoxEidt .itemBtnBox{
  210. display: inline-block;
  211. }
  212. .itemBox.blockactive .itemBtnBox,
  213. .itemBox:hover .itemBtnBox
  214. {
  215. display: inline-block;
  216. }
  217. .itemBox:hover .blockTableUl,
  218. .itemBox.blockactive .blockTableUl{
  219. border-color: #1890ff;
  220. }
  221. .itemBtnBox .blockBtn{
  222. font-size: 14px;
  223. display: inline-block;
  224. width: 30px;
  225. height: 30px;
  226. padding: 0;
  227. text-align: center;
  228. background-color: #f5f7fa;
  229. border-radius: 4px;
  230. border: solid 1px #dadde0;
  231. margin-left: 10px;
  232. }
  233. .itemBtnBox .blockBtn:hover,
  234. .itemBtnBox .blockBtn:active
  235. {
  236. background: #eff8ff;
  237. color: #40a9ff;
  238. border: solid 1px #40a9ff;
  239. }
  240. .itemBtnBox .blockBtn.block-btn-remove:hover,
  241. .itemBtnBox .blockBtn.block-btn-remove:active
  242. {
  243. background-color: #ffebeb;
  244. color: #f2a3a1;
  245. border: solid 1px #f2a3a1;
  246. }
  247. .blockTableUl{
  248. border: 1px dashed #ddd;
  249. width: 100%;
  250. box-sizing: border-box;
  251. font-size: 0;
  252. display: flex;
  253. flex-wrap: wrap;
  254. padding: 10px;
  255. }
  256. .blockLi{
  257. font-size: 14px;
  258. padding: 0 6px;
  259. margin: 8px 0;
  260. box-sizing: border-box;
  261. display: flex;
  262. align-items: center;
  263. }
  264. /*1列*/
  265. .onecol.blockTableUl .blockLi{
  266. width: 100%;
  267. }
  268. /*2列*/
  269. .twocol.blockTableUl .blockLi,
  270. .blockTableUl .blockLi{
  271. width: 50%;
  272. }
  273. /*3列*/
  274. .threecol.blockTableUl .blockLi{
  275. width: 33.3333%;
  276. }
  277. /*4列*/
  278. .fourcol.blockTableUl .blockLi{
  279. width: 25%;
  280. }
  281. .blockLiLabel{
  282. width: 120px;
  283. text-align: right;
  284. padding-right: 4px;
  285. }
  286. .blockLiBox{
  287. flex: 1;
  288. }
  289. /*块模式子表end*/
  290. /*表格模板有边框样式*/
  291. .table-form[borders="yesborder"]>tbody>tr>td{
  292. border:1px solid #ddd
  293. }
  294. .table-form caption{
  295. caption-side: initial;
  296. text-align: center;
  297. font-size: 18px;
  298. font-weight: bold;
  299. padding: 10px;
  300. color: #555;
  301. }
  302. .table-form>tbody>tr>td:nth-child(odd){
  303. text-align: right;
  304. padding-right: 10px;
  305. }
  306. .table-form>tbody>tr>td:last-child:first-child{
  307. padding: 4px;
  308. text-align: left;
  309. }
  310. .table-form>tbody>tr>td:nth-child(even){
  311. text-align: left;
  312. padding: 10px;
  313. }
  314. /*表单-二列*/
  315. .table-form[column='two']>tbody>tr>td:first-child{
  316. width: 20%;
  317. }
  318. .table-form[column='two']>tbody>tr>td:last-child{
  319. width: 80%;
  320. }
  321. /*表单-四列*/
  322. .table-form[column='four']>tbody>tr>td:nth-child(odd){
  323. width: 15%;
  324. }
  325. .table-form[column='four']>tbody>tr>td:nth-child(even){
  326. width: 35%;
  327. }
  328. /*表单-六列*/
  329. .table-form[column='six']>tbody>tr>td:nth-child(odd){
  330. width: 11%;
  331. }
  332. .table-form[column='six']>tbody>tr>td:nth-child(odd){
  333. width: 22.3%;
  334. }
  335. /*表单-八列*/
  336. .table-form[column='eight']>tbody>tr>td:nth-child(odd){
  337. width: 8%;
  338. }
  339. .table-form[column='eight']>tbody>tr>td:nth-child(even){
  340. width: 17%;
  341. }
  342. /*单行文本样式*/
  343. .rx-textbox{
  344. border: 0;
  345. display: inline-block;
  346. vertical-align: middle;
  347. white-space: normal;
  348. word-break: break-all;
  349. }
  350. .rx-textbox .input{
  351. width: 100%;
  352. }
  353. /*td文字位置*/
  354. /*左*/
  355. .table-form td[align="left"]{
  356. text-align: left!important;
  357. }
  358. /*中*/
  359. .table-form td[align="center"]{
  360. text-align: center!important;
  361. }
  362. /*右*/
  363. .table-form td[align="right"]{
  364. text-align: right!important;
  365. }
  366. /*上*/
  367. .table-form td[valign="top"]{
  368. vertical-align: top!important;
  369. }
  370. /*中*/
  371. .table-form td[valign="middle"]{
  372. vertical-align: middle!important;
  373. }
  374. /*下*/
  375. .table-form td[valign="bottom"]{
  376. vertical-align: bottom!important;
  377. }
  378. /*表格控件颜色*/
  379. /*白色*/
  380. .table-form.white > tbody> tr > td:nth-last-child(2):first-child,
  381. .table-form.white > tbody> tr > td:nth-last-child(4):first-child,
  382. .table-form.white > tbody> tr > td:nth-last-child(2):nth-child(3),
  383. .table-form.white > tbody> tr > td:nth-last-child(6):first-child,
  384. .table-form.white > tbody> tr > td:nth-last-child(4):nth-child(3),
  385. .table-form.white > tbody> tr > td:nth-last-child(2):nth-child(5),
  386. .table-form.white > tbody> tr > td:nth-last-child(8):first-child,
  387. .table-form.white > tbody> tr > td:nth-last-child(6):nth-child(3),
  388. .table-form.white > tbody> tr > td:nth-last-child(4):nth-child(5),
  389. .table-form.white > tbody> tr > td:nth-last-child(2):nth-child(7),
  390. .table-form.white caption{
  391. background: transparent;
  392. }
  393. /*蓝色*/
  394. .table-form.blue > tbody> tr > td:nth-last-child(2):first-child,
  395. .table-form.blue > tbody> tr > td:nth-last-child(4):first-child,
  396. .table-form.blue > tbody> tr > td:nth-last-child(2):nth-child(3),
  397. .table-form.blue > tbody> tr > td:nth-last-child(6):first-child,
  398. .table-form.blue > tbody> tr > td:nth-last-child(4):nth-child(3),
  399. .table-form.blue > tbody> tr > td:nth-last-child(2):nth-child(5),
  400. .table-form.blue > tbody> tr > td:nth-last-child(8):first-child,
  401. .table-form.blue > tbody> tr > td:nth-last-child(6):nth-child(3),
  402. .table-form.blue > tbody> tr > td:nth-last-child(4):nth-child(5),
  403. .table-form.blue > tbody> tr > td:nth-last-child(2):nth-child(7),
  404. .table-form.blue caption{
  405. background: #e3f1ff;
  406. }
  407. /*绿色*/
  408. .table-form.green > tbody> tr > td:nth-last-child(2):first-child,
  409. .table-form.green > tbody> tr > td:nth-last-child(4):first-child,
  410. .table-form.green > tbody> tr > td:nth-last-child(2):nth-child(3),
  411. .table-form.green > tbody> tr > td:nth-last-child(6):first-child,
  412. .table-form.green > tbody> tr > td:nth-last-child(4):nth-child(3),
  413. .table-form.green > tbody> tr > td:nth-last-child(2):nth-child(5),
  414. .table-form.green > tbody> tr > td:nth-last-child(8):first-child,
  415. .table-form.green > tbody> tr > td:nth-last-child(6):nth-child(3),
  416. .table-form.green > tbody> tr > td:nth-last-child(4):nth-child(5),
  417. .table-form.green > tbody> tr > td:nth-last-child(2):nth-child(7),
  418. .table-form.green caption{
  419. background: #defaea;
  420. }
  421. /*灰色*/
  422. .table-form.grey > tbody> tr > td:nth-last-child(2):first-child,
  423. .table-form.grey > tbody> tr > td:nth-last-child(4):first-child,
  424. .table-form.grey > tbody> tr > td:nth-last-child(2):nth-child(3),
  425. .table-form.grey > tbody> tr > td:nth-last-child(6):first-child,
  426. .table-form.grey > tbody> tr > td:nth-last-child(4):nth-child(3),
  427. .table-form.grey > tbody> tr > td:nth-last-child(2):nth-child(5),
  428. .table-form.grey > tbody> tr > td:nth-last-child(8):first-child,
  429. .table-form.grey > tbody> tr > td:nth-last-child(6):nth-child(3),
  430. .table-form.grey > tbody> tr > td:nth-last-child(4):nth-child(5),
  431. .table-form.grey > tbody> tr > td:nth-last-child(2):nth-child(7),
  432. .table-form.grey caption{
  433. background: #ebeef5;
  434. }
  435. /*单行文本框*/
  436. .rx-textbox input{
  437. height: 32px;
  438. }
  439. /*子表弹窗样式*/
  440. .table-detail.column-two > tbody> tr > td:nth-child(odd){
  441. width: 20%;
  442. text-align: right;
  443. }
  444. .table-detail.column-two > tbody> tr > td:nth-child(even) {
  445. width: 80%;
  446. text-align: left;
  447. }
  448. .table-detail.column-four > tbody> tr > td:nth-child(odd){
  449. width: 15%;
  450. text-align: center;
  451. text-align: right;
  452. }
  453. .table-form.column-four > tbody> tr > td:nth-child(even){
  454. width: 35%;
  455. text-align: left;
  456. padding: 10px;
  457. }
  458. .toggleButton{
  459. margin: 10px;
  460. display: inline;
  461. color: #FFFFFF;
  462. cursor: pointer;
  463. }
  464. .toggleButton:before{
  465. font-family: "iconfont" !important;
  466. font-size: 16px;
  467. font-weight: bold;
  468. -webkit-font-smoothing: antialiased;
  469. -moz-osx-font-smoothing: grayscale;
  470. color: #000;
  471. }
  472. .rx-checkbox{
  473. display: inline-block;
  474. height: 20px;
  475. }
  476. .rx-checkbox,
  477. .rx-from-select,
  478. .rx-checkbox-list,
  479. .rx-switch,
  480. .rx-chinese,
  481. .rx-number,
  482. .rx-radio,
  483. .rx-date,
  484. .rx-month,
  485. .rx-rate,
  486. .rx-time,
  487. .rx-button-edit {
  488. text-align: left;
  489. display: inline-block;
  490. vertical-align: middle;
  491. line-height: normal;
  492. }
  493. /*边框容器*/
  494. .fieldsetContainer{
  495. border-top: 1px solid #ddd;
  496. padding: 2px 2px 2px 2px;
  497. }
  498. .fieldsetContainer .title{
  499. position: relative;
  500. font-size: 16px;
  501. font-weight: bold;
  502. width: auto;
  503. color: #555;
  504. }
  505. .fieldsetContainer .title:before{
  506. content: "";
  507. display: inline-block;
  508. width: 5px;
  509. height: 5px;
  510. background: #4099FF;
  511. vertical-align: 2px;
  512. margin-right: 6px;
  513. }
  514. .fieldsetContainer .divFieldsetContainer{
  515. padding: 10px;
  516. }
  517. .fieldsetContainer .toggleButton:before{
  518. color: #ddd;
  519. }
  520. .vl-notify.vl-notify-iframe .vl-notify-content{
  521. padding: 20px;
  522. height: auto;
  523. }
  524. .ql-editor{
  525. min-height: 120px;
  526. }
  527. /*数字输入框*/
  528. .ant-input-number{
  529. width: 80%;
  530. }
  531. /*日期控件*/
  532. .rx-date .ant-calendar-picker,
  533. .rx-month .ant-calendar-picker,
  534. .rx-date-range .ant-calendar-picker,
  535. .rx-week .ant-calendar-picker,
  536. .rx-time .ant-time-picker
  537. {
  538. width: 100%;
  539. }
  540. /*富文本框*/
  541. .rx-quill-editor{
  542. width: 100;
  543. position: relative;
  544. }
  545. .rx-quill-editor>div,
  546. .rx-quill-editor .editor{
  547. height: 100%;
  548. }
  549. .rx-quill-editor >div > i{
  550. position: absolute;
  551. right: -26px;
  552. top: 80px;
  553. }
  554. .rx-quill-editor.read-only{
  555. height: auto!important;
  556. }
  557. .rx-quill-editor .editarea>p{
  558. margin-bottom: 0;
  559. }
  560. /*编辑型按钮*/
  561. .rx-button-edit{
  562. width: 80%;
  563. display: flex;
  564. align-items: center;
  565. }
  566. .rx-button-edit > div{
  567. display: flex;
  568. align-items: center;
  569. width: 100%;
  570. }
  571. .rx-button-edit .inputBtnBox{
  572. width: 100%;
  573. }
  574. .rx-button-edit .inputBtnBox span.ant-input-group{
  575. width: 100%;
  576. display: flex;
  577. }
  578. .rx-button-edit .inputBtnBox span.ant-input-group input.ant-input{
  579. flex: 1;
  580. }
  581. .rx-button-edit > div > span > input{
  582. width: calc(100% - 70px) !important;
  583. }
  584. /*上传附件*/
  585. .ant-upload.ant-upload-drag .ant-upload-drag-container{
  586. padding-top: 5px;
  587. }
  588. .rx-upload > div{
  589. position: relative;
  590. }
  591. .rx-upload > div >div{
  592. width: 100%;
  593. }
  594. .rx-upload > div > i{
  595. position:absolute;
  596. left: 80%;
  597. top: 10px;
  598. }
  599. /*地址控件*/
  600. .rx-address > div{
  601. display: flex;
  602. align-items: center;
  603. }
  604. .rx-address > div > div{
  605. margin-right: 10px;
  606. }
  607. .rx-address > div > div.addressCon{
  608. width: calc(92% - 330px);
  609. margin-right: 0px;
  610. }
  611. /*部门控件与用户控件*/
  612. .rx-group{
  613. display: inline-block;
  614. }
  615. .rx-user{
  616. display: inline-block;
  617. }
  618. .rx-group > div{
  619. display: flex;
  620. align-items: center;
  621. }
  622. .rx-group .flexBox,
  623. .rx-user .flexBox{
  624. width: 100%!important;
  625. }
  626. /*多行文本框*/
  627. .rx-textarea > div{
  628. display: flex;
  629. align-items: center;
  630. white-space: normal;
  631. word-break: break-all;
  632. }
  633. /*rxExcelBox*/
  634. .rxExcelBox{
  635. display: inline-block;
  636. vertical-align: top;
  637. }
  638. /*必填星号*/
  639. .star{
  640. /*display: inline-block;*/
  641. position: relative;
  642. padding-left: 10px;
  643. }
  644. .star:before{
  645. content: '*';
  646. display: inline-block;
  647. position: absolute;
  648. color: red;
  649. font-size: 20px;
  650. left: 0;
  651. top: 2px;
  652. height: 10px;
  653. line-height: 10px;
  654. }
  655. .yesParent .rxStar{
  656. display: none;
  657. }
  658. /*单选按钮 眼睛偏成斗鸡眼;*/
  659. /*body .ant-radio-inner{
  660. width: 17px;
  661. height: 17px;
  662. }
  663. body .ant-radio-inner::after{
  664. top:4px;
  665. left: 4px;
  666. }*/
  667. /*数字输入框*/
  668. .rx-number .ant-input-number{
  669. width: 100%;
  670. }
  671. /*评分*/
  672. .rx-rate .ant-rate-star-first .anticon,
  673. .rx-rate .ant-rate-star-second .anticon{
  674. vertical-align: 4px;
  675. }
  676. .rx-checkbox-list{
  677. display: inline-block;
  678. }
  679. /*星号*/
  680. .required{
  681. position: relative;
  682. }
  683. .required:before {
  684. content: "*";
  685. color: red;
  686. margin-right: 5px;
  687. font-size: 16px;
  688. display: inline-block;
  689. }
  690. /*下拉框*/
  691. .rx-form-select {
  692. display: inline-block;
  693. }
  694. .rx-form-select .ant-select{
  695. width: 100%;
  696. }
  697. /*下拉框end*/
  698. /*rxtabs*/
  699. .tabsToolBox{
  700. padding: 10px 0;
  701. }
  702. .tabsToolBox li{
  703. padding: 0 6px;
  704. border-radius: 4px;
  705. }
  706. .tabsToolBox li:hover{
  707. background: #f7f7f7;
  708. }
  709. .tabsToolBox li .itemString,
  710. .tabsToolBox li .itemObj{
  711. display: flex;
  712. align-items: center;
  713. }
  714. .tabsToolBox li .leftBox{
  715. flex: 1;
  716. padding-right: 10px;
  717. overflow: hidden;
  718. white-space: nowrap;
  719. text-overflow: ellipsis;
  720. line-height: none;
  721. }
  722. .tabsToolBox .editIcon:hover{
  723. color: #4099FF;
  724. }
  725. .tabsToolBox .delIcon:hover{
  726. color: #d9363e;
  727. }
  728. /*tab容器*/
  729. /*tab容器*/
  730. .rx-tabbox{
  731. position: relative;
  732. display: flex;
  733. flex-direction: column;
  734. height: 200px;
  735. width: 100%;
  736. background: #fff;
  737. }
  738. .rx-tabbox[margins="yesBorder"]{
  739. border:1px solid #ddd;
  740. }
  741. .rx-tabbox[margins="noBorder"]{
  742. border:0;
  743. }
  744. .rx-tabbox .rxTabsHeader{
  745. box-sizing: border-box;
  746. display: flex;
  747. height: 40px;
  748. line-height: 40px;
  749. border-bottom: 1px solid #ddd;
  750. }
  751. .rx-tabbox .rxTabsHeader .leftBtn,
  752. .rx-tabbox .rxTabsHeader .rightBtn
  753. {
  754. padding: 0 10px;
  755. background: #fff;
  756. cursor: pointer;
  757. display: none;
  758. }
  759. .rx-tabbox .rxTabsHeader .headerContent{
  760. flex: 1;
  761. position: relative;
  762. }
  763. .rx-tabbox .rxTabsHeader .itemContainer{
  764. display: inline-block;
  765. box-sizing: border-box;
  766. position: absolute;
  767. left: 0;
  768. z-index: 3;
  769. }
  770. /*垫一层div是因为编辑器点击的时候会自动获取第一个*/
  771. .rx-tabbox .rxTabsHeader .headerClick{
  772. position: absolute;
  773. z-index: 1;
  774. width: 100%;
  775. height: 100%;
  776. }
  777. .rx-tabbox .rxTabsHeader .itemContainer>span.headerBtns{
  778. padding: 8px 10px;
  779. display: inline-block;
  780. list-style: none;
  781. border-bottom:2px solid transparent;
  782. box-sizing: border-box;
  783. margin-right: 10px;
  784. line-height: normal;
  785. cursor: pointer;
  786. }
  787. .rx-tabbox .rxTabsHeader .itemContainer>span.headerBtns.headerActive{
  788. border-bottom:2px solid #1890ff;
  789. }
  790. .rx-tabbox .rxTabsHeader .itemContainer>span.headerBtns:last-child{
  791. margin-right: 0;
  792. }
  793. .rx-tabbox .rx-a-tabs{
  794. position: relative;
  795. flex: 1;
  796. box-sizing: border-box;
  797. }
  798. .rx-tabbox .rx-a-tabs .itemBox {
  799. height: 100%;
  800. width: 100%;
  801. box-sizing: border-box;
  802. }
  803. .rx-tabbox .rx-a-tabs .rx-tab-item{
  804. position: absolute;
  805. top: 0;
  806. left: 0;
  807. right: 0;
  808. bottom: 0;
  809. z-index: 1;
  810. background: #fff;
  811. overflow: auto;
  812. padding: 10px;
  813. box-sizing: border-box;
  814. }
  815. .rx-tabbox .rx-a-tabs .rx-tab-item.actives{
  816. z-index: 5;
  817. }
  818. /*tabs向左*/
  819. .rx-tabbox.left{
  820. flex-direction: row;
  821. }
  822. .rx-tabbox.left .rxTabsHeader{
  823. flex-direction: column;
  824. width: 100px;
  825. height: 100%;
  826. border-bottom: 0;
  827. border-right:1px solid #ddd ;
  828. }
  829. .rx-tabbox.left .rxTabsHeader .itemContainer>span.headerBtns{
  830. display: block;
  831. margin-right: 0;
  832. position: relative;
  833. padding-left: 24px;
  834. }
  835. .rx-tabbox.left .rxTabsHeader .itemContainer>span.headerBtns.headerActive{
  836. border-bottom-color: transparent;
  837. position: relative;
  838. }
  839. .rx-tabbox.left .rxTabsHeader .itemContainer>span.headerBtns.headerActive:before{
  840. content: '';
  841. width: 0;
  842. height: 0;
  843. top: 13px;
  844. left: 8px;
  845. display: inline-block;
  846. position: absolute;
  847. border-width:6px;
  848. border-style: solid;
  849. border-color: transparent transparent transparent #4099FF;
  850. }
  851. .rx-tabbox.left .rxTabsHeader .itemContainer{
  852. width: 100%;
  853. }
  854. /*tabs向右*/
  855. .rx-tabbox.right{
  856. flex-direction: row;
  857. }
  858. .rx-tabbox.right .rxTabsHeader{
  859. flex-direction: column;
  860. width: 100px;
  861. height: 100%;
  862. border-bottom: 0;
  863. border-left:1px solid #ddd;
  864. order: 3;
  865. }
  866. .rx-tabbox.right .rx-a-tabs{
  867. order: 0;
  868. }
  869. .rx-tabbox.right .rxTabsHeader .itemContainer>span.headerBtns{
  870. display: block;
  871. margin-right: 0;
  872. position: relative;
  873. padding-right: 24px;
  874. text-align: right;
  875. }
  876. .rx-tabbox.right .rxTabsHeader .itemContainer>span.headerBtns.headerActive{
  877. border-bottom-color: transparent;
  878. position: relative;
  879. }
  880. .rx-tabbox.right .rxTabsHeader .itemContainer>span.headerBtns.headerActive:before{
  881. content: '';
  882. width: 0;
  883. height: 0;
  884. top: 13px;
  885. right: 8px;
  886. display: inline-block;
  887. position: absolute;
  888. border-width:6px;
  889. border-style: solid;
  890. border-color: transparent #4099FF transparent transparent;
  891. }
  892. .rx-tabbox.right .rxTabsHeader .itemContainer{
  893. width: 100%;
  894. }
  895. /*tabs向下*/
  896. .rx-tabbox.bottom .rxTabsHeader{
  897. order: 3;
  898. border-bottom: 0;
  899. border-top: 1px solid #ddd;
  900. }
  901. .rx-tabbox.bottom .rx-a-tabs{
  902. order: 0;
  903. }
  904. .rx-tabbox.bottom .rxTabsHeader .itemContainer>span.headerBtns{
  905. border-bottom: 0;
  906. border-top:2px solid transparent
  907. }
  908. .rx-tabbox.bottom .rxTabsHeader .itemContainer>span.headerBtns.headerActive{
  909. border-color: #4099FF;
  910. }
  911. .rx-table-box tfoot td{
  912. border-top: 1px solid #ddd;
  913. border-right: 1px solid #ddd;
  914. padding: 4px;
  915. }
  916. .rx-table-box tfoot td:last-child{
  917. border-right: 0;
  918. }
  919. /*tab容器end*/
  920. .search-btn-box >.search-btn-ul,
  921. .search-btn-box>.search-btn-ul> li{
  922. padding: 0;
  923. margin: 0;
  924. display: inline-block;
  925. }
  926. .search-btn-box>.search-btn-ul> li{
  927. line-height: 32px;
  928. padding:0 11px 0 10px;
  929. white-space: nowrap;
  930. position: relative;
  931. cursor: pointer;
  932. }
  933. .search-btn-box>.search-btn-ul> li:hover,
  934. .search-btn-box>.search-btn-ul> li.active
  935. {
  936. color: #1890ff;
  937. }
  938. .search-btn-box>.search-btn-ul> li:after{
  939. content: '|';
  940. display: inline-block;
  941. position: absolute;
  942. right: 0;
  943. height: 14px;
  944. line-height: 14px;
  945. margin-top: -7px;
  946. top: 50%;
  947. overflow: hidden;
  948. color: #ddd;
  949. }
  950. .search-btn-box>.search-btn-ul> li:last-child:after{
  951. content: '';
  952. }
  953. .fit-header .search-btn-box{
  954. float: right;
  955. display: inline-block;
  956. padding: 6px;
  957. white-space: nowrap;
  958. color: #555;
  959. }
  960. .table-operator{
  961. display: inline-block;
  962. }
  963. /*rx-fit 表单列表高级查询 */
  964. .slide-fade-enter-active,
  965. .slide-fade-leave-active{
  966. transition: all .5s ease;
  967. }
  968. .slide-fade-enter, .slide-fade-leave-to
  969. {
  970. opacity: 0;
  971. }
  972. .find-box{
  973. max-height:90%;nav-down: auto;
  974. box-sizing: border-box;
  975. position: absolute;
  976. left: 1px;
  977. top: 1px;
  978. z-index: 20;
  979. background: #fff;
  980. width: 50%;
  981. min-width: 500px;
  982. box-shadow: 0 0 0px 0px transparent,
  983. 4px 0 4px -3px #a3a0a0,
  984. 0 4px 4px -3px #a3a0a0,
  985. -2px 0 0px 0px transparent;
  986. display: flex;
  987. flex-direction: column;
  988. }
  989. .find-tool{
  990. display: flex;
  991. height: 40px;
  992. line-height: 40px;
  993. background-color: #f5f7fa;
  994. justify-content: space-between;
  995. border-bottom: 1px solid #e6e8eb;
  996. }
  997. .find-tool .findClose{
  998. padding: 0 10px;
  999. cursor: pointer;
  1000. }
  1001. .find-tool .find-text{
  1002. padding-left: 20px;
  1003. }
  1004. .find-tool .findClose:hover i{
  1005. color: #1890ff;
  1006. }
  1007. .find-btn-tool{
  1008. padding:8px 10px;
  1009. font-size: 0;
  1010. border-bottom:1px solid #ddd;
  1011. text-align: right;
  1012. }
  1013. .find-btn-tool button{
  1014. margin-left: 10px;
  1015. }
  1016. .find-content{
  1017. padding:10px 20px 20px;
  1018. flex: 1;
  1019. box-sizing: border-box;
  1020. display: flex;
  1021. flex-direction: column;
  1022. }
  1023. .find-content-header {
  1024. width: 100%;
  1025. box-sizing: border-box;
  1026. display: flex;
  1027. }
  1028. .find-content-header .iputBox{
  1029. flex: 1;
  1030. color: #c0c5cc;
  1031. font-size: 12px;
  1032. }
  1033. .find-content-header .iputBox input{
  1034. width: 60%;
  1035. min-width: 240px;
  1036. }
  1037. .find-content-header .checkBox{
  1038. padding-top: 5px;
  1039. padding-left: 20px;
  1040. }
  1041. .find-content-center{
  1042. display: flex;
  1043. flex-direction: column;
  1044. }
  1045. .find-item{
  1046. display: flex;
  1047. align-content: center;
  1048. margin-top: 10px;
  1049. }
  1050. .find-item:first-child{
  1051. margin-top: 0;
  1052. }
  1053. .find-item-content{
  1054. padding: 4px 0;
  1055. max-height: 60%;
  1056. overflow: auto;
  1057. margin-top: 10px;
  1058. }
  1059. .findSelcetBox{
  1060. flex: 1;
  1061. margin-right: 20px;
  1062. }
  1063. .findInputBox{
  1064. flex: 2;
  1065. }
  1066. .closeItem{
  1067. margin-left: 10px;
  1068. padding-left: 5px;
  1069. padding-right: 5px;
  1070. cursor: pointer;
  1071. }
  1072. .closeItem>span{
  1073. display: inline-block;
  1074. height: 16px;
  1075. width: 16px;
  1076. text-align: center;
  1077. line-height: 15px;
  1078. margin-top: 8px;
  1079. background-color: #c0c5cc;
  1080. color: #fff;
  1081. border-radius: 8px;
  1082. font-size: 12px;
  1083. }
  1084. .closeItem:hover span{
  1085. background-color: red;
  1086. }
  1087. .addItemBtn{
  1088. padding-top: 20px;
  1089. }
  1090. .find-box .addbtn{
  1091. background-color: #f5f7fa;
  1092. font-size: 14px;
  1093. color: rgba(0, 0, 0, 0.65);
  1094. }
  1095. .find-box .addbtn i{
  1096. margin-top: 0;
  1097. color: rgba(0, 0, 0, 0.65);
  1098. font-size: 14px;
  1099. }
  1100. .find-box .addbtn:active,
  1101. .find-box .addbtn:focus
  1102. {
  1103. background-color:#f5f7fa;
  1104. border-color: #d9d9d9;
  1105. color: rgba(0, 0, 0, 0.65);
  1106. }
  1107. .find-box .addbtn:hover
  1108. {
  1109. background-color:#1890ff;
  1110. }
  1111. .find-box .addbtn:hover,
  1112. .find-box .addbtn:hover i{
  1113. color: #fff;
  1114. }
  1115. .addItemBtn{
  1116. display: flex;
  1117. }
  1118. .addItemBtn .findBtnSpan{
  1119. flex: 1;
  1120. margin-right: 0;
  1121. }
  1122. .addItemBtn .perch{
  1123. width: 25px;
  1124. margin-left: 10px;
  1125. }
  1126. .table-page-search-submitButtons{
  1127. margin-bottom: 12px;
  1128. display: inline-block;
  1129. line-height: 40px;
  1130. }
  1131. /*rx-fit 表单列表高级查询 end */
  1132. /**/
  1133. .rx-table-body .ant-calendar{
  1134. position: absolute;
  1135. }
  1136. .rxdatlist.ant-calendar-picker div:last-child{
  1137. //position: absolute;
  1138. }
  1139. /*流程隐藏右下角自带的图标*/
  1140. body .bjs-powered-by{
  1141. display: none;
  1142. }
  1143. /*流程图 提示内容 弹窗*/
  1144. body .rx-npmn-window{
  1145. width: 284px;
  1146. box-sizing: border-box;
  1147. }
  1148. .flow-window-container{
  1149. position: relative;
  1150. padding-top: 10px;
  1151. z-index: 10;
  1152. }
  1153. .flow-window-container:before,
  1154. .flow-window-container:after
  1155. {
  1156. content: '◆';
  1157. position: absolute;
  1158. left: 50%;
  1159. top: 0;
  1160. display: inline-block;
  1161. width: 20px;
  1162. height: 20px;
  1163. margin-left: -10px;
  1164. text-align: center;
  1165. font-size: 36px;
  1166. line-height: 20px;
  1167. color: #fff;
  1168. }
  1169. .flow-window-container:before{
  1170. z-index: 10;
  1171. text-shadow: 0 0px 5px #ccc;
  1172. }
  1173. .flow-window-container:after{
  1174. z-index: 30;
  1175. }
  1176. .flow-window-content{
  1177. position: relative;
  1178. width: 100%;
  1179. box-sizing: border-box;
  1180. z-index: 20;
  1181. background: #fff;
  1182. padding: 10px 0 10px 10px;
  1183. overflow-y: auto;
  1184. box-shadow: 0px 0px 4px 0px #ccc;
  1185. }
  1186. .flow-window-content ul{
  1187. max-height: 300px;
  1188. overflow: auto;
  1189. padding-right: 10px;
  1190. }
  1191. .flow-window-content>ul::-webkit-scrollbar {
  1192. width: 5px!important;
  1193. height: 5px!important;
  1194. }
  1195. .flow-window-content>ul::-webkit-scrollbar-thumb {
  1196. /*!*滚动条里面小方块*!*/
  1197. border-radius: 5px;
  1198. background:#c0c5cc!important;
  1199. }
  1200. .flow-window-content>ul::-webkit-scrollbar-thumb:hover {
  1201. background:#8a9199!important;
  1202. }
  1203. ul, li, dl, dd, dt{
  1204. margin: 0;
  1205. padding: 0;
  1206. list-style: none;
  1207. }
  1208. .flow-window-content >ul>li{
  1209. overflow: hidden;
  1210. }
  1211. .flow-item-li{
  1212. padding-bottom: 10px;
  1213. }
  1214. .flow-item-icon{
  1215. width: 31px;
  1216. height: 31px;
  1217. float: left;
  1218. border-radius: 16px;
  1219. margin: 2px 20px 0 10px;
  1220. background:#4d6aff url(../person.png) no-repeat center center;
  1221. }
  1222. .flow-item-text{
  1223. overflow: hidden;
  1224. font-size: 12px;
  1225. font-family: “Microsoft YaHei”;
  1226. }
  1227. .flow-item-details .leftText{
  1228. color: #a8b2bd;
  1229. text-align: right;
  1230. white-space: nowrap;
  1231. }
  1232. .flow-item-details .rightText{
  1233. color: #333;
  1234. padding-left: 16px;
  1235. }
  1236. .flow-item-title,
  1237. .flow-item-header{
  1238. margin-left: 2px;
  1239. position: relative;
  1240. }
  1241. .flow-item-btn{
  1242. position: absolute;
  1243. bottom: 0;
  1244. right: 0;
  1245. padding-right: 20px;
  1246. color: #4d6aff;
  1247. cursor:pointer ;
  1248. }
  1249. .flow-item-btn:after{
  1250. content: '';
  1251. display: inline-block;
  1252. width: 8px;
  1253. height: 8px;
  1254. border-left:1px solid #4d6aff;
  1255. border-bottom: 1px solid #4d6aff;
  1256. transform: rotate(-45deg);
  1257. position: absolute;
  1258. right: 6px;
  1259. top: 2px;
  1260. }
  1261. .active .flow-item-btn:after{
  1262. content: '';
  1263. display: inline-block;
  1264. width: 8px;
  1265. height: 8px;
  1266. border-left:1px solid #4d6aff;
  1267. border-bottom: 1px solid #4d6aff;
  1268. transform: rotate(135deg);
  1269. position: absolute;
  1270. right: 6px;
  1271. top: 7px;
  1272. }
  1273. .flow-item-content{
  1274. display: none;
  1275. }
  1276. .active .flow-item-content{
  1277. display: block;
  1278. }
  1279. .flow-item-name{
  1280. font-size: 14px;
  1281. color: #333;
  1282. }
  1283. .flow-item-title{
  1284. padding: 6px 0;
  1285. }
  1286. .flow-node-text{
  1287. background: #edf0ff;
  1288. color: #4d6aff;
  1289. padding: 3px 6px;
  1290. border-radius: 3px;
  1291. }
  1292. .flow-node-text-type{
  1293. background: #e7f6e3;
  1294. }
  1295. .flow-item-details > dl > dd{
  1296. display: flex;
  1297. }
  1298. .flow-item-content .noedit{
  1299. padding: 12px 0 8px;
  1300. font-size: 13px;
  1301. }
  1302. /*流程图 提示内容 弹窗 end*/
  1303. /* 条件容器 rx-conditions*/
  1304. .rx-conditions{
  1305. line-height: normal;
  1306. width: 100%;
  1307. box-sizing: border-box;
  1308. }
  1309. /*rx-data-list*/
  1310. .rx-data-list > .rx-layout{
  1311. padding: 0!important;
  1312. }
  1313. .rx-data-list > .rx-layout >.rx-content > .rx-center>div{
  1314. top:0!important;
  1315. }