修改登录策略样式

src/views/systemManagement/LoginPolicy/index.vue

@@ -35,8 +35,8 @@
                       color: #303133;
                       width: 20px;
                       background: #fff;
-                      right: 24px;
-                      top: 34px;
+                      right: 15px;
+                      top: 31px;
                     "
                   >
                     ×
@@ -46,12 +46,38 @@
                       <div class="header-mid">
                         <span class="title">{{ item.TacName }} </span>
                       </div>
+                      <div
+                        class="loger"
+                        v-is="['logintac_btn_edit']"
+                        @click="EditStystem(item.TacId)"
+                      ></div>
+                    </div>
+                    <div class="cont-top">
+                      <div class="cont_chid">
+                        <p>开始时间：</p>
+                        <span>{{
+                          item.LoginDateBegins ? item.LoginDateBegins : "--"
+                        }}</span>
+                      </div>
+                      <div class="cont_chid">
+                        <p>截止时间：</p>
+                        <span>{{
+                          item.LoginDateEnds ? item.LoginDateEnds : "--"
+                        }}</span>
+                      </div>
+                      <div class="cont_chid">
+                        <p>登录时段：</p>
+                        <span>{{
+                          item.LoginTimeBegins ? item.LoginTimeBegins : "--"
+                        }}</span>
+                        <span style="margin-left: 5px; margin-right: 5px"
+                          >至</span
+                        >
+                        <span>{{
+                          item.LoginTimeEnds ? item.LoginTimeEnds : "--"
+                        }}</span>
+                      </div>
                     </div>
-                    <div
-                      class="loger"
-                      v-is="['logintac_btn_edit']"
-                      @click="EditStystem(item.TacId)"
-                    ></div>
                   </div>
                 </el-card>
               </el-col>
@@ -168,6 +194,24 @@ export default {
               this.dataList.push(datas);
               const arrs = this.dataList.flat();
               this.tacList = arrs;
+              this.tacList.forEach((element) => {
+                if (element.LoginDateBegin) {
+                  element.LoginDateBegins =
+                    element.LoginDateBegin.split("T")[0];
+                }
+                if (element.LoginDateEnd) {
+                  element.LoginDateEnds = element.LoginDateEnd.split("T")[0];
+                }
+                element.LoginTimeBegins =
+                  element.LoginTimeBegin.split(":")[0] +
+                  ":" +
+                  element.LoginTimeBegin.split(":")[1];
+                element.LoginTimeEnds =
+                  element.LoginTimeEnd.split(":")[0] +
+                  ":" +
+                  element.LoginTimeEnd.split(":")[1];
+                console.log(element);
+              });
               this.loading = false;
             }
             resolve();
@@ -235,9 +279,31 @@ export default {
   background-size: 100% 100%;
   border: 1px solid #e4e7ec;
   border-radius: 50%;
-  margin-top: 24px;
+  margin-right: 24px;
   display: inline-block;
 }
+.cont-top {
+  width: 100%;
+  > .cont_chid {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+    > p {
+      font-size: 14px;
+      font-family: Microsoft YaHei;
+      font-weight: 400;
+      color: #303133;
+      margin: 0 0 0 0;
+    }
+    > span {
+      font-size: 14px;
+      font-family: DIN;
+      font-weight: 500;
+      color: #909399;
+    }
+  }
+}
 ::v-deep .el-card__body {
   padding: 24px;
 }
@@ -297,7 +363,7 @@ export default {
 }
 .box-card {
   width: 100%;
-  height: 112px;
+  height: 144px;
   margin-right: 10px;
   box-shadow: 0px 6px 7px 0px rgba(0, 0, 0, 0.06);
   border-radius: 8px;
@@ -321,6 +387,8 @@ export default {
   display: flex;
   flex-direction: row;
   align-items: center;
+  justify-content: space-between;
+  margin-bottom: 18px;
 }
 .item {
   padding: 10px;