广告加查看详情

src/views/netEwm/poster/index.vue

@@ -142,6 +142,14 @@
             v-hasPermi="['netEwm:poster:edit']"
             >修改</el-button
           >
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-view"
+            @click="handleUpdate(scope.row, 'info')"
+            v-hasPermi="['netEwm:poster:list']"
+            >查看</el-button
+          >
           <el-button
             size="mini"
             type="text"
@@ -198,6 +206,35 @@
       </div>
     </el-dialog>
     <my-table ref="MyTable"></my-table>
+    <!-- 详情弹出层 -->
+    <el-dialog
+      title="详情"
+      :visible.sync="openInfo"
+      width="800px"
+      append-to-body
+    >
+      <el-descriptions border :column="2">
+        <el-descriptions-item label="广告名称">{{
+          form.posterName
+        }}</el-descriptions-item>
+        <el-descriptions-item label="有效起始时间">{{
+          form.startTime
+        }}</el-descriptions-item>
+        <el-descriptions-item label="有效结束时间">{{
+          form.endTime
+        }}</el-descriptions-item>
+      </el-descriptions>
+      <div class="my-info">
+        <div class="cell-info">广告视频</div>
+        <div class="info-container">
+          <video
+            :src="baseUrl + form.videoPath"
+            class="avatar"
+            controls="controls"
+          ></video>
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -217,6 +254,8 @@ export default {
   name: "Poster",
   data() {
     return {
+      baseUrl: process.env.VUE_APP_BASE_API,
+      openInfo: false,
       // 遮罩层
       loading: true,
       // 选中数组
@@ -330,13 +369,17 @@ export default {
       this.title = "添加广告";
     },
     /** 修改按钮操作 */
-    handleUpdate(row) {
+    handleUpdate(row, type) {
       this.reset();
       const id = row.id || this.ids;
       getPoster(id).then((response) => {
         this.form = response.data;
+        if (type == "info") {
+          this.openInfo = true;
+        } else {
           this.open = true;
           this.title = "修改广告";
+        }
       });
     },
     /** 提交按钮 */