激活样式提交

whyczyk

2021-08-25 c49f0622e479bac58cd13da527423d7c9174d1b8

激活样式提交

 src/assets/js/api.js

@@ -1,5 +1,17 @@
import axios from "./axios";

/* 激活大屏 
{appId:1}
*/
export const screenActiveConfig = (data) => {
  return axios({
    method: "PUT",
    url: "/application/active",
    data: data
  })
}


/* 查询当前大屏布局数据 
{appId:1}
*/

 src/pages/exhibition.vue

@@ -1,6 +1,6 @@
<template>
  <div class="screenWarp" :style="'background-image:url('+screenBg+')'" ref="cover">
    <screen-title :title="nowlayOut.appName" :bgImg="screenTitleBg"></screen-title>
    <screen-title :title="nowlayOut.appName" :bgImg="screenTitleBg" v-if="isHeader"></screen-title>
    <div class="pageWarp" ref="pageWarp">
      <vue-draggable-resizable :w="item.w" :h="item.h" :x="item.x" :y="item.y" :parent="true" :debug="false"
        :snap="true" :snapTolerance="5" :draggable="false" :resizable="false"
@@ -42,10 +42,14 @@
        modularData: charts.modularData,
        screenTitleBg: null,
        screenBg: null,
        isHeader: true
      }
    },
    mounted() {
      this.nowlayOut.appName = this.$route.query.name;
      if (this.$route.query.head && this.$route.query.head == 1) {
        this.isHeader = false
      }
      this.$nextTick(() => {
        clientWidth = this.$refs.pageWarp.clientWidth;
        clientHeight = this.$refs.pageWarp.clientHeight;
@@ -118,11 +122,15 @@
    height: 100%;
    background-color: #031D67;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .pageWarp {
    width: 100%;
    height: calc(100% - 52px);
    flex: 1;
  }

  .contextmenu {

 src/pages/index.vue

@@ -49,7 +49,11 @@
              <el-tooltip class="item" effect="dark" content="编辑" placement="top">
                <i class="preview el-icon-edit editview" @click="skip(2,item)"></i>
              </el-tooltip>
              <el-tooltip class="item" effect="dark" content="激活" placement="top" v-if="item.activeStatus!=1">
                <i class="preview el-icon-bangzhu activation" @click="toActivation(item)"></i>
              </el-tooltip>
            </div>
            <div class="activationText">{{item.activeStatus==1?'已激活':'未激活'}}</div>
          </div>
          <input type="text" class="template-info input-text" :ref="item.ref" v-model="item.name"
            @focus="alterName(item)" @blur="overEvent(item)">
@@ -72,6 +76,9 @@

<script>
  import streamerNav from '../components/streamerNav.vue'
  import {
    screenActiveConfig
  } from '@/assets/js/api'
  export default {
    components: {
      streamerNav,
@@ -263,7 +270,24 @@
          default:
            break;
        }
      },
      toActivation(item) {
        let postData = {
          id: item.id,
          userId: this.opt.userId
      }
        screenActiveConfig(postData).then((res) => {
          if (res.data.code == 1) {
            this.$message({
              type: 'success',
              message: '激活成功!'
            });
            this.getData();
          }
        }).catch((err) => {
          console.log(err)
        });
      },
    },
    destroyed() {
      window.removeEventListener("scroll", this.setHeadPosition, true);
@@ -421,6 +445,12 @@
    background: #021651;
  }

  .template-list .template-image .activationText {
    font-size: 20px;
    font-weight: bold;
    letter-spacing: 2px;
  }

  .template-list .imageFirst {
    height: 100%;
  }
@@ -498,6 +528,10 @@
    color: #2681ff;
  }

  .template-item .screen-edit .activation {
    right: 150px;
  }

  .template-item .screen-edit .editview {
    right: 105px;
  }