.viewCon{ font-size: 14px; .view-header { .sort { position: relative; margin-left: 15px; margin-right: 10px; color: #878787; // .sort-dialog { // position: absolute; // width: 100px; // height: 100px; // background-color: rgba(0, 0, 0, 0.5); // } } } .del-header { position: relative; width:100%; height:40px; background: white; z-index: 666; .top-title { border:1px solid #efeffa; width:100%; height:40px; display: -webkit-box; display: flex; justify-content: space-between; .tit { display: inline-block; height:40px; line-height: 40px; margin-left: 10px; font-size: 16px; } .filter { display: inline-block; height:40px; display: -webkit-box; display: flex; align-items: center; margin-right: 10px; &>span { display: inline-block; height:40px; line-height: 40px; color:#666; } .icon { margin-left:5px; margin-bottom: 5px; } .show { color:#26A2FF; } .icon-show { color:#26A2FF; margin-bottom: -5px; } } } .search-dia { position: absolute; top:48px; width:100%; height:296px; background:white; overflow:auto; border-bottom: 1px solid #efeffa; } } .search { width:100%; height:46px; background: white; border-bottom:1px solid #efeffa; display: flex; flex-direction: row; justify-content: center; align-items: center; .search-block { width:90%; height:34px; position: relative; .local { position: absolute; left:10px; top:50%; margin-top:-8px; color:#D9D9D9; } .form_search { width:100%; -webkit-appearance:none; -moz-appearance: none; font-size:14px; height:34px; border-radius:4px; border:1px solid rgba(255,255,255,1); color:#6a6f77; outline:0; background:rgba(250,250,250,1); padding-left:36px; padding-right:10px; } .form_search::-webkit-input-placeholder { color: #D9D9D9; } .form_search::placeholder { color: #D9D9D9; } .form_search::-moz-placeholder{ //火狐的placeholder的颜色是粉红色,怎么改都不行 color: #D9D9D9; } .form_search:-ms-input-placeholder{ color: #D9D9D9; } } //mintiui搜索框的样式 .mint-searchbar { position: relative; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color:#ffffff; -webkit-box-sizing: border-box; box-sizing: border-box; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 5px 10px; z-index: 1; .mint-searchbar-inner { -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #fafafa; border-radius: 2px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 28px; padding: 4px 6px; } } } .serch-popup { .picker-item { height: 36px; line-height: 36px; padding: 0; white-space: nowrap; position: relative; overflow: hidden; text-overflow: ellipsis; color: #707274; left: 0; top: 0; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .search-model { position: fixed; left: -25%; top: 0; width: 25%; height: 100%; background: rgba(0, 0, 0, 0.5); } } .viewCon-con{ background: #f7f7f7; .view-listview-container { position:relative; } .view-include-box { width: 100%; padding: 10px 10px 5px 10px; box-sizing: border-box; .view-li { width:100%; padding: 1px 10px 1px 10px; box-sizing: border-box; display: -webkit-flex; display: flex; flex-direction: column; border-bottom: 1px solid rgba(0, 0, 0, 0.1); background: #fff; border-radius: 3px; margin-bottom: 5px; .view-li-rightCon { font-size: 12px; color: #666666; // height: 18px; line-height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 5px 0; display: -webkit-flex; display: flex; } .view-li-rightSpan { display: inline-block; } //普通视图标签内的超出隐藏 .view-li-right-content { overflow: hidden; // text-overflow: ellipsis; white-space: nowrap; flex-grow: 1; &>span { width:100%; display: inline-block; &>span { width:100%; display: inline-block; &>span { width:100%; display: inline-block; .attachment-upload-field { width:100%; display: inline-block; display: -webkit-flex; display: flex; justify-content: space-between; &>span { display: inline-block; } .file-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .click-more { position: relative; .file-list { padding-top: 5px; box-sizing: border-box; position: fixed; right: 26px; width: 50%; min-height: 100px; max-height: 300px; overflow: auto; background-color: #fff; z-index: 9999; border-radius: 4px; box-shadow: 0px 0px 12px 0px #DDDDDD; .list-box { box-sizing: border-box; width: 100%; height: 30px; padding: 0 10px; line-height: 25px; display: -webkit-flex; display: flex; justify-content: space-between; .file-name { width: calc(100% - 12px); text-overflow: ellipsis; white-space: nowrap; } .down { width:12px; } } } .mask-layer { width: 100%; height: 100%; background-color: #000; position: fixed; top: 0; left: 0; opacity: 0; background: #000; z-index: 10; } } } .row-value { width:100%; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } } } } .label-wrap { width: 100%; .label-item { border-radius: 4px; max-width: 100%; display: inline-block; margin-right: 5px; overflow: hidden; // transform-origin: left; // transform:scale(0.9); .label-box { max-width: 100%; display: flex; align-items: center; &>span { max-width: 100%; display: inline-block; box-sizing: border-box; padding: 3px 6px 3px 6px; border-radius: 4px; overflow: hidden;/*超出部分隐藏*/ white-space: nowrap;/*不换行*/ text-overflow:ellipsis;/*超出部分文字以...显示*/ } } } } .view-column-button { width: 100%; display: -webkit-flex; display: flex; flex-direction: row; flex-wrap: wrap; .button-wrap { min-width: 60px; max-width: 100%; min-height: 16px; border: 1px solid #6591fa; color: #6591fa; padding: 5px 6px; border-radius: 3px; margin-bottom: 5px; margin-right: 5px; font-size: 12px; .button-title { text-align: center; overflow: hidden; white-space: nowrap; text-overflow:ellipsis; max-width: 100%; display: -webkit-flex; display: flex; flex-direction: row; align-items: center; .icon { margin-right: 3px; } } } } } } .view-lis { overflow: auto; border-top: 1px solid rgba(0, 0, 0, 0.1); div:first-of-type { height: auto; } .view-li { width:100%; padding: 1px 10px 1px 10px; box-sizing: border-box; .view-li-first { margin-top: 5px; } .view-li-container { display: flex; flex-direction: row; padding: 8px 0 8px 0px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); align-items: center; background: #fff; border-radius: 3px; .view-li-left { margin: 0 10px 0 10px; .view-li-leftLabel { vertical-align: middle; float: left; } .mint-checklist-label { padding: 0; } } .view-li-right { flex: 1; overflow: hidden; padding-right: 10px; box-sizing: content-box; .view-li-rightCon { font-size: 12px; color: #666666; // height: 18px; line-height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 5px 0; display: -webkit-flex; display: flex; } .view-li-rightSpan { display: inline-block; } //普通视图标签内的超出隐藏 .view-li-right-content { overflow: hidden; // text-overflow: ellipsis; white-space: nowrap; flex-grow: 1; &>span { width:100%; display: inline-block; &>span { width:100%; display: inline-block; &>span { width:100%; display: inline-block; .attachment-upload-field { width:100%; display: inline-block; display: -webkit-flex; display: flex; justify-content: space-between; &>span { display: inline-block; } .file-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .click-more { position: relative; .file-list { padding-top: 5px; box-sizing: border-box; position: fixed; right: 26px; width: 50%; min-height: 100px; max-height: 300px; overflow: auto; background-color: #fff; z-index: 9999; border-radius: 4px; box-shadow: 0px 0px 12px 0px #DDDDDD; .list-box { box-sizing: border-box; width: 100%; height: 30px; padding: 0 10px; line-height: 25px; display: -webkit-flex; display: flex; justify-content: space-between; .file-name { width: calc(100% - 12px); text-overflow: ellipsis; white-space: nowrap; } .down { width:12px; } } } .mask-layer { width: 100%; height: 100%; background-color: #000; position: fixed; top: 0; left: 0; opacity: 0; background: #000; z-index: 10; } } } .row-value { width:100%; display: inline-block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } } } } } .label-wrap { width: 100%; .label-item { border-radius: 4px; max-width: 100%; display: inline-block; margin-right: 5px; overflow: hidden; // transform-origin: left; // transform:scale(0.9); .label-box { max-width: 100%; display: flex; align-items: center; &>span { max-width: 100%; display: inline-block; box-sizing: border-box; padding: 3px 6px 3px 6px; border-radius: 4px; overflow: hidden;/*超出部分隐藏*/ white-space: nowrap;/*不换行*/ text-overflow:ellipsis;/*超出部分文字以...显示*/ } } } } .view-column-button { width: 100%; display: -webkit-flex; display: flex; flex-direction: row; flex-wrap: wrap; .button-wrap { min-width: 60px; max-width: 100%; min-height: 16px; border: 1px solid #6591fa; color: #6591fa; padding: 5px 6px; border-radius: 3px; margin-bottom: 5px; margin-right: 5px; font-size: 12px; .button-title { text-align: center; overflow: hidden; white-space: nowrap; text-overflow:ellipsis; max-width: 100%; display: -webkit-flex; display: flex; flex-direction: row; align-items: center; .icon { margin-right: 3px; } } } } } } } } .view-content { position: fixed; height: 100%; top: 40px; left: 0; right: 0; bottom: 0; background: #f7f7f7; overflow: scroll; .view-search-wrap { //view-listview普通视图的搜索框央视 display: inline-block; margin-top: 6px; width: 100%; height: 45px; padding-left: 10px; padding-right: 10px; background: #f7f7f7; box-sizing: border-box; .container { width: 100%; height: 100%; background: #fff; width:100%; height:46px; border-radius: 3px; border-bottom:1px solid #efeffa; display: flex; flex-direction: row; justify-content: center; align-items: center; padding-right: 10px; padding-left: 10px; box-sizing: border-box; .search-block { width: calc(100% - 22px); height:34px; position: relative; .local { position: absolute; left:10px; top:50%; margin-top:-8px; color:#D9D9D9; } .form_search { width:100%; -webkit-appearance:none; -moz-appearance: none; font-size:14px; height:34px; border-radius:4px; border:1px solid rgba(255,255,255,1); color:#6a6f77; outline:0; background:rgba(250,250,250,1); padding-left:36px; padding-right:10px; } .form_search::-webkit-input-placeholder { color: #D9D9D9; } .form_search::placeholder { color: #D9D9D9; } .form_search::-moz-placeholder{ //火狐的placeholder的颜色是粉红色,怎么改都不行 color: #D9D9D9; } .form_search:-ms-input-placeholder{ color: #D9D9D9; } } .search-icon { display: inline-block; margin-left: 10px; } } } .view-nodata { position: absolute; top: 230px; width: 100%; font-size: 14px; color:#666666; .view-nodata-img,.view-nodata-text{ display: flex; justify-content: center; i{ color: #D9D9D9; } } } } .view-content-tow { //padding-top: 40px; position: fixed; height: 100%; top: 88px; left: 0; right: 0; bottom: 0; background: #f7f7f7; .view-nodata { position: absolute; top: calc(50% - 88px); left: 50%; transform: translate(-50%, -50%); font-size: 14px; color:#666666; .view-nodata-img,.view-nodata-text{ display: flex; justify-content: center; i{ color: #D9D9D9; } } } } // view-content-notow 是视图选择框没有配置查询表单搜索的样式 .view-content-notow { //padding-top: 40px; position: fixed; height: 100%; top: 41px; left: 0; right: 0; bottom: 0; background: #f7f7f7; .view-nodata { position: absolute; top: calc(50% - 88px); left: 50%; transform: translate(-50%, -50%); font-size: 14px; color:#666666; .view-nodata-img,.view-nodata-text{ display: flex; justify-content: center; i{ color: #D9D9D9; } } } } .treeview-content { margin-top:46px; height:75%; overflow:scroll; margin-bottom: 200px; } .scroll { height:85%; overflow:scroll; margin-bottom: 100px; } //包含元素的样式 .include-view { //margin-top:45px; background: white; display: -webkit-box; display: flex; justify-content: center; flex-direction: column; .inclue-con { width:100%; border-bottom:1px solid #eee; } .in-list { margin-left:10px; width:95%; min-height:95px; .list-top { margin-top:8px; display: -webkit-box; display: flex; flex-direction: row; justify-content: space-between; font-size: 12px; .subscript { width:18px; height: 18px; line-height: 18px; background:#26A2FF; color:white; text-align: center; border-radius: 50%; } .list-btns { span { display: inline-block; width:44px; height:18px; text-align: center; border:1px solid #26A2FF; color:#26A2FF; border-radius: 10px; margin-left:10px; } } } } .view-li-right { flex: 1; margin-top:12px; .view-li-rightCon { font-size: 14px; color: #666666; // height: 18px; line-height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 4px 0; } .view-li-rightSpan { display: inline-block; } } } .new-include { width:100%; margin-top:10px; .form-list { margin-left:10px; width:95%; min-height:95px; //border:1px solid blue; margin-bottom: 10px; } } .do-create { width:100%; height:70px; .create { width:100%; height:40px; display: -webkit-box; display: flex; justify-content: center; align-items: center; text-align: center; color:#26A2FF; span:first-child { font-size: 16px; } span:nth-child(2) { display: inline-block; margin-left:8px; font-size: 14px; } } .load-more { width:100%; height:30px; display: -webkit-box; display: flex; justify-content: center; align-items: center; div:first-child { display: -webkit-box; display: flex; justify-content: center; align-items: center; width:60px; height:30px; } } } //日历视图 .calendar-view { width: 100%; height: calc(100% - 88px); position: fixed; top: 40px; left: 0; right: 0; bottom: 0; background: #f7f7f7; overflow-y: auto; background: white; .calendar-view-wrap { width:100%; height: 100%; .list-btn { box-sizing: border-box; width: 100%; padding: 10px; display: -webkit-flex; display: flex; justify-content: flex-end; } .show-view { width: 100%; height: calc(100% - 54px); overflow-y: auto; .view-li:first-child{ border-top: 1px solid rgba(0, 0, 0, 0.1); } .view-li { display: flex; //display: -webkit-box; flex-direction: row; padding: 15px 0 15px 0px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); align-items: center; background: #fff; .view-li-left { margin: 0 10px 0 10px; .view-li-leftLabel { vertical-align: middle; float: left; } .mint-checklist-label { padding: 0; } } .view-li-right { flex: 1; overflow: hidden; padding-right: 10px; box-sizing: content-box; .view-li-rightCon { font-size: 12px; color: #666666; // height: 18px; line-height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 4px 0; display: -webkit-flex; display: flex; } .view-li-rightSpan { display: inline-block; } } } } } .calendar-wrap { width:100%; .cal-type { width:100%; padding: 0 10px 0 10px; box-sizing: border-box; .view-type { width: 100%; div { display: -webkit-flex; display: flex; flex-direction: row; border: 1px solid #26a2ff; width: 33%; display: inline-block; height: 30px; line-height: 30px; text-align: center; margin:0px 0px -1px -1px; color: #26a2ff; } div:first-child { border-top-left-radius: 3px; border-bottom-left-radius: 3px; } div:nth-child(3) { border-top-right-radius: 3px; border-bottom-right-radius: 3px; } div:nth-child(2) { border-left: none; border-right: none; } .date_active { color: #fff; background-color: #26a2ff; } } .date { margin-top: 5px; color: #888; display: -webkit-flex; display: flex; flex-direction: row; justify-content: center; height: 40px; align-items: center; &>span:nth-child(1), &>span:nth-child(3) { display: inline-block; width: 30px; height: 40px; line-height: 40px; text-align: center; } &>span:nth-child(2) { margin-left: 10px; margin-right: 10px; } &>span:nth-child(2)>div { display: inline-block; min-width: 78px; text-align: center; } } } .cal-box { width: 100%; overflow: auto; .day-view { width:100%; .view-li { display: flex; //display: -webkit-box; flex-direction: row; padding: 15px 0 15px 0px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); align-items: center; background: #fff; .view-li-left { margin: 0 10px 0 10px; .view-li-leftLabel { vertical-align: middle; float: left; } .mint-checklist-label { padding: 0; } } .view-li-right { flex: 1; overflow: hidden; padding-right: 10px; box-sizing: content-box; .view-li-rightCon { font-size: 12px; color: #666666; // height: 18px; line-height: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 4px 0; display: -webkit-flex; display: flex; } .view-li-rightSpan { display: inline-block; } } } } .week-view,.mon-view { width: 100%; padding:10px; box-sizing: border-box; overflow: auto; td { padding:0 8px; // flex-wrap: nowrap; } table { // width:100%; table-layout: fixed; } tbody { .tbody-head { width: 50px; font-size: 12px; color: #888; div { width: 50px; } } td { height: 45px; position: relative; .content-box { width:100%; height: 100%; display: -webkit-flex; display: flex; justify-content: center; align-items: center; // position: relative; .total { background-color: #26a2ff; display: inline-block; width: 30px; height: 30px; border-radius: 50%; text-align: center; line-height: 30px; color: #fff; } .tbody-data { display: inline-block; width: 35px; height: 35px; // border: 1px solid pink; border-radius: 50%; background-color: #26a2ff; box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.1); line-height: 33px; text-align: center; color: #fff; } } } } } .mon-view { width: 100%; padding:10px; box-sizing: border-box; overflow: auto; td { padding:0 8px; text-align: center; .month-details { margin-top: 3px; width:30px; height:30px; border-radius: 50%; text-align: start; overflow: hidden; display: -webkit-flex; display: flex; justify-content: center; .total { display: inline-block; width:30px; height:30px; line-height: 30px; text-align: center; background-color: #26a2ff; color: #fff; } // background-color: #26a2ff; // color: #fff; // .date-content-box { // margin-top: 4px; // background-color: #26a2ff; // border-radius: 50%; // display: inline-block; // width: 35px; // height: 35px; // color: #fff; // text-align: center; // line-height: 35px; // } } } } } } } } .searchDivCon{ .mint-cell{ border-bottom: 1px solid #eee; .mint-cell-wrapper{ font-size: 14px; // line-height:21px; //bcx-代码样式修改 background-image: linear-gradient(0deg, #ffffff, #ffffff 0%, transparent 0%); .mint-cell-title{ margin-right: 8px; .mint-cell-text{ vertical-align: middle; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; } } .mint-cell-value{ .mint-field-core{ // text-align: right;//bcx-代码样式修改 } } .mint-cell-value>*[readonly=readonly]{ color: #888; } } } .textarea-cell{ .mint-field-core{ text-align: left !important; } } .titleName{ padding: 8px 0 8px 10px; } } // 树形部门选择框 .title { width:100%; height:40px; line-height: 40px; padding:0 10px; font-size:16px; color:#000000; border-bottom:1px solid #dadada; } .dept-tree-select{ padding-left: 10px; background-color: #ffffff; .icon { display:flex; flex-direction: row; align-items: center; color:#26a2ff; height: 54px; font-size:32px; .dept-name { font-size:14px; color:#000000; margin-left:10px; } } .tree-height{ height: 54px; line-height: 54px; display:inline-block; .more { display:inline-block; width:20px; height:20px; line-height:20px; border-radius: 2px; text-align:center; color:#888888; font-size:12px; background:#f4f6f6; } } .tree-name { width:32px; height: 54px; line-height: 54px; display:inline-block; border:1px solid red; } .view-li-leftLabel{ padding: 0 6px 0 0; float: left; } .icon-open{ //width: 20px; width: 5%; float: right; } .user-box { display: inline-block; width: 100%; max-height: 432px; overflow:scroll; -webkit-overflow-scrolling: touch; .user-list { width:100%; height: 32px; display: flex; flex-direction: row; border-bottom:1px solid #f7f7f7; padding:10px 10px 10px 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-left: 10px; line-height: 28px; .photo { display: inline-block; width:32px; height:32px; overflow: hidden; border-radius: 50%; margin-right:10px; img { width:100%; height:100%; } } .name { width:74%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } } } } .dialog-btn{ position: absolute; bottom:0; left:0; background: white; width: 100%; height:60px; display: flex; padding:0 10px; align-items: center;; justify-content: space-between; border-top:1px solid #fafafa; .num { color:#26a2ff; font-size:16px; } .comm-btn { margin-right: 20px; } .mint-button--small { display: inline-block; font-size: 14px; padding: 0 31px; height: 38px; } } //显示排序的弹窗 .sort-dialog { .popup-more { position: absolute; z-index: 2100; } .mint-popup-more { position: fixed; background: #fff; top: 140px; right: 4px; z-index: 2101; display: block; width: 130px; height: 200px; border-radius: 4px; font-size: 12px; box-sizing: border-box; .popup-select { width:100%; height: 100%; overflow-y: auto; border-radius: 4px; .select-coum { width:100%; height: 30px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; .cell-body { display: -webkit-flex; display: flex; align-items: center; height: 30px; width:100%; background: #fff; clear: both; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; .coum-name { margin-left: 10px; } // .pending-radio { // width:38px; // } .card-pending{ background: #fff; width: calc(100% - 38px); height: 30px; border-radius: 6px; display: -webkit-flex; display: flex; align-items: center; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .mint-checkbox-core { background: #fff; width: 16px; height: 16px; } #mint-checkbox .mint-checkbox-core::after { top: 2px; left: 5px; } .mint-checkbox-input:checked + .mint-checkbox-core { background-color: #26a2ff; border-color: #26a2ff; } } } } a { color: #000; text-decoration: none; } } .mint-popup-right-more { right: 5px; bottom: auto; left: auto; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); } .triangle { width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #ffffff; box-sizing: border-box; position: absolute; z-index: 2001; top: -8px; right: 7px; } .popup { position: fixed; background: #fff; z-index: 2001; .popup-bot { top: 100%; margin-top: -150px; right: 4px; z-index: 2001; display: block; width: 100%; height: 150px; text-align: center; border-radius: 4px; font-size: 14px; .content { width: 90%; height: 100%; margin-top: 50px; padding: 15px; .prompt { width: 100%; text-align: center; } .btns { margin-top: 20px; display: flex; justify-content: flex-end; .btn { margin-left: 15px; } } } } } } }