修改项目理想概算管理表格搜索条件样式

master
suhang_max@163.com 2022-10-28 17:05:37 +08:00
parent 91eecab89a
commit e2cf605510
1 changed files with 89 additions and 68 deletions

View File

@ -89,7 +89,7 @@
.search-table { .search-table {
position: relative; position: relative;
width: 100%; width: 100%;
padding: 12px 0 0; padding: 6px 0 0;
border: 1px solid #d8d8d8; border: 1px solid #d8d8d8;
border-radius: 4px; border-radius: 4px;
} }
@ -99,25 +99,45 @@
.search-table .st-row { .search-table .st-row {
position: relative; position: relative;
width: 100%; width: 100%;
justify-content: space-between; justify-content: flex-start;
/*align-items: center;*/ /*align-items: center;*/
padding: 0 12px 12px; padding: 0 6px 6px;
margin-bottom: 12px; margin-bottom: 6px;
border-bottom: 1px solid #d8d8d8; border-bottom: 1px solid #d8d8d8;
} }
.search-table .tools-row { .search-table .tools-row {
position: relative; position: relative;
width: 100%; width: 100%;
justify-content: flex-end; justify-content: flex-end;
padding-right: 12px; padding-right: 6px;
margin-bottom: 12px; margin-bottom: 6px;
} }
.tools-row button { .tools-row button {
margin-left: 12px; margin-left: 12px;
} }
/* 默认5等分一行5个 */
.st-row .st-col { .st-row .st-col {
position: relative; position: relative;
flex: 0 0 18%;
margin-right: 2%;
}
/* 4等分一行4个 */
.st-col.st-col-4 {
flex: 0 0 22%; flex: 0 0 22%;
margin-right: 3%;
}
/* 3等分一行3个 */
.st-col.st-col-3 {
flex: 0 0 31%;
margin-right: 2.3%;
}
/* 2等分一行2个 */
.st-col.st-col-2 {
flex: 0 0 48%;
margin-right: 2%;
}
.st-col.hidden {
display: none;
} }
.st-col .st-col-title { .st-col .st-col-title {
font-size: 14px; font-size: 14px;
@ -126,6 +146,12 @@
white-space: nowrap; white-space: nowrap;
font-weight: bold; font-weight: bold;
} }
.st-col .st-col-field {
align-items: center;
}
.st-col .mid-connect {
margin: 0 4px;
}
.expand-section { .expand-section {
display: block; display: block;
} }
@ -165,9 +191,6 @@
<input type="text" id="creatorName" class="am-form-field am-input-sm" value="${creatorName!}"/> <input type="text" id="creatorName" class="am-form-field am-input-sm" value="${creatorName!}"/>
</div> </div>
</div> </div>
</div>
<!-- 第二行 -->
<div class="flex-row st-row">
<div class="st-col"> <div class="st-col">
<div class="st-col-title">部门名称</div> <div class="st-col-title">部门名称</div>
<div class="st-col-field"> <div class="st-col-field">
@ -181,6 +204,9 @@
</select> </select>
</div> </div>
</div> </div>
</div>
<!-- 第二行 -->
<div class="flex-row st-row">
<div class="st-col"> <div class="st-col">
<div class="st-col-title">项目类型</div> <div class="st-col-title">项目类型</div>
<div class="st-col-field"> <div class="st-col-field">
@ -214,9 +240,6 @@
</select> </select>
</div> </div>
</div> </div>
</div>
<!-- 第三行 -->
<div class="flex-row st-row">
<div class="st-col"> <div class="st-col">
<div class="st-col-title">客户名称</div> <div class="st-col-title">客户名称</div>
<div class="st-col-field"> <div class="st-col-field">
@ -229,6 +252,9 @@
<input type="text" id="terminalCustomer" class="am-form-field am-input-sm" value="${terminalCustomer!}"/> <input type="text" id="terminalCustomer" class="am-form-field am-input-sm" value="${terminalCustomer!}"/>
</div> </div>
</div> </div>
</div>
<!-- 第三行 -->
<div class="flex-row st-row">
<div class="st-col"> <div class="st-col">
<div class="st-col-title">项目负责人</div> <div class="st-col-title">项目负责人</div>
<div class="st-col-field"> <div class="st-col-field">
@ -247,12 +273,7 @@
</select> </select>
</div> </div>
</div> </div>
</div> <div class="st-col expand-section <#if extend='1'> fold</#if>">
<!-- 扩展区域 -->
<div class="expand-section <#if extend='1'> fold</#if>">
<!-- 第四行 -->
<div class="flex-row st-row">
<div class="st-col">
<div class="st-col-title">是否二次合作</div> <div class="st-col-title">是否二次合作</div>
<div class="st-col-field"> <div class="st-col-field">
<select data-am-selected="{btnSize: 'sm',btnWidth: '100%',maxHeight: 500}" id="isSecond" name="isSecond"> <select data-am-selected="{btnSize: 'sm',btnWidth: '100%',maxHeight: 500}" id="isSecond" name="isSecond">
@ -262,7 +283,7 @@
</select> </select>
</div> </div>
</div> </div>
<div class="st-col"> <div class="st-col expand-section <#if extend='1'> fold</#if>">
<div class="st-col-title">直签</div> <div class="st-col-title">直签</div>
<div class="st-col-field"> <div class="st-col-field">
<select data-am-selected="{btnSize: 'sm',btnWidth: '100%',maxHeight: 500}" id="signType" name="signType"> <select data-am-selected="{btnSize: 'sm',btnWidth: '100%',maxHeight: 500}" id="signType" name="signType">
@ -272,7 +293,7 @@
</select> </select>
</div> </div>
</div> </div>
<div class="st-col"> <div class="st-col expand-section <#if extend='1'> fold</#if>">
<div class="st-col-title">行业场景</div> <div class="st-col-title">行业场景</div>
<div class="st-col-field"> <div class="st-col-field">
<select data-am-selected="{btnSize: 'sm',btnWidth: '100%',maxHeight: 500}" id="industryScene" name="industryScene"> <select data-am-selected="{btnSize: 'sm',btnWidth: '100%',maxHeight: 500}" id="industryScene" name="industryScene">
@ -294,6 +315,11 @@
</select> </select>
</div> </div>
</div> </div>
</div>
<!-- 扩展区域 -->
<div class="expand-section <#if extend='1'> fold</#if>">
<!-- 第四行 -->
<div class="flex-row st-row">
<div class="st-col"> <div class="st-col">
<div class="st-col-title">项目解决方案</div> <div class="st-col-title">项目解决方案</div>
<div class="st-col-field"> <div class="st-col-field">
@ -305,18 +331,15 @@
</select> </select>
</div> </div>
</div> </div>
</div> <div class="st-col st-col-4">
<!-- 第五行 -->
<div class="flex-row st-row">
<div class="st-col">
<div class="st-col-title">最后更新时间</div> <div class="st-col-title">最后更新时间</div>
<div class="st-col-field"> <div class="flex-row st-col-field">
<div class="am-form-icon"> <div class="am-form-icon">
<i class="am-icon-calendar"></i> <i class="am-icon-calendar"></i>
<input type="text" class="am-form-field am-input-sm" id="startUpdateDate" <input type="text" class="am-form-field am-input-sm" id="startUpdateDate"
value="${startUpdateDate!}" placeholder="开始日期" autocomplete="off" data-am-datepicker> value="${startUpdateDate!}" placeholder="开始日期" autocomplete="off" data-am-datepicker>
</div> </div>
<div>至</div> <div class="mid-connect">至</div>
<div class="am-form-icon"> <div class="am-form-icon">
<i class="am-icon-calendar"></i> <i class="am-icon-calendar"></i>
<input type="text" class="am-form-field am-input-sm" id="endUpdateDate" <input type="text" class="am-form-field am-input-sm" id="endUpdateDate"
@ -324,15 +347,15 @@
</div> </div>
</div> </div>
</div> </div>
<div class="st-col"> <div class="st-col st-col-4">
<div class="st-col-title">项目周期</div> <div class="st-col-title">项目周期</div>
<div class="st-col-field"> <div class="flex-row st-col-field">
<div class="am-form-icon"> <div class="am-form-icon">
<i class="am-icon-calendar"></i> <i class="am-icon-calendar"></i>
<input type="text" class="am-form-field am-input-sm" id="startDate" <input type="text" class="am-form-field am-input-sm" id="startDate"
value="${startDate!}" placeholder="开始日期" autocomplete="off" data-am-datepicker> value="${startDate!}" placeholder="开始日期" autocomplete="off" data-am-datepicker>
</div> </div>
<div>至</div> <div class="mid-connect">至</div>
<div class="am-form-icon"> <div class="am-form-icon">
<i class="am-icon-calendar"></i> <i class="am-icon-calendar"></i>
<input type="text" class="am-form-field am-input-sm" id="endDate" <input type="text" class="am-form-field am-input-sm" id="endDate"
@ -340,15 +363,15 @@
</div> </div>
</div> </div>
</div> </div>
<div class="st-col"> <div class="st-col st-col-4">
<div class="st-col-title">预计合同签订时间</div> <div class="st-col-title">预计合同签订时间</div>
<div class="st-col-field"> <div class="flex-row st-col-field">
<div class="am-form-icon"> <div class="am-form-icon">
<i class="am-icon-calendar"></i> <i class="am-icon-calendar"></i>
<input type="text" class="am-form-field am-input-sm" id="contractStartTime" <input type="text" class="am-form-field am-input-sm" id="contractStartTime"
value="${contractStartTime!}" placeholder="开始日期" autocomplete="off" data-am-datepicker> value="${contractStartTime!}" placeholder="开始日期" autocomplete="off" data-am-datepicker>
</div> </div>
<div>至</div> <div class="mid-connect">至</div>
<div class="am-form-icon"> <div class="am-form-icon">
<i class="am-icon-calendar"></i> <i class="am-icon-calendar"></i>
<input type="text" class="am-form-field am-input-sm" id="contractEndTime" <input type="text" class="am-form-field am-input-sm" id="contractEndTime"
@ -356,8 +379,6 @@
</div> </div>
</div> </div>
</div> </div>
<div class="st-col">
</div>
</div> </div>
</div> </div>
<div class="flex-row tools-row"> <div class="flex-row tools-row">