iscs 闭路电视 车站时序编辑页面调整

src/views/iscs/iscsSystem/config/cctv/timeCCTV.vue

@@ -327,6 +327,7 @@ border-right: 2px solid #a85321;
 border-bottom: 2px solid #502b53;
 font-weight:bold;
 float:right;
+cursor: pointer;
 }
 .time-cctv-content-bottomR{width:560px;
     margin-left:300px;

src/views/iscs/iscsSystem/config/cctv/timeEditCCTV.vue

@@ -25,7 +25,13 @@
             />
           </el-table>
         </div>
-        <div class="edit-cctv-top-contentC"></div>
+        <div class="edit-cctv-top-contentC">
+            <div class="edit-cctv-top-contentCIn">
+              <div class="edit-cctv-top-contentCInTitle">功能选择</div>
+              <div class="edit-cctv-top-contentCInBtn">修改</div>
+              <div class="edit-cctv-top-contentCInBtn" style="margin-top:30px;">删除</div>
+            </div>
+        </div>
         <div class="edit-cctv-top-contentR">
           <el-table
             cell-class-name="edit_cctv_column"
@@ -57,8 +63,72 @@
     <div class="edit-cctv-bottom">
       <div class="edit-cctv-bottom-title"></div>
       <div class="edit-cctv-bottom-content">
-        <div class="edit-cctv-bottom-contentL"></div>
+        <div class="edit-cctv-bottom-contentL">
-        <div class="edit-cctv-bottom-contentR"></div>
+          <div class="edit-cctv-bottom-contentLL">
+            <div class="edit-cctv-bottom-contentLLTitle">车站位置</div>
+            <div class="edit-cctv-bottom-contentLLGroup">
+              <div class="each-dit-cctv-bottom-contentLL">会展中心站</div>
+              <div class="each-dit-cctv-bottom-contentLL active">世纪大道站</div>
+              <div class="each-dit-cctv-bottom-contentLL">交通大学站</div>
+              <div class="each-dit-cctv-bottom-contentLL">市图书馆站</div>
+              <div class="each-dit-cctv-bottom-contentLL">中心医院站</div>
+              <div class="each-dit-cctv-bottom-contentLL">未来路站</div>
+              <div class="each-dit-cctv-bottom-contentLL">火车站</div>
+              <div class="each-dit-cctv-bottom-contentLL">人民广场站</div>
+              <div class="each-dit-cctv-bottom-contentLL">体育中心站</div>
+            </div>
+          </div>
+          <div class="edit-cctv-bottom-contentLR">
+            <div class="edit-cctv-bottom-contentLRTitle">位置描述</div>
+            <div class="edit-cctv-bottom-contentLRGroup"></div>
+          </div>
+        </div>
+        <div class="edit-cctv-bottom-contentR">
+          <div class="edit-cctv-bottom-contentRL">
+              <div class="edit-cctv-bottom-contentRLlabel">显示时间（秒）</div>
+              <div class="edit-cctv-bottom-contentRLtext"></div>
+              <div class="edit-cctv-bottom-contentRLBtn1">加入</div>
+              <div class="edit-cctv-bottom-contentRLBtn1">移除</div>
+              <div class="edit-cctv-bottom-contentRLBtn1">全部删除</div>
+          </div>
+          <div class="edit-cctv-bottom-contentRC">
+            <div class="edit-cctv-bottom-contentRCT1">
+              <div class="edit-cctv-bottom-contentRCT1title">序列编号</div>
+              <div class="edit-cctv-bottom-contentRCT1text">121</div>
+            </div>
+            <div class="edit-cctv-bottom-contentRCT2">
+              <div class="edit-cctv-bottom-contentRCT2title">序列描述</div>
+              <div class="edit-cctv-bottom-contentRCT2text"></div>
+            </div>
+            <div class="edit-cctv-bottom-contentRContent">
+              <el-table
+                cell-class-name="edit_cctv_column"
+                header-cell-class-name="edit_cctv_thead"
+                :data="tableData"
+                border
+                style="width: 100%;overflow-y:auto;border:none;margin-top:10px;"
+                height="230px"
+              >
+                <el-table-column
+                  label="车站"
+                  width="120"
+                />
+                <el-table-column
+                  label="摄像机"
+                  width="120"
+                />
+                <el-table-column
+                  prop="describe"
+                  label="时间（秒）"
+                />
+              </el-table>
+            </div>
+          </div>
+          <div class="edit-cctv-bottom-contentRR">
+            <div class="edit-cctv-bottom-contentRRBtn1">确认</div>
+            <div class="edit-cctv-bottom-contentRRBtn1">取消</div>
+          </div>
+        </div>
       </div>
       <div class="edit-cctv-bottom-foot">
         <div class="edit-cctv-bottom-footL">信息提示：</div>
@@ -134,6 +204,7 @@ export default {
     border-left: 2px solid #8c8a89;
     border-right: 2px solid #fff;
     border-bottom: 2px solid #fff;
+    margin-bottom:30px;
 }
 .edit-cctv-bottom-title{
   height:20px;
@@ -146,6 +217,7 @@ export default {
     font-size: 14px;
     color: #061c77;
     width: 26%;
+    font-weight:bold;
 }
 .edit-cctv-bottom-footC{
     width: 45%;
@@ -169,9 +241,130 @@ export default {
     text-align: center;
     font-weight: bold;
 }
-.edit-cctv-bottom-content{}
+.edit-cctv-bottom-content{
-.edit-cctv-bottom-contentL{}
+    width: 1100px;
-.edit-cctv-bottom-contentR{}
+    margin: 10px auto 20px auto;
+    display:flex;
+}
+.edit-cctv-bottom-contentL{width: 410px;display:flex;}
+.edit-cctv-bottom-contentR{margin-left:100px;display:flex;}
+.edit-cctv-bottom-contentLL{width:200px;border:1px #443b71 solid;}
+.edit-cctv-bottom-contentLLTitle{width:100%;background:#5c48f8;color:#fff;
+padding:5px 0px;text-align:center;font-size:13px;}
+.edit-cctv-bottom-contentLLGroup{width:197px;padding-top:5px;height:300px;overflow-y:auto;
+border-left:1px #6a7487 solid;margin-left:1px;border-top:1px #694aaf solid;
+border-right:1px #6a7487 solid;border-bottom:1px #6a7487 solid;}
+.each-dit-cctv-bottom-contentLL{padding:5px 0px 5px 5px;font-size:13px;color:#061c77;
+font-weight: bold;cursor: pointer;}
+.each-dit-cctv-bottom-contentLL.active{background:#fff;border-radius:5px;}
+.edit-cctv-bottom-contentLR{width:200px;margin-left:10px;border:1px #443b71 solid;}
+.edit-cctv-bottom-contentLRTitle{width:100%;background:#5c48f8;color:#fff;
+padding:5px 0px;text-align:center;font-size:13px;}
+.edit-cctv-bottom-contentLRGroup{width:197px;padding-top:5px;height:300px;overflow-y:auto;
+border-left:1px #6a7487 solid;margin-left:1px;border-top:1px #694aaf solid;
+border-right:1px #6a7487 solid;border-bottom:1px #6a7487 solid;}
+.edit-cctv-bottom-contentRL{}
+.edit-cctv-bottom-contentRLlabel{
+    font-size: 13px;
+    color: #ccc;
+    margin-top: 80px;
+}
+.edit-cctv-bottom-contentRLtext{
+  margin-top:10px;
+  width:60px;
+  background:#fff;
+  height:20px;
+}
+.edit-cctv-bottom-contentRLBtn1{margin-top:10px;display: flex;
+    width: 65px;height:35px;font-size: 12px;
+    background: #ccc;cursor: pointer;
+    justify-content: center;
+    text-align: center;
+    border-top: 2px solid #f9f9f9;
+    border-left: 2px solid #f6f8f8;
+    border-right: 2px solid #9e9e9e;
+    border-bottom: 2px solid #636667;
+    align-items: center;
+    font-weight:bold;
+}
+.edit-cctv-bottom-contentRC{margin-left: 30px;}
+.edit-cctv-bottom-contentRCT1{margin-top:10px;}
+.edit-cctv-bottom-contentRCT2{margin-top:10px;}
+.edit-cctv-bottom-contentRContent{}
+.edit-cctv-bottom-contentRCT1title{
+    display: inline-block;
+    font-size: 13px;
+    color: #56E5DE;
+    margin-right: 5px;
+    vertical-align: top;
+    margin-top: 2px;
+}
+.edit-cctv-bottom-contentRCT1text{
+    height: 16px;
+    width: 80px;
+    background: #fff;
+    display: inline-block;
+    font-size:12px;
+    vertical-align:top;
+    line-height:16px;
+    padding-left:5px;
+}
+.edit-cctv-bottom-contentRCT2title{
+    display: inline-block;
+    font-size: 13px;
+    color: #56E5DE;
+    margin-right: 5px;
+    vertical-align: top;
+    margin-top: 2px;
+}
+.edit-cctv-bottom-contentRCT2text{
+    height: 16px;
+    width: 290px;
+    background: #fff;
+    display: inline-block;
+}
+.edit-cctv-bottom-contentRR{
+    margin-top: 220px;
+    margin-left: 30px;
+}
+.edit-cctv-bottom-contentRRBtn1{
+    margin-top:10px;display: flex;
+    width: 65px;height:35px;font-size: 12px;
+    background: #ccc;cursor: pointer;
+    justify-content: center;
+    text-align: center;
+    border-top: 2px solid #f9f9f9;
+    border-left: 2px solid #f6f8f8;
+    border-right: 2px solid #9e9e9e;
+    border-bottom: 2px solid #636667;
+    align-items: center;
+    font-weight:bold;
+}
+.edit-cctv-top-contentCIn{width:80px;margin-left:10px;
+    margin-top: 45px;
+    height: 160px;
+    border: 1px #061c77 solid;
+    
+}
+.edit-cctv-top-contentCInTitle{font-size:13px;background:#5c48f8;color:#fff;padding:5px 0px;text-align:center}
+.edit-cctv-top-contentCInBtn{
+  margin-top: 20px;
+  display: flex;
+  width: 50px;
+  height: 35px;
+  font-size: 12px;
+  background: #ccc;
+  cursor: pointer;
+  margin-left:15px;
+  justify-content: center;
+  text-align: center;
+  border-top: 2px solid #f9f9f9;
+  border-left: 2px solid #f6f8f8;
+  border-right: 2px solid #9e9e9e;
+  border-bottom: 2px solid #636667;
+  align-items:center;
+  font-weight:bold;
+}
 </style>
 <style lang="scss">
 .el-table .edit_cctv_column .cell{font-size:12px;}