|
|
@@ -197,12 +197,11 @@
|
|
|
:model="form"
|
|
|
:rules="rules"
|
|
|
label-width="180px"
|
|
|
- inline
|
|
|
:disabled="disableEdit"
|
|
|
>
|
|
|
<el-row class="tab-invililation">
|
|
|
<h2>开考检测</h2>
|
|
|
- <el-form-item label="">
|
|
|
+ <el-form-item label="" label-width="0px">
|
|
|
<div class="d-flex flex-column tab-invililation-radio">
|
|
|
<el-radio v-model="form.entryAuthenticationPolicy" label="OFF">
|
|
|
安全级别：<span style="color: #202b4b; font-size: 20px;">
|
|
|
@@ -381,152 +380,120 @@
|
|
|
</el-radio>
|
|
|
</el-form-item>
|
|
|
</el-row>
|
|
|
- <el-row>
|
|
|
- <el-form-item
|
|
|
- v-if="form.monitorProxy && enablePrevilleges"
|
|
|
- label="是否需要视频回放"
|
|
|
- >
|
|
|
- <el-radio v-model="form.monitorRecord" label="MIX">是 </el-radio>
|
|
|
- <el-radio v-model="form.monitorRecord" label="OFF">否 </el-radio>
|
|
|
- </el-form-item>
|
|
|
- </el-row>
|
|
|
- <el-row>
|
|
|
- <el-form-item v-if="form.monitorProxy" label="电脑&手机监控方案">
|
|
|
- <el-checkbox-group v-model="form.monitorVideoSource">
|
|
|
- <div class="d-flex">
|
|
|
- <div class="d-flex flex-column justify-content-between">
|
|
|
- <el-checkbox label="CLIENT_CAMERA"
|
|
|
- >电脑摄像头主机位</el-checkbox
|
|
|
- >
|
|
|
- <el-checkbox
|
|
|
- label="CLIENT_SCREEN"
|
|
|
- :disabled="
|
|
|
- !form.monitorVideoSource.includes('CLIENT_CAMERA')
|
|
|
- "
|
|
|
- :title="
|
|
|
- !form.monitorVideoSource.includes('CLIENT_CAMERA') &&
|
|
|
- '原因：先选择电脑摄像头主机位'
|
|
|
- "
|
|
|
- >电脑开启录屏</el-checkbox
|
|
|
- >
|
|
|
- <el-checkbox label="MOBILE_FIRST">手机主机位</el-checkbox>
|
|
|
- <el-checkbox
|
|
|
- :disabled="
|
|
|
- !form.monitorVideoSource.includes('MOBILE_FIRST')
|
|
|
- "
|
|
|
- :title="
|
|
|
- !form.monitorVideoSource.includes('MOBILE_FIRST') &&
|
|
|
- '原因：先选择手机主机位'
|
|
|
- "
|
|
|
- label="MOBILE_SECOND"
|
|
|
- >手机辅机位</el-checkbox
|
|
|
- >
|
|
|
- <span style="color: red; font-size: 12px;"
|
|
|
- >*主机位设备负责收音及播放监考提示</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- <div
|
|
|
- style="
|
|
|
- margin-left: 20px;
|
|
|
- padding: 10px;
|
|
|
- font-size: 10px;
|
|
|
- background: #f0f4f9;
|
|
|
- position: relative;
|
|
|
- "
|
|
|
- >
|
|
|
- <div
|
|
|
- style="
|
|
|
- position: absolute;
|
|
|
- width: 108px;
|
|
|
- height: 40px;
|
|
|
- border-left: 1px dotted grey;
|
|
|
- border-bottom: 1px dotted grey;
|
|
|
- left: 35px;
|
|
|
- top: 115px;
|
|
|
- border-radius: 5px;
|
|
|
- "
|
|
|
- :class="
|
|
|
- form.monitorVideoSource.includes('MOBILE_SECOND') &&
|
|
|
- 'enhance-left-bottom-line'
|
|
|
- "
|
|
|
- ></div>
|
|
|
- <div
|
|
|
- style="
|
|
|
- position: absolute;
|
|
|
- width: 108px;
|
|
|
- height: 40px;
|
|
|
- border-right: 1px dotted grey;
|
|
|
- border-top: 1px dotted grey;
|
|
|
- right: 35px;
|
|
|
- bottom: 122px;
|
|
|
- border-radius: 5px;
|
|
|
- "
|
|
|
- :class="
|
|
|
- form.monitorVideoSource.includes('MOBILE_FIRST') &&
|
|
|
- 'enhance-right-bottom-line'
|
|
|
- "
|
|
|
- ></div>
|
|
|
- <div
|
|
|
- style="
|
|
|
- position: absolute;
|
|
|
- width: 2px;
|
|
|
- height: 10px;
|
|
|
- border-right: 1px dotted grey;
|
|
|
- left: 236px;
|
|
|
- top: 92px;
|
|
|
- "
|
|
|
- :class="
|
|
|
- form.monitorVideoSource.includes('CLIENT_CAMERA') &&
|
|
|
- 'enhance-right-line'
|
|
|
- "
|
|
|
- ></div>
|
|
|
- <div class="d-flex">
|
|
|
- <div
|
|
|
- class="d-flex flex-column justify-content-center align-items-center"
|
|
|
- style="width: 52px !important;"
|
|
|
- >
|
|
|
- <div :class="monitorImgSrc('MOBILE_SECOND')" />
|
|
|
- <span style="font-size: 10px;">手机辅机位</span>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="d-flex flex-column justify-content-center align-items-center"
|
|
|
- style="width: 350px !important;"
|
|
|
- >
|
|
|
- <div :class="monitorImgSrc('CLIENT_CAMERA')" />
|
|
|
- <span style="font-size: 10px;">电脑摄像头主机位</span>
|
|
|
- </div>
|
|
|
- <div style="width: 52px !important;"></div>
|
|
|
- </div>
|
|
|
- <div
|
|
|
- class="d-flex"
|
|
|
- style="margin-bottom: -60px; margin-top: -30px;"
|
|
|
- >
|
|
|
- <div style="width: 52px !important;"></div>
|
|
|
- <div
|
|
|
- class="d-flex flex-column justify-content-center align-items-center"
|
|
|
- style="width: 350px !important;"
|
|
|
- >
|
|
|
- <div :class="monitorImgSrc('CLIENT_SCREEN')" />
|
|
|
- <span style="font-size: 10px;">电脑开启录屏</span>
|
|
|
- </div>
|
|
|
- <div style="width: 52px !important;"></div>
|
|
|
- </div>
|
|
|
- <div class="d-flex">
|
|
|
- <div style="width: 52px !important;"></div>
|
|
|
- <div style="width: 350px !important;"></div>
|
|
|
- <div
|
|
|
- class="d-flex flex-column justify-content-center align-items-center"
|
|
|
- style="width: 52px !important;"
|
|
|
- >
|
|
|
- <div :class="monitorImgSrc('MOBILE_FIRST')" />
|
|
|
- <span style="font-size: 10px;">手机主机位</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </el-checkbox-group>
|
|
|
- </el-form-item>
|
|
|
- </el-row>
|
|
|
+ <div
|
|
|
+ class="monitor-config"
|
|
|
+ v-if="form.monitorProxy && enablePrevilleges"
|
|
|
+ >
|
|
|
+ <div class="monitor-config-options">
|
|
|
+ <h3 class="monitor-title">监考直播方案配置：</h3>
|
|
|
+ <el-form-item label="电脑摄像头主机位">
|
|
|
+ <el-radio-group
|
|
|
+ v-model="monitorVideoSource.CLIENT_CAMERA"
|
|
|
+ @change="monitorClientCameraChange"
|
|
|
+ >
|
|
|
+ <el-radio
|
|
|
+ v-for="(val, key) in monitorTypes"
|
|
|
+ :key="key"
|
|
|
+ :label="key"
|
|
|
+ >{{ val }}
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="电脑操作录屏">
|
|
|
+ <el-radio-group
|
|
|
+ v-model="monitorVideoSource.CLIENT_SCREEN"
|
|
|
+ :disabled="monitorVideoSource.CLIENT_CAMERA === '0'"
|
|
|
+ :title="
|
|
|
+ monitorVideoSource.CLIENT_CAMERA === '0' &&
|
|
|
+ '原因：先选择电脑摄像头主机位'
|
|
|
+ "
|
|
|
+ @change="monitorClientScreenChange"
|
|
|
+ >
|
|
|
+ <el-radio
|
|
|
+ v-for="(val, key) in monitorTypes"
|
|
|
+ :key="key"
|
|
|
+ :label="key"
|
|
|
+ >{{ val }}
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="手机监考主机位">
|
|
|
+ <el-radio-group
|
|
|
+ v-model="monitorVideoSource.MOBILE_FIRST"
|
|
|
+ @change="monitorMobileFirstChange"
|
|
|
+ >
|
|
|
+ <el-radio
|
|
|
+ v-for="(val, key) in monitorTypes"
|
|
|
+ :key="key"
|
|
|
+ :label="key"
|
|
|
+ >{{ val }}
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="手机监考辅机位">
|
|
|
+ <el-radio-group
|
|
|
+ v-model="monitorVideoSource.MOBILE_SECOND"
|
|
|
+ :disabled="monitorVideoSource.MOBILE_FIRST === '0'"
|
|
|
+ :title="
|
|
|
+ monitorVideoSource.MOBILE_FIRST === '0' &&
|
|
|
+ '原因：先选择手机监考主机位'
|
|
|
+ "
|
|
|
+ @change="monitorVideoSourceChange"
|
|
|
+ >
|
|
|
+ <el-radio
|
|
|
+ v-for="(val, key) in monitorTypes"
|
|
|
+ :key="key"
|
|
|
+ :label="key"
|
|
|
+ >{{ val }}
|
|
|
+ </el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ <p class="tips-info tips-error">
|
|
|
+ *主机位设备负责收音及播放监考提示
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ <div class="monitor-config-view">
|
|
|
+ <div class="monitor-item monitor-client-camera">
|
|
|
+ <div
|
|
|
+ :class="['monitor-item-img', monitorImgSrc('CLIENT_CAMERA')]"
|
|
|
+ />
|
|
|
+ <p class="monitor-item-desc">电脑摄像头主机位</p>
|
|
|
+ </div>
|
|
|
+ <div class="monitor-item monitor-client-screen">
|
|
|
+ <div
|
|
|
+ :class="['monitor-item-img', monitorImgSrc('CLIENT_SCREEN')]"
|
|
|
+ />
|
|
|
+ <p class="monitor-item-desc">电脑开启录屏</p>
|
|
|
+ </div>
|
|
|
+ <div class="monitor-item monitor-mobile-first">
|
|
|
+ <div
|
|
|
+ :class="['monitor-item-img', monitorImgSrc('MOBILE_FIRST')]"
|
|
|
+ />
|
|
|
+ <p class="monitor-item-desc">手机监考主机位</p>
|
|
|
+ </div>
|
|
|
+ <div class="monitor-item monitor-mobile-second">
|
|
|
+ <div
|
|
|
+ :class="['monitor-item-img', monitorImgSrc('MOBILE_SECOND')]"
|
|
|
+ />
|
|
|
+ <p class="monitor-item-desc">手机监考辅机位</p>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-if="monitorVideoSource.MOBILE_SECOND !== '0'"
|
|
|
+ class="monitor-line-mobile-second"
|
|
|
+ >
|
|
|
+ <span></span>
|
|
|
+ <span></span>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ v-if="monitorVideoSource.MOBILE_FIRST !== '0'"
|
|
|
+ class="monitor-line-mobile-first"
|
|
|
+ ></div>
|
|
|
+ <div
|
|
|
+ v-if="monitorVideoSource.CLIENT_CAMERA !== '0'"
|
|
|
+ class="monitor-line-client-camera"
|
|
|
+ ></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</el-form>
|
|
|
</el-tab-pane>
|
|
|
|
|
|
@@ -678,41 +645,13 @@ export default {
|
|
|
handler(v) {
|
|
|
if (!v) {
|
|
|
this.form.monitorVideoSource = [];
|
|
|
- this.form.monitorRecord = "OFF";
|
|
|
+ this.form.monitorRecord = [];
|
|
|
}
|
|
|
if (this.form.monitorVideoSource === null) {
|
|
|
this.form.monitorVideoSource = [];
|
|
|
}
|
|
|
},
|
|
|
},
|
|
|
- "form.monitorVideoSource": {
|
|
|
- immediate: true,
|
|
|
- handler(v, ov) {
|
|
|
- if (!v) {
|
|
|
- this.form.monitorVideoSource = [];
|
|
|
- }
|
|
|
- if (
|
|
|
- // 没动静，不修改，避免死循环
|
|
|
- (v || []).includes("MOBILE_FIRST") !==
|
|
|
- (ov || []).includes("MOBILE_FIRST") &&
|
|
|
- !this.form.monitorVideoSource.includes("MOBILE_FIRST")
|
|
|
- ) {
|
|
|
- this.form.monitorVideoSource = this.form.monitorVideoSource.filter(
|
|
|
- (v) => v !== "MOBILE_SECOND"
|
|
|
- );
|
|
|
- }
|
|
|
- if (
|
|
|
- // 没动静，不修改，避免死循环
|
|
|
- (v || []).includes("CLIENT_CAMERA") !==
|
|
|
- (ov || []).includes("CLIENT_CAMERA") &&
|
|
|
- !this.form.monitorVideoSource.includes("CLIENT_CAMERA")
|
|
|
- ) {
|
|
|
- this.form.monitorVideoSource = this.form.monitorVideoSource.filter(
|
|
|
- (v) => v !== "CLIENT_SCREEN"
|
|
|
- );
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
"form.cameraPhotoUpload": {
|
|
|
handler(v) {
|
|
|
if (v) {
|
|
|
@@ -742,9 +681,12 @@ export default {
|
|
|
this.form.inProcessLivenessFixedRange = [0, 0];
|
|
|
}
|
|
|
this.form.startEndTimeProxy = [this.form.startTime, this.form.endTime];
|
|
|
+ this.form.monitorRecord = this.form.monitorRecord || [];
|
|
|
+ this.form.monitorVideoSource = this.form.monitorVideoSource || [];
|
|
|
this.form.monitorProxy = !!this.form.monitorVideoSource;
|
|
|
this.form.preNoticeClone = this.form.preNotice;
|
|
|
this.form.postNoticeClone = this.form.postNotice;
|
|
|
+ this.parseMonitorVideoSource();
|
|
|
}
|
|
|
|
|
|
// sleep
|
|
|
@@ -794,7 +736,7 @@ export default {
|
|
|
inProcessLivenessFixedRange: [0, 0],
|
|
|
inProcessLivenessJudgePolicy: "ALL",
|
|
|
monitorProxy: false,
|
|
|
- monitorRecord: "OFF",
|
|
|
+ monitorRecord: [],
|
|
|
monitorVideoSource: [],
|
|
|
ipAllow: "",
|
|
|
},
|
|
|
@@ -878,7 +820,7 @@ export default {
|
|
|
breakExpireSeconds: {
|
|
|
validator: (rule, value) => {
|
|
|
return new Promise((resolve, reject) => {
|
|
|
- if (this.form.monitorRecord === "MIX" && value > 20 * 60) {
|
|
|
+ if (this.form.monitorRecord.length && value > 20 * 60) {
|
|
|
reject("视频回放开启后，断点失效时间必须小于20分钟");
|
|
|
} else {
|
|
|
resolve();
|
|
|
@@ -922,13 +864,30 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
+ sources: [
|
|
|
+ "MOBILE_FIRST",
|
|
|
+ "MOBILE_SECOND",
|
|
|
+ "CLIENT_CAMERA",
|
|
|
+ "CLIENT_SCREEN",
|
|
|
+ ],
|
|
|
+ monitorTypes: {
|
|
|
+ 0: "关闭",
|
|
|
+ 1: "直播",
|
|
|
+ 2: "直播+回放",
|
|
|
+ },
|
|
|
+ monitorVideoSource: {
|
|
|
+ CLIENT_CAMERA: "0",
|
|
|
+ CLIENT_SCREEN: "0",
|
|
|
+ MOBILE_FIRST: "0",
|
|
|
+ MOBILE_SECOND: "0",
|
|
|
+ },
|
|
|
orgSetting: null,
|
|
|
loading: false,
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
monitorImgSrc(monitorSource) {
|
|
|
- const selected = this.form.monitorVideoSource.includes(monitorSource);
|
|
|
+ const selected = this.monitorVideoSource[monitorSource] !== "0";
|
|
|
const selectedStr = selected ? "-selected" : "";
|
|
|
if (monitorSource === "MOBILE_FIRST") {
|
|
|
return `mobile-first-img${selectedStr}`;
|
|
|
@@ -945,6 +904,54 @@ export default {
|
|
|
|
|
|
return "";
|
|
|
},
|
|
|
+ monitorClientCameraChange(val) {
|
|
|
+ if (val === "0") {
|
|
|
+ this.monitorVideoSource.CLIENT_SCREEN = "0";
|
|
|
+ }
|
|
|
+ if (val === "2" && this.monitorVideoSource.CLIENT_SCREEN === "2") {
|
|
|
+ this.monitorVideoSource.CLIENT_SCREEN = "1";
|
|
|
+ }
|
|
|
+
|
|
|
+ this.monitorVideoSourceChange();
|
|
|
+ },
|
|
|
+ monitorClientScreenChange(val) {
|
|
|
+ if (val === "2" && this.monitorVideoSource.CLIENT_CAMERA === "2") {
|
|
|
+ this.monitorVideoSource.CLIENT_CAMERA = "1";
|
|
|
+ }
|
|
|
+
|
|
|
+ this.monitorVideoSourceChange();
|
|
|
+ },
|
|
|
+ monitorMobileFirstChange(val) {
|
|
|
+ if (val === "0") this.monitorVideoSource.MOBILE_SECOND = "0";
|
|
|
+ this.monitorVideoSourceChange();
|
|
|
+ },
|
|
|
+ monitorVideoSourceChange() {
|
|
|
+ let monitorVideoSource = [],
|
|
|
+ monitorRecord = [];
|
|
|
+ this.sources.forEach((source) => {
|
|
|
+ if (this.monitorVideoSource[source] === "0") return;
|
|
|
+ if (this.monitorVideoSource[source] === "2") {
|
|
|
+ monitorRecord.push(source);
|
|
|
+ }
|
|
|
+ monitorVideoSource.push(source);
|
|
|
+ });
|
|
|
+
|
|
|
+ this.form.monitorVideoSource = monitorVideoSource;
|
|
|
+ this.form.monitorRecord = monitorRecord;
|
|
|
+ },
|
|
|
+ parseMonitorVideoSource() {
|
|
|
+ this.sources.forEach((source) => {
|
|
|
+ const hasRecord = this.form.monitorRecord.includes(source);
|
|
|
+ const hasSource = this.form.monitorVideoSource.includes(source);
|
|
|
+ if (hasRecord) {
|
|
|
+ this.monitorVideoSource[source] = "2";
|
|
|
+ } else if (hasSource) {
|
|
|
+ this.monitorVideoSource[source] = "1";
|
|
|
+ } else {
|
|
|
+ this.monitorVideoSource[source] = "0";
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
async save() {
|
|
|
try {
|
|
|
await this.$refs.form1.validate();
|
|
|
@@ -1018,6 +1025,79 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+.monitor-config {
|
|
|
+ &-options {
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: top;
|
|
|
+ width: 470px;
|
|
|
+
|
|
|
+ .el-form-item {
|
|
|
+ margin-bottom: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &-view {
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: top;
|
|
|
+ width: 498px;
|
|
|
+ height: 257px;
|
|
|
+ background: #f0f4f9;
|
|
|
+ border-radius: 6px;
|
|
|
+ border: 1px solid #e8edf3;
|
|
|
+ }
|
|
|
+}
|
|
|
+.monitor-title {
|
|
|
+ height: 20px;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #202b4b;
|
|
|
+ line-height: 20px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ padding-left: 20px;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: "";
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: middle;
|
|
|
+ width: 4px;
|
|
|
+ height: 10px;
|
|
|
+ background: #1886fe;
|
|
|
+ border-radius: 2px;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+.monitor-item {
|
|
|
+ position: absolute;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ &-img {
|
|
|
+ margin: 0 auto;
|
|
|
+ }
|
|
|
+ &-desc {
|
|
|
+ font-size: 12px;
|
|
|
+ line-height: 1;
|
|
|
+ margin: 5px 0 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+.monitor-client-camera {
|
|
|
+ left: 171px;
|
|
|
+ top: 21px;
|
|
|
+}
|
|
|
+.monitor-client-screen {
|
|
|
+ left: 124px;
|
|
|
+ bottom: 20px;
|
|
|
+}
|
|
|
+.monitor-mobile-first {
|
|
|
+ left: 20px;
|
|
|
+ top: 20px;
|
|
|
+}
|
|
|
+.monitor-mobile-second {
|
|
|
+ bottom: 20px;
|
|
|
+ right: 20px;
|
|
|
+}
|
|
|
+
|
|
|
.mobile-first-img {
|
|
|
background-image: url(./imgs/手机监考主机位.png);
|
|
|
background-repeat: no-repeat;
|
|
|
@@ -1065,18 +1145,87 @@ export default {
|
|
|
background-image: url(./imgs/电脑操作录屏-选中.png);
|
|
|
}
|
|
|
}
|
|
|
+.monitor-line-point {
|
|
|
+ content: "";
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ width: 5px;
|
|
|
+ height: 5px;
|
|
|
+ border: 1px solid #c1cbdb;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: #f0f4f9;
|
|
|
+}
|
|
|
+.monitor-line-client-camera {
|
|
|
+ position: absolute;
|
|
|
+ width: 0;
|
|
|
+ height: 23px;
|
|
|
+ border-left: 1px solid #c1cbdb;
|
|
|
+ top: 89px;
|
|
|
+ left: 219px;
|
|
|
|
|
|
-.enhance-left-bottom-line {
|
|
|
- border-left-style: solid !important;
|
|
|
- border-bottom-style: solid !important;
|
|
|
+ &::before {
|
|
|
+ @extend .monitor-line-point;
|
|
|
+ left: -3px;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+ &::after {
|
|
|
+ @extend .monitor-line-point;
|
|
|
+ left: -3px;
|
|
|
+ bottom: 0;
|
|
|
+ }
|
|
|
}
|
|
|
+.monitor-line-mobile-first {
|
|
|
+ position: absolute;
|
|
|
+ width: 56px;
|
|
|
+ height: 28px;
|
|
|
+ bottom: 96px;
|
|
|
+ left: 63px;
|
|
|
+ border-left: 1px solid #c1cbdb;
|
|
|
+ border-bottom: 1px solid #c1cbdb;
|
|
|
|
|
|
-.enhance-right-bottom-line {
|
|
|
- border-right-style: solid !important;
|
|
|
- border-top-style: solid !important;
|
|
|
+ &::before {
|
|
|
+ @extend .monitor-line-point;
|
|
|
+ left: -3px;
|
|
|
+ top: 0;
|
|
|
+ }
|
|
|
+ &::after {
|
|
|
+ @extend .monitor-line-point;
|
|
|
+ right: 0;
|
|
|
+ bottom: -3px;
|
|
|
+ }
|
|
|
}
|
|
|
+.monitor-line-mobile-second {
|
|
|
+ span:nth-of-type(1) {
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ width: 35px;
|
|
|
+ height: 63px;
|
|
|
+ bottom: 92px;
|
|
|
+ right: 139px;
|
|
|
+ border-right: 1px solid #c1cbdb;
|
|
|
+ border-bottom: 1px solid #c1cbdb;
|
|
|
|
|
|
-.enhance-right-line {
|
|
|
- border-right-style: solid !important;
|
|
|
+ &::before {
|
|
|
+ @extend .monitor-line-point;
|
|
|
+ left: 0;
|
|
|
+ bottom: -3px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ span:nth-of-type(2) {
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ width: 78px;
|
|
|
+ height: 23px;
|
|
|
+ top: 100px;
|
|
|
+ right: 61px;
|
|
|
+ border-right: 1px solid #c1cbdb;
|
|
|
+ border-top: 1px solid #c1cbdb;
|
|
|
+
|
|
|
+ &::after {
|
|
|
+ @extend .monitor-line-point;
|
|
|
+ right: -3px;
|
|
|
+ bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
zhangjie
