@@ -2473,318 +2734,8 @@ export default {
}
}
}
- .filter {
- position: relative;
- width: 100%;
- top: -10px;
- margin-top: 10px;
- margin-bottom: 6px;
- box-sizing: border-box;
- border: 1px solid #ededed;
- border-radius: 6px;
- // background-color: pink;
- padding: 0 12px;
- .filter-title {
- position: absolute;
- display: flex;
- align-items: center;
- justify-content: space-between;
- font-size: 14px;
- width: 100%;
- height: 24px;
- top: -34px;
- left: 0;
- padding-left: 20px;
- z-index: 10;
- span i {
- font-size: 12px;
- }
- .toggleFilter {
- height: 24px;
- padding: 0px 2px 0 4px;
- line-height: 22px;
- border: 1px solid #ededed;
- background-color: #f5f5f5;
- border-radius: 4px;
- color: #666;
- cursor: pointer;
- user-select: none;
- i {
- // line-height: 28px;
- height: 100%;
- line-height: 22px;
- display: inline-block;
- transform-origin: center;
- transform: scale(0.6);
- margin-left: 2px;
- }
- }
- .sort {
- width: 86px;
- height: 22px;
- margin-left: 16px;
- display: inline-block;
- text-align: center;
- padding: 0px 2px 0 4px;
- line-height: 20px;
- border: 1px solid #ededed;
- background-color: #f5f5f5;
- border-radius: 4px;
- color: #666;
- cursor: pointer;
- user-select: none;
- }
-
- > span:first-child {
- display: flex;
- align-items: center;
- justify-content: start;
- line-height: 22px;
- > span:first-child {
- margin-right: 14px;
- i {
- margin-left: 4px;
- }
- }
- }
- .filter-show {
- display: flex;
- line-height: 1;
- color: #666;
- > span:nth-child(-n + 6) {
- display: inline-block;
- }
- > span {
- display: none;
- height: 24px;
- line-height: 22px;
- padding: 0 2px 0 4px;
- background-color: #f5f5f5;
- border: 1px solid #ededed;
- margin-right: 8px;
- user-select: none;
- border-radius: 4px;
- cursor: pointer;
- &:hover {
- border-color: #1890ff;
- background: #f4faff;
- color: #1890ff;
- i {
- color: #1890ff;
- }
- }
- i {
- font-size: 14px;
- margin-left: 4px;
- color: #666;
- }
- }
- }
- }
-
- .filter-content {
- overflow: hidden;
- // background-color: skyblue;
- dl {
- display: flex;
- justify-content: start;
- padding: 8px 8px 4px 8px;
- font-size: 14px;
- line-height: 1.5;
- user-select: none;
-
- .special-active {
- color: #1890ff !important;
- // background-color: rgba(255, 106, 0, 0.1) !important;
- }
- &:first-child {
- padding-bottom: 7px;
- dd {
- > i {
- > span {
- color: #333;
- &:hover {
- color: #1890ff;
- }
- }
- }
- }
- }
- &:not(:last-child) {
- border-bottom: 1px dotted #ededed;
- }
- &:not(:first-child) {
- dd {
- display: flex;
- justify-content: start;
- flex-wrap: wrap;
- > span {
- margin-bottom: 4px;
- color: #333;
- cursor: pointer;
- &:hover {
- color: #1890ff;
- }
- }
- }
- }
- dt {
- width: 74px;
- margin-right: 16px;
- text-align: left;
- color: #888;
- }
- dd {
- flex: 1;
- .ageinputbox {
- position: relative;
- display: inline-block;
- margin-right: 16px;
- > span:nth-of-type(2) {
- position: relative;
- z-index: 2;
- }
- &:hover .confirm {
- display: block;
- }
-
- .ageinput:not(.age) {
- position: relative;
- z-index: 3;
- padding: 0;
- // margin: 0 5px;
- height: 26px;
- width: 80px;
- border-color: #ddd;
- .ant-input-prefix {
- left: 3px;
- top: 51%;
- }
- &:hover {
- input {
- border-color: #1890ff;
- }
- }
- input {
- border-radius: 4px;
- text-indent: 20px;
- height: 26px;
- padding: 0;
- padding-right: unset;
- border-color: #ddd;
- &::placeholder {
- // text-indent: 30px;
- font-size: 14px !important;
- }
- &:hover {
- border-color: #1890ff;
- box-shadow: none;
- }
- &:focus {
- border-color: #1890ff;
- box-shadow: none;
- }
- }
- .ant-input-suffix {
- right: 3px;
- }
- }
- .ageinput {
- position: relative;
- z-index: 3;
- padding: 0;
- // margin: 0 5px;
- height: 26px;
- width: 80px;
- border-color: #ddd;
- .ant-input-prefix {
- left: 3px;
- top: 51%;
- }
- &:hover {
- input {
- border-color: #1890ff;
- }
- }
- input {
- border-radius: 4px;
- text-indent: 10px;
- height: 26px;
- padding: 0;
- padding-right: unset;
- border-color: #ddd;
- &::placeholder {
- // text-indent: 30px;
- font-size: 14px !important;
- }
- &:hover {
- border-color: #1890ff;
- box-shadow: none;
- }
- &:focus {
- border-color: #1890ff;
- box-shadow: none;
- }
- }
- .ant-input-suffix {
- right: 3px;
- }
- }
- .confirm {
- position: absolute;
- display: none;
- width: 254px;
- height: 46px;
- line-height: 46px;
- left: -8px;
- top: -11px;
- z-index: 1;
- border: 1px solid #eee;
- border-radius: 6px;
- background-color: #fff;
- box-shadow: 0 0px 10px 5px #eee;
- button {
- position: relative;
- width: 44px;
- height: 26px;
- line-height: 26px;
- top: 52%;
- transform: translateY(-50%);
- margin-right: 8px;
- float: right;
- background-color: #1890ff;
- border-radius: 4px;
- border: none;
- color: #fff;
- &:hover {
- background-color: #1890ffdd;
- }
- &:active {
- background-color: #1890ffdd;
- }
- }
- }
- }
- > span {
- margin-right: 40px;
-
- > span {
- cursor: pointer;
- margin-right: 40px;
- }
- }
- }
- }
- .price {
- dd i {
- span {
- cursor: pointer;
- margin-right: 40px;
- }
- }
- }
- }
- }
+
+
.nodata {
overflow: hidden;
@@ -3293,4 +3244,328 @@ export default {
p {
margin-bottom: 0;
}
+.model-obj{
+ background-color: #ffffff;
+ position: absolute;
+ left: -592px;
+ top: 14px;
+ width: 640px;
+ border-radius: 6px;
+ .filter {
+ // position: relative;
+ // width: 100%;
+ // top: -10px;
+ // margin-top: 10px;
+ // margin-bottom: 6px;
+ box-sizing: border-box;
+ border: 1px solid #ededed;
+ // background-color: pink;
+ padding: 12px;
+ .filter-title {
+ position: absolute;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ font-size: 14px;
+ width: 100%;
+ height: 24px;
+ top: -34px;
+ left: 0;
+ padding-left: 20px;
+ z-index: 10;
+ span i {
+ font-size: 12px;
+ }
+ .toggleFilter {
+ height: 24px;
+ padding: 0px 2px 0 4px;
+ line-height: 22px;
+ border: 1px solid #ededed;
+ background-color: #f5f5f5;
+ border-radius: 4px;
+ color: #666;
+ cursor: pointer;
+ user-select: none;
+ i {
+ // line-height: 28px;
+ height: 100%;
+ line-height: 22px;
+ display: inline-block;
+ transform-origin: center;
+ transform: scale(0.6);
+ margin-left: 2px;
+ }
+ }
+ .sort {
+ width: 86px;
+ height: 22px;
+ margin-left: 16px;
+ display: inline-block;
+ text-align: center;
+ padding: 0px 2px 0 4px;
+ line-height: 20px;
+ border: 1px solid #ededed;
+ background-color: #f5f5f5;
+ border-radius: 4px;
+ color: #666;
+ cursor: pointer;
+ user-select: none;
+ }
+
+ > span:first-child {
+ display: flex;
+ align-items: center;
+ justify-content: start;
+ line-height: 22px;
+ > span:first-child {
+ margin-right: 14px;
+ i {
+ margin-left: 4px;
+ }
+ }
+ }
+ .filter-show {
+ display: flex;
+ line-height: 1;
+ color: #666;
+ > span:nth-child(-n + 6) {
+ display: inline-block;
+ }
+ > span {
+ display: none;
+ height: 24px;
+ line-height: 22px;
+ padding: 0 2px 0 4px;
+ background-color: #f5f5f5;
+ border: 1px solid #ededed;
+ margin-right: 8px;
+ user-select: none;
+ border-radius: 4px;
+ cursor: pointer;
+ &:hover {
+ border-color: #1890ff;
+ background: #f4faff;
+ color: #1890ff;
+ i {
+ color: #1890ff;
+ }
+ }
+ i {
+ font-size: 14px;
+ margin-left: 4px;
+ color: #666;
+ }
+ }
+ }
+ }
+
+ .filter-content {
+ overflow: hidden;
+ // background-color: skyblue;
+ dl {
+ display: flex;
+ justify-content: start;
+ padding: 8px 8px 4px 8px;
+ font-size: 14px;
+ line-height: 1.5;
+ user-select: none;
+
+ .special-active {
+ color: #1890ff !important;
+ // background-color: rgba(255, 106, 0, 0.1) !important;
+ }
+ &:first-child {
+ padding-bottom: 7px;
+ dd {
+ > i {
+ > span {
+ color: #333;
+ &:hover {
+ color: #1890ff;
+ }
+ }
+ }
+ }
+ }
+ &:not(:last-child) {
+ border-bottom: 1px dotted #ededed;
+ }
+ &:not(:first-child) {
+ dd {
+ display: flex;
+ justify-content: start;
+ flex-wrap: wrap;
+ > span {
+ margin-bottom: 4px;
+ color: #333;
+ cursor: pointer;
+ &:hover {
+ color: #1890ff;
+ }
+ }
+ }
+ }
+ dt {
+ width: 74px;
+ margin-right: 16px;
+ text-align: left;
+ color: #888;
+ }
+ dd {
+ flex: 1;
+ .ageinputbox {
+ position: relative;
+ display: inline-block;
+ margin-right: 16px;
+ > span:nth-of-type(2) {
+ position: relative;
+ z-index: 2;
+ }
+ &:hover .confirm {
+ display: block;
+ }
+
+ .ageinput:not(.age) {
+ position: relative;
+ z-index: 3;
+ padding: 0;
+ // margin: 0 5px;
+ height: 26px;
+ width: 80px;
+ border-color: #ddd;
+ .ant-input-prefix {
+ left: 3px;
+ top: 51%;
+ }
+ &:hover {
+ input {
+ border-color: #1890ff;
+ }
+ }
+ input {
+ border-radius: 4px;
+ text-indent: 20px;
+ height: 26px;
+ padding: 0;
+ padding-right: unset;
+ border-color: #ddd;
+ &::placeholder {
+ // text-indent: 30px;
+ font-size: 14px !important;
+ }
+ &:hover {
+ border-color: #1890ff;
+ box-shadow: none;
+ }
+ &:focus {
+ border-color: #1890ff;
+ box-shadow: none;
+ }
+ }
+ .ant-input-suffix {
+ right: 3px;
+ }
+ }
+ .ageinput {
+ position: relative;
+ z-index: 3;
+ padding: 0;
+ // margin: 0 5px;
+ height: 26px;
+ width: 80px;
+ border-color: #ddd;
+ .ant-input-prefix {
+ left: 3px;
+ top: 51%;
+ }
+ &:hover {
+ input {
+ border-color: #1890ff;
+ }
+ }
+ input {
+ border-radius: 4px;
+ text-indent: 10px;
+ height: 26px;
+ padding: 0;
+ padding-right: unset;
+ border-color: #ddd;
+ &::placeholder {
+ // text-indent: 30px;
+ font-size: 14px !important;
+ }
+ &:hover {
+ border-color: #1890ff;
+ box-shadow: none;
+ }
+ &:focus {
+ border-color: #1890ff;
+ box-shadow: none;
+ }
+ }
+ .ant-input-suffix {
+ right: 3px;
+ }
+ }
+ .confirm {
+ position: absolute;
+ display: none;
+ width: 254px;
+ height: 46px;
+ line-height: 46px;
+ left: -8px;
+ top: -11px;
+ z-index: 1;
+ border: 1px solid #eee;
+ border-radius: 6px;
+ background-color: #fff;
+ box-shadow: 0 0px 10px 5px #eee;
+ button {
+ position: relative;
+ width: 44px;
+ height: 26px;
+ line-height: 26px;
+ top: 52%;
+ transform: translateY(-50%);
+ margin-right: 8px;
+ float: right;
+ background-color: #1890ff;
+ border-radius: 4px;
+ border: none;
+ color: #fff;
+ &:hover {
+ background-color: #1890ffdd;
+ }
+ &:active {
+ background-color: #1890ffdd;
+ }
+ }
+ }
+ }
+ > span {
+ margin-right: 40px;
+
+ > span {
+ cursor: pointer;
+ margin-right: 40px;
+ }
+ }
+ }
+ }
+ .price {
+ dd i {
+ span {
+ cursor: pointer;
+ margin-right: 40px;
+ }
+ }
+ }
+ }
+ }
+ }
+ .dav{
+ &:hover{
+ color: rgb(24, 144, 255);
+ }
+ }