/** 导航栏高度设置 */
|
// .navBarPage-height {
|
// min-height: 0px;
|
// }
|
|
/** 流程容器 */
|
.case-process-container {
|
position: absolute;
|
top: 44px;
|
width: 100%;
|
height: 82px;
|
}
|
|
/** 案件信息区块样式 */
|
.case-info-container {
|
margin-top: 89px;
|
padding-bottom: 68px;
|
|
.case-info-block {
|
background-color: #fff;
|
margin-bottom: 8px; // 区块之间的间隔
|
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
|
|
.block-title {
|
font-size: 16px;
|
font-weight: 500;
|
color: #171A1D;
|
margin-bottom: 12px;
|
}
|
|
>.block-content {
|
padding: 0px;
|
min-height: 40px;
|
}
|
}
|
|
/* 添加人员信息按钮样式 */
|
.add-personnel-btn {
|
width: 352px;
|
height: 44px;
|
background: #ffffff !important;
|
border: 0.5px solid #1a6fb8 !important;
|
border-radius: 22.5px !important;
|
|
span {
|
color: #1a6fb8;
|
}
|
}
|
|
/* 添加人员信息容器 */
|
.add-personnel-container {
|
display: flex;
|
justify-content: center;
|
padding: 15px 0 10px;
|
background: #F2F2F2;
|
}
|
|
/* 添加人员信息图标 */
|
.add-personnel-icon {
|
width: 18px;
|
height: 17px;
|
vertical-align: middle;
|
margin-right: 8px;
|
position: relative;
|
top: 2px;
|
}
|
|
/* 添加人员信息文本 */
|
.add-personnel-text {
|
vertical-align: middle;
|
position: relative;
|
top: 2px;
|
}
|
}
|
|
/* 缓存表单容器样式 - 用于包裹所有人员信息卡片 */
|
.cached-forms-container {
|
display: flex;
|
flex-direction: column;
|
background-color: #f2f2f2;
|
gap: 10px;
|
}
|
|
/* 卡片外层容器样式 */
|
.card-container {
|
background: #f2f2f2;
|
display: flex;
|
}
|
|
/* 缓存表单卡片样式 - 单个人员信息卡片 */
|
.cached-form-card {
|
width: 351px;
|
height: 72px;
|
padding: 12px,12px;
|
background: #ffffff;
|
border-radius: 8px;
|
box-sizing: border-box;
|
margin: 0 auto;
|
display: flex;
|
align-items: center;
|
position: relative;
|
|
/* 删除图标容器 */
|
.delete-icons {
|
position: absolute;
|
top: 0;
|
right: 0;
|
display: flex;
|
z-index: 10;
|
|
.delete-icon-wrapper {
|
width: 20px;
|
height: 20px;
|
margin-top: 0px;
|
display: flex;
|
justify-content: center;
|
position: relative;
|
|
img {
|
width: 18px;
|
height: 18px;
|
}
|
|
.delete-icon-overlay {
|
position: absolute;
|
left: 5px;
|
width: 12px;
|
height: 12px;
|
z-index: 2;
|
}
|
|
&:hover {
|
opacity: 0.8;
|
}
|
}
|
}
|
|
/* 申请方角色标识 */
|
.applicant-badge {
|
width: 48px;
|
height: 48px;
|
margin: 0px 8px;
|
background: #3491fa;
|
border-radius: 4px;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
flex-shrink: 0;
|
|
.applicant-text {
|
width: 42px;
|
height: 22px;
|
font-size: 14px;
|
font-family: PingFang SC, PingFang SC-400;
|
font-weight: 400;
|
text-align: center;
|
color: #ffffff;
|
line-height: 22px;
|
}
|
}
|
|
/* 被申请方角色标识 */
|
.respondent-badge {
|
width: 48px;
|
height: 48px;
|
margin: 0px 8px;
|
background: #D46B08;
|
border-radius: 4px;
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
align-items: center;
|
flex-shrink: 0;
|
padding: 2px 0;
|
box-sizing: border-box;
|
|
.respondent-text {
|
width: 28px;
|
height: 22px;
|
font-size: 14px;
|
font-family: PingFang SC, PingFang SC-400;
|
font-weight: 400;
|
text-align: center;
|
color: #ffffff;
|
line-height: 22px;
|
display: block;
|
}
|
}
|
|
/* 卡片内容区域样式 */
|
.content-wrapper {
|
flex: 1;
|
overflow: hidden;
|
}
|
|
.cached-form-content {
|
margin-bottom: 4px;
|
|
/* 姓名和电话区域 */
|
.cached-form-name-phone {
|
display: flex;
|
align-items: center;
|
|
/* 姓名样式 */
|
.cached-form-name {
|
font-size: 14px;
|
color: #171A1D;
|
font-weight: 400;
|
|
}
|
|
/* 电话样式 */
|
.cached-form-phone {
|
margin-left: 12px;
|
color: #86909C;
|
font-size: 14px;
|
flex-shrink: 0;
|
}
|
}
|
}
|
|
/* 卡片头部样式 */
|
.cached-form-header {
|
/* 人员类型样式 */
|
.cached-form-type {
|
font-size: 12px;
|
color: #86909C;
|
|
span {
|
margin-left: 6px;
|
color: #0e5fd8;
|
font-size: 12px;
|
}
|
}
|
}
|
}
|
|
/* 分隔线样式 */
|
.card-separator {
|
background-color: #f2f3f5;
|
height: 8px;
|
width: 100%;
|
}
|
|
/** 事项概况区块样式 */
|
.case-overview, .case-application {
|
position: relative;
|
height: 179px;
|
background: #fff;
|
#caseOverview, #applicationText{
|
height: 100%;
|
}
|
.dtm-textarea-item-desktop{
|
padding: 0px;
|
border: 0px;
|
}
|
|
>.block-content {
|
height: 143px;
|
padding: 16px;
|
padding-bottom: 0;
|
|
.dtm-textarea-item-control{
|
height: 100px;
|
margin-bottom: 8px;
|
}
|
|
// 隐藏组件自带的计数器,使用自定义计数器显示
|
.dtm-textarea-item-count{
|
left: 0px;
|
}
|
|
.overview-form-item, .application-form-item {
|
margin-bottom: 0;
|
>.dtm-list-item{
|
min-height: 47px;
|
}
|
}
|
}
|
|
.overview-button-area {
|
position: absolute;
|
bottom: 0;
|
left: 0;
|
right: 0;
|
height: 36px;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
padding: 0;
|
background-color: #ffffff;
|
// border-top: 1px solid #ebedf0;
|
z-index: 10; // 确保按钮区域在上层
|
|
.word-count {
|
display: flex;
|
align-items: center;
|
justify-content: flex-start;
|
font-size: 12px;
|
color: #86909c;
|
width: 183px;
|
// width: 50%;
|
height: 100%;
|
padding-left: 16px;
|
|
.count-wrapper {
|
display: flex;
|
align-items: center;
|
}
|
|
.current-count {
|
color: #1a6fb8;
|
font-weight: 500;
|
}
|
|
.total-count {
|
margin-left: 2px;
|
}
|
}
|
|
.overview-actions {
|
display: flex;
|
align-items: center;
|
justify-content: flex-end;
|
width: 192px;
|
// width: 50%;
|
height: 100%;
|
background: rgba(182,221,241,0.46);
|
border-top-left-radius: 18px;
|
|
.action-button {
|
height: 100%;
|
padding: 0 8px;
|
font-size: 12px;
|
color: #1A6FB8;
|
background: transparent;
|
border-color: #1A6FB8;
|
border-radius: 4px;
|
margin: 0px;
|
display: flex;
|
align-items: center;
|
flex-direction: row;
|
justify-content: flex-start;
|
padding: 7px 12px;
|
width: 100%;
|
box-sizing: border-box;
|
|
.action-icon {
|
display: inline-block;
|
vertical-align: middle;
|
margin: 4 0px;
|
margin-right: 4px;
|
|
img {
|
width: 11px;
|
height: 11px;
|
display: block;
|
}
|
}
|
|
.action-text {
|
display: inline-block;
|
vertical-align: middle;
|
font-size: 14px;
|
line-height: 22px;
|
}
|
}
|
|
.action-button-split{
|
color: #b6ddf1;
|
width: 1px;
|
}
|
}
|
}
|
}
|
|
/** 重大矛盾纠纷区块样式 */
|
.case-major-dispute {
|
position: relative;
|
height: auto;
|
background: #fff;
|
.dtm-form-item-default{
|
>.dtm-form-item-default-label{
|
width: 50%;
|
flex: 0 0 50%;
|
}
|
>.dtm-form-item-default-field{
|
width: 50%;
|
flex: 0 1 50%;
|
}
|
}
|
|
|
// 覆盖Radio组件默认样式
|
.major-dispute-radio-group {
|
.dtm-radio-inner {
|
border-color: #1a6fb8;
|
}
|
|
.dtm-radio-checked .dtm-radio-inner {
|
border-color: #1a6fb8;
|
background-color: #1a6fb8;
|
}
|
}
|
}
|
|
|
|
/* 申请材料和证据材料区块样式 */
|
.case-application-materials, .case-evidence-materials {
|
> .dtm-list-item{
|
min-height: 47px;
|
> .dtm-list-line {
|
min-height: 47px;
|
padding: 0px;
|
> .dtm-list-content{
|
> .dtm-form-item-default{
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
width: 100%;
|
padding-right: 16px;
|
|
> .dtm-form-item-default-label{
|
flex: 3;
|
width: 100%;
|
min-width: 0;
|
padding-right: 12px;
|
word-break: break-word;
|
white-space: normal;
|
}
|
> .dtm-form-item-default-field{
|
flex: 1;
|
/* 上传容器样式 */
|
> .upload-container {
|
/* 上传按钮容器样式 */
|
.upload-button-container {
|
display: flex;
|
align-items: center;
|
height: 100%;
|
justify-content: flex-end;
|
.dtm-upload{
|
justify-content: flex-end;
|
display: flex;
|
.dtm-list-item{
|
min-height: 47px;
|
.dtm-list-line{
|
padding: 0%;
|
min-height: 47px;
|
padding-right: 0;
|
}
|
}
|
}
|
.dtm-divider{
|
width: 0%;
|
min-width: 0;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
/* 文件列表区域样式 */
|
.file-list {
|
padding: 0 16px;
|
|
/* 单个文件项样式 */
|
.file-item {
|
display: flex;
|
align-items: center;
|
padding: 13px 0;
|
|
/* 文件图标样式 */
|
.file-icon {
|
width: 42px;
|
height: 48px;
|
margin-right: 16px;
|
}
|
|
/* 文件信息区域样式 */
|
.file-info {
|
flex: 1;
|
min-width: 0;
|
|
/* 文件名称样式 */
|
.file-name {
|
font-size: 14px;
|
color: #171a1d;
|
line-height: 20px;
|
margin-bottom: 4px;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
}
|
|
/* 文件大小和预览区域样式 */
|
.file-size-preview {
|
display: flex;
|
align-items: center;
|
font-size: 12px;
|
line-height: 17px;
|
|
/* 文件大小样式 */
|
.file-size {
|
color: rgba(23, 26, 29, 0.6);
|
margin-right: 4px;
|
}
|
|
/* 预览文本样式 */
|
.preview-text {
|
color: #1a6fb8;
|
cursor: pointer;
|
|
&:active {
|
opacity: 0.8;
|
}
|
}
|
}
|
}
|
|
/* 文件操作区域样式 */
|
.file-actions {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
margin-left: 12px;
|
height: 100%;
|
|
/* 删除按钮包装器样式 */
|
.delete-btn-wrapper {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
cursor: pointer;
|
height: 100%;
|
|
/* 删除图标样式 */
|
.delete-icon {
|
width: 16px;
|
height: 16px;
|
|
&:active {
|
opacity: 0.8;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
|
/** 底部按钮区域样式 */
|
.bottom-button-area {
|
position: fixed;
|
bottom: 0;
|
left: 0;
|
width: 100%;
|
height: 68px;
|
background-color: #fff;
|
box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.1);
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
padding: 12px;
|
box-sizing: border-box;
|
z-index: 999;
|
|
.previous-button {
|
width: 123px;
|
height: 44px;
|
background-color: #ffffff;
|
color: #1a6fb8;
|
border: 1px solid #1a6fb8;
|
border-radius: 8px;
|
font-size: 16px;
|
font-weight: 500;
|
}
|
|
.preview-button {
|
width: 204px;
|
height: 44px;
|
background-color: #1a6fb8;
|
color: #ffffff;
|
border: none;
|
border-radius: 8px;
|
font-size: 16px;
|
font-weight: 500;
|
}
|
}
|
|
.person-modal {
|
|
/* 选项项样式 */
|
.modal-option-item {
|
width: 307px;
|
height: 104px;
|
border-radius: 8px;
|
padding: 10px 15px;
|
margin-bottom: 20px;
|
position: relative;
|
overflow: hidden;
|
display: flex;
|
|
/* 蓝色背景 - 申请方相关选项 */
|
&.blue-bg {
|
background: rgba(182, 221, 241, 0.46);
|
|
.item-title, .item-button {
|
color: #1A6FB8;
|
}
|
|
.item-button {
|
background-color: transparent;
|
border-color: #1A6FB8;
|
|
&:active {
|
opacity: 0.8;
|
}
|
}
|
}
|
|
/* 橙色背景 - 被申请方相关选项 */
|
&.orange-bg {
|
background: rgba(255, 204, 112, 0.25);
|
|
.item-title, .item-button {
|
color: #FF830B;
|
}
|
|
.item-button {
|
background-color: transparent;
|
border-color: #FF830B;
|
|
&:active {
|
opacity: 0.8;
|
}
|
}
|
}
|
|
/* 选项内容区域 */
|
.option-content {
|
flex: 1;
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
|
/* 标题部分 */
|
.content-item-a {
|
.item-title {
|
font-size: 16px;
|
font-weight: 500;
|
/* 颜色由父级blue-bg或orange-bg控制 */
|
}
|
}
|
|
/* 描述部分 */
|
.content-item-b {
|
.item-desc {
|
font-size: 14px;
|
color: #86909C;
|
line-height: 20px;
|
}
|
}
|
|
/* 按钮部分 */
|
.content-item-c {
|
.item-button {
|
height: 28px;
|
padding: 0 12px;
|
font-size: 14px;
|
border-radius: 4px;
|
/* 颜色由父级blue-bg或orange-bg控制 */
|
}
|
}
|
}
|
|
/* 选项图标 */
|
.option-image {
|
position: absolute;
|
right: 0px;
|
top: 20px;
|
width: 72px;
|
height: 72px;
|
}
|
}
|
}
|
|
.first{
|
margin-top: -44px;
|
background: #f2f3f5;
|
.self-inspection-container {
|
height: 100vh;
|
padding-top: 44px;
|
box-sizing: border-box;
|
display: flex;
|
flex-direction: column;
|
background: #F2F3F5;
|
|
.person-placeholder {
|
flex: 1;
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
align-items: center;
|
padding: 20px;
|
text-align: center;
|
.person-image {
|
|
img {
|
width: 130px;
|
height: auto;
|
}
|
}
|
|
.add-person-text {
|
margin-bottom: 20px;
|
font-size: 14px;
|
color: rgba(23, 26, 29, 0.6);
|
line-height: 1.5;
|
}
|
|
.add-person-btn {
|
width: 160px;
|
height: 36px;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
border-radius: 18px;
|
font-size: 14px;
|
}
|
}
|
}
|
}
|
|
/* 问题属地选择器样式 */
|
.jurisdiction-location-item{
|
> .dtm-list-line{
|
> .dtm-list-content{
|
> .dtm-form-item-default{
|
.dtm-form-item-default-field{
|
> .dtm-list-item{
|
> .dtm-list-line {
|
> .dtm-list-extra{
|
color: rgba(23, 26, 29, 0.9); /* 设置颜色为#171A1D,不透明度为90% */
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|