Explorar o código

update 修改dtp 页面显示效果 添加 自适应

bzd_lxf hai 3 semanas
pai
achega
d8ad81218a

+ 84 - 0
health-admin/src/main/resources/static/health/css/input-styles.css

@@ -18,6 +18,34 @@
 	transition: all 0.3s ease; /* 过渡动画 */
 }
 
+/*证件类型前面的小input*/
+.styled-input.short {
+	/*display: block; /* 使其独占一行 */
+	width: 80px; /* 宽度为容器宽度 */
+	height: 30px;
+	padding: 6px; /* 内边距 */
+	font-size: 14px; /* 字体大小 */
+	color: #333; /* 字体颜色 */
+	/*background-color: #fff; !* 背景颜色 *!*/
+	border: 1px solid #ccc; /* 边框 */
+	border-radius: 4px; /* 圆角边框 */
+	outline: none; /* 移除轮廓 */
+	transition: all 0.3s ease; /* 过渡动画 */
+}
+.customize-form-group .styled-input.edit_inputs {
+	/*display: block; /* 使其独占一行 */
+	width: 480px; /* 宽度为容器宽度 */
+	height: 30px;
+	padding: 6px; /* 内边距 */
+	font-size: 14px; /* 字体大小 */
+	color: #333; /* 字体颜色 */
+	/*background-color: #fff; !* 背景颜色 *!*/
+	border: 1px solid #ccc; /* 边框 */
+	border-radius: 4px; /* 圆角边框 */
+	outline: none; /* 移除轮廓 */
+	transition: all 0.3s ease; /* 过渡动画 */
+}
+
 /* 聚焦时的效果 */
 .styled-input:focus {
 	border-color: #55acee; /* 聚焦时边框颜色 */
@@ -47,6 +75,51 @@
 	box-shadow: 0 0 5px rgba(85, 170, 238, 0.5); /* 改变过的阴影 */
 	background-color: rgb(232, 240, 254);
 }
+/* 名字后面的勾的状态*/
+.customize-form-group .fa {
+	position: relative;
+	top: -7px; /* 根据需要调整这个值 */
+}
+/*判断为1的数据显示红色*/
+.customize-form-group .fa-check {
+	color: red;
+}
+/*勾后面字的位置*/
+.customize-form-group .status {
+	position: relative;
+	top: -5px; /* 根据需要调整这个值 */
+	width: 50px;
+	border: none;
+}
+/*用于一行显示 数据不够填充长度*/
+.span_line{
+	width: 66px;
+}
+
+.input-groups {
+	display: inline-flex; /* 使用inline-flex布局 */
+	flex-wrap: nowrap; /* 防止单选按钮换行 */
+	white-space: nowrap; /* 防止文字换行 */
+	overflow: hidden; /* 当内容超出时隐藏多余部分 */
+	text-overflow: ellipsis; /* 显示省略号表示被截断的内容 */
+	width:480px;
+	height: 30px;
+	transform: translateY(20%); /* 向上移动一半的高度 */
+	vertical-align: middle; /* 垂直居中对齐 */
+}
+
+.form-check-radio {
+	margin-right: 0.5em; /* 调整单选按钮与文字间的距离 */
+	margin: 1px 5px 10px 10px !important;
+	margin-top: 1px;
+	line-height: normal;
+	position: relative;
+}
+/*这个是保险 input 多选方式宽度 */
+.mySelectClass {
+	width: 480px !important;
+}
+
 input{
 	width: 15px;
 }
@@ -105,6 +178,13 @@ li {
 	margin-bottom: 0.5em; /* 每个子元素底部的外边距 */
 }
 
+.customize-form-group.edit {
+	display: flex; /* 使用 Flexbox 布局 */
+	align-items: end; /* 垂直居中对齐子元素 */
+	flex-basis: calc(5% - 0.5em); /* 计算每个子元素的基础大小,减去一定的间隔 */
+	margin-bottom: 0.5em; /* 每个子元素底部的外边距 */
+}
+
 /* 控制输入框前面的label 标签显示的内容 */
 .customize-form-group label {
 	width: 150px; /* 标签的宽度 */
@@ -141,6 +221,10 @@ li {
 	.customize-form-group {
 		flex-basis: 40%; /* 在小屏幕设备上,每个表单项占据整行 */
 	}
+	.customize-search-form{
+		flex-basis: 40%;!important; /* 在小屏幕设备上,每个表单项占据整行 */
+		margin-bottom: 1px;
+	}
 }
 
 /* 查询条件容器 */

+ 5 - 0
health-admin/src/main/resources/static/health/css/ry-ui.css

@@ -326,6 +326,11 @@
   content: '* ';
   color: red;
 }
+/*显示必填红色标注*/
+.is-required:before {
+	content: '* ';
+	color: red;
+}
 
 label.error {
 	position: absolute;

A diferenza do arquivo foi suprimida porque é demasiado grande
+ 531 - 771
health-admin/src/main/resources/templates/dtp/archives/archivesEdit.html


Algúns arquivos non se mostraron porque demasiados arquivos cambiaron neste cambio