From c801ee62184d13acc4c5d6bd2d9586dca13306fc Mon Sep 17 00:00:00 2001 From: 648540858 <648540858@qq.com> Date: 星期二, 14 六月 2022 23:16:58 +0800 Subject: [PATCH] 调整页面样式 --- web_src/src/components/channelList.vue | 71 ++++++++++++++++------------------- 1 files changed, 32 insertions(+), 39 deletions(-) diff --git a/web_src/src/components/channelList.vue b/web_src/src/components/channelList.vue index 60f3112..f0888c1 100644 --- a/web_src/src/components/channelList.vue +++ b/web_src/src/components/channelList.vue @@ -32,49 +32,42 @@ </div> <devicePlayer ref="devicePlayer" v-loading="isLoging"></devicePlayer> <!--璁惧鍒楄〃--> - <el-table ref="channelListTable" :data="deviceChannelList" :height="winHeight" border style="width: 100%"> + <el-table ref="channelListTable" :data="deviceChannelList" :height="winHeight" style="width: 100%" header-row-class-name="table-header"> <el-table-column prop="channelId" label="閫氶亾缂栧彿" width="200"> </el-table-column> - <el-table-column prop="name" label="閫氶亾鍚嶇О"> + <el-table-column prop="name" label="閫氶亾鍚嶇О" > </el-table-column> - <el-table-column label="蹇収" width="80" align="center"> + <el-table-column label="蹇収" width="80"> <template slot-scope="scope"> -<!-- <img style="max-height: 3rem;max-width: 4rem;"--> -<!-- v-if="scope.row.subCount === 0 && scope.row.parental === 0"--> -<!-- :deviceId="scope.row.deviceId"--> -<!-- :channelId="scope.row.channelId"--> -<!-- :src="getSnap(scope.row)"--> -<!-- @error="getSnapErrorEvent($event.target.deviceId, $event.target.channelId)"--> -<!-- alt="">--> - <el-image - :src="getSnap(scope.row)" - :preview-src-list="getBigSnap(scope.row)" - @error="getSnapErrorEvent(scope.row.deviceId, cope.row.channelId)" - :fit="'contain'"> - <div slot="error" class="image-slot"> - <i class="el-icon-picture-outline"></i> - </div> - </el-image> + <el-image + :src="getSnap(scope.row)" + :preview-src-list="getBigSnap(scope.row)" + @error="getSnapErrorEvent(scope.row.deviceId, cope.row.channelId)" + :fit="'contain'"> + <div slot="error" class="image-slot"> + <i class="el-icon-picture-outline"></i> + </div> + </el-image> </template> </el-table-column> - <el-table-column prop="subCount" label="瀛愯妭鐐规暟"> + <el-table-column prop="subCount" label="瀛愯妭鐐规暟" width="120"> </el-table-column> - <el-table-column prop="manufacture" label="鍘傚"> + <el-table-column prop="manufacture" label="鍘傚" width="120"> </el-table-column> - <el-table-column label="浣嶇疆淇℃伅" align="center"> + <el-table-column label="浣嶇疆淇℃伅" width="180"> <template slot-scope="scope"> <span v-if="scope.row.longitude*scope.row.latitude > 0">{{ scope.row.longitude }},<br>{{ scope.row.latitude }}</span> <span v-if="scope.row.longitude*scope.row.latitude === 0">鏃�</span> </template> </el-table-column> - <el-table-column prop="ptztypeText" label="浜戝彴绫诲瀷"/> - <el-table-column label="寮�鍚煶棰�" align="center"> + <el-table-column prop="ptztypeText" label="浜戝彴绫诲瀷" width="120" /> + <el-table-column label="寮�鍚煶棰�" > <template slot-scope="scope"> <el-switch @change="updateChannel(scope.row)" v-model="scope.row.hasAudio" active-color="#409EFF"> </el-switch> </template> </el-table-column> - <el-table-column label="鐘舵��" width="180" align="center"> + <el-table-column label="鐘舵��" width="240" > <template slot-scope="scope"> <div slot="reference" class="name-wrapper"> <el-tag size="medium" v-if="scope.row.status == 1">寮�鍚�</el-tag> @@ -84,21 +77,21 @@ </el-table-column> - <el-table-column label="鎿嶄綔" width="280" align="center" fixed="right"> + <el-table-column label="鎿嶄綔" width="280" fixed="right"> <template slot-scope="scope"> - <el-button-group> - <!-- <el-button size="mini" icon="el-icon-video-play" v-if="scope.row.parental == 0" @click="sendDevicePush(scope.row)">鎾斁</el-button> --> - <el-button size="mini" icon="el-icon-video-play" @click="sendDevicePush(scope.row)">鎾斁</el-button> - <el-button size="mini" icon="el-icon-switch-button" type="danger" v-if="!!scope.row.streamId" - @click="stopDevicePush(scope.row)">鍋滄 - </el-button> - <el-button size="mini" icon="el-icon-s-open" type="primary" v-if="scope.row.subCount > 0 || scope.row.parental === 1" - @click="changeSubchannel(scope.row)">鏌ョ湅 - </el-button> - <el-button size="mini" icon="el-icon-video-camera" type="primary" @click="queryRecords(scope.row)">璁惧褰曞儚 - </el-button> - <!-- <el-button size="mini" @click="sendDevicePush(scope.row)">褰曞儚鏌ヨ</el-button> --> - </el-button-group> + <!-- <el-button size="mini" icon="el-icon-video-play" v-if="scope.row.parental == 0" @click="sendDevicePush(scope.row)">鎾斁</el-button> --> + <el-button size="mini" icon="el-icon-video-play" type="text" @click="sendDevicePush(scope.row)">鎾斁</el-button> + <el-button size="mini" icon="el-icon-switch-button" type="text" style="color: #f56c6c" v-if="!!scope.row.streamId" + @click="stopDevicePush(scope.row)">鍋滄 + </el-button> + <el-divider direction="vertical"></el-divider> + <el-button size="mini" icon="el-icon-s-open" type="text" v-if="scope.row.subCount > 0 || scope.row.parental === 1" + @click="changeSubchannel(scope.row)">鏌ョ湅 + </el-button> + <el-divider v-if="scope.row.subCount > 0 || scope.row.parental === 1" direction="vertical"></el-divider> + <el-button size="mini" icon="el-icon-video-camera" type="text" @click="queryRecords(scope.row)">璁惧褰曞儚 + </el-button> + <!-- <el-button size="mini" @click="sendDevicePush(scope.row)">褰曞儚鏌ヨ</el-button> --> </template> </el-table-column> </el-table> -- Gitblit v1.8.0