feat:适配调整

张含笑

2025-05-30 ed58b6c48482f67d8c13ad7d6ae2a7e355ae056b

feat:适配调整

 src/components/basic-container/main.vue

@@ -37,7 +37,7 @@
.basic-container {
  padding: 0 10px;
  box-sizing: border-box;
  height: 100%;
  // height: 100%;

  .basic-container__card{
    height: 100% !important;

 src/components/flow-design/main.vue

@@ -9,13 +9,13 @@
      width="70%"
      class="flow-design-dialog"
    >
      <nf-design-base ref="bpmn" style="height: 60vh" :options="option"></nf-design-base>
      <nf-design-base ref="bpmn" class="bpmn"  :options="option"></nf-design-base>
    </el-dialog>
    <div v-else>
      <nf-design-base
        v-if="visible"
        ref="bpmn"
        style="height: 60vh"
       class="bpmn"
        :options="option"
      ></nf-design-base>
    </div>
@@ -107,6 +107,9 @@

<style lang="scss">
.flow-design-dialog {
.bpmn {
height: 60vh
}
  display: flex;
  flex-direction: column;
  margin: 0 !important;

 src/mac/index.vue

@@ -46,7 +46,7 @@
          <div class="item" @click="openApp(item)">
            <i :style="{ backgroundColor: item.iconBgColor, color: item.iconColor }" class="iconfont"
              :class="item[iconKey]"></i>
            <small style="margin-top: 5px; font-size: 10px">{{ item[labelKey] }}</small>
            <small class="smallkey" >{{ item[labelKey] }}</small>
          </div>
        </template>
      </div>
@@ -149,8 +149,11 @@
  height: 100% !important;
}
</style>
<style scoped>
<style scoped lang="scss">
.desktop {
.smallkey {
margin-top: 5px; font-size: 10px
}
  display: flex;
  flex-direction: column;
  position: absolute;

 src/mac/lock.vue

@@ -9,7 +9,7 @@
    </div>
    <div class="message">{{ userInfo.username }}</div>
    <div class="form">
      <div class="item" style="width: 320px" :class="passwdError ? 'error' : ''">
      <div class="item" :class="passwdError ? 'error' : ''">
        <input class="password" placeholder="password here..." v-model="passwd" type="password" />
        <i class="iconfont el-icon-unlock" @click="handleLogin"></i>
        <i class="iconfont icon-tuichu" @click="handleLogout"></i>
@@ -59,4 +59,7 @@
</script>
<style scoped>
@import url('./login.css');
.item {
width: 320px
}
</style>

 src/page/index/index.vue

@@ -114,14 +114,16 @@
</script>

<style lang="scss" scoped>
#avue-view{
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
}
:deep(.basic-container){
height: none !important;}
// #avue-view{
//   :deep(){
//     .avue-crud__body{
//       .el-form{
//         height: 745px;
//         overflow: auto;
//       }
//     }
//   }
// }
</style>

 src/page/index/logo.vue

@@ -7,7 +7,7 @@
    </transition>
    <transition-group name="fade">
      <template v-if="getScreen(!isCollapse)">
        <div style="display: flex; align-items: left; gap: 5px; margin: 8px 8px 10px 20px;">
        <div class="fadeStyle">
    <img class="img" src="/img/bg/mainLogo.png" alt="" width="50%" height="50%" />
    <!-- <span style="font-size: 20px;"  key="1">
        {{ this.parentDeptInfo.sysName }}
@@ -37,3 +37,8 @@
  methods: {},
};
</script>
<style scoped lang="scss">
.fadeStyle {
display: flex; align-items: left; gap: 5px; margin: 8px 8px 10px 20px;
}
</style>

 src/page/index/top/top-menu.vue

@@ -2,7 +2,7 @@
  <el-menu class="top-menu" :default-active="activeIndex" mode="horizontal" text-color="#333">
    <el-menu-item index="0" @click="openHome(itemHome)">
      <template #title>
        <i :class="itemHome.source" style="padding-right: 5px"></i>
        <i :class="itemHome.source" class="itemTitle" ></i>
        <span>{{ itemHome.name }}</span>
      </template>
    </el-menu-item>
@@ -10,7 +10,7 @@
    <template v-for="(item, index) in items" :key="index">
      <el-menu-item :index="item.id + ''" @click="openMenu(item)">
        <template #title>
          <i :class="item.source" style="padding-right: 5px"></i>
          <i :class="item.source" class="itemTitle"></i>
          <span>{{ item.name }}</span>
        </template>
      </el-menu-item>
@@ -56,3 +56,8 @@
  },
}
</script>
<style scoped>
.itemTitle {
padding-right: 5px
}
</style>

 src/views/authority/apiscope.vue

@@ -669,8 +669,17 @@
  },
};
</script>
<style scoped>

<style scoped lang="scss">
.namei {
  margin-right: 5px;
}
</style>
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/authority/datascope.vue

@@ -762,8 +762,17 @@
  },
};
</script>
<style scoped>

<style scoped lang="scss">
.namei {
  margin-right: 5px;
}
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/authority/role.vue

@@ -402,3 +402,13 @@
  },
};
</script>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/device/addDevice.vue

@@ -422,6 +422,14 @@
</script>
  
<style lang="scss" scoped>
 :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
.firmware_status {
    background-color: aqua;
    border-radius: 4px;

 src/views/device/airport.vue

@@ -35,44 +35,24 @@
        <el-tag>{{ row.dept_name }}</el-tag>
      </template>
      <template #status="{ row }">
        <div
          v-if="row.status == true"
          class="onlineStatus"
         
        >
          <div
          class="onlineStatus-dot"
            
          ></div>
          <span style="margin-left: 5px">在线</span>
        <div v-if="row.status == true" class="onlineStatus">
          <div class="onlineStatus-dot"></div>
          <span class="online">在线</span>
        </div>
        <div
          v-if="row.status == false"
          class="onlineStatus"
        >
          <div
            class="onlineStatus-dot1"
            
          ></div>
          <span style="margin-left: 5px">离线</span>
        <div v-if="row.status == false" class="onlineStatus">
          <div class="onlineStatus-dot1"></div>
          <span class="online">离线</span>
        </div>
      </template>
      <template #firmware_status="{ row }">
        <div
          v-if="row.firmware_status == 1"
          class="onlineStatus1"
         
        >
        <div v-if="row.firmware_status == 1" class="onlineStatus1">
          <el-tag type="info">无需升级</el-tag>
          <el-tag type="primary" effect="dark" class="active-element" @click="rollFirmware(row)"
            >版本管理</el-tag
          >
          <!-- <div style="background-color: #f1f1f1; border-radius: 4px">无需升级</div> -->
        </div>
        <div
          v-if="row.firmware_status == 2"
          class="onlineStatus1"
        >
        <div v-if="row.firmware_status == 2" class="onlineStatus1">
          <!-- <el-tag type="success" effect="dark" class="active-element" @click="updateFirmware(row)"
            >升级固件</el-tag
          > -->
@@ -81,19 +61,13 @@
          >
          <!-- <div @click="updateFirmware(row)" class="firmware_status">升级固件</div> -->
        </div>
        <div
          v-if="row.firmware_status == 3"
          class="onlineStatus "
        >
        <div v-if="row.firmware_status == 3" class="onlineStatus">
          <el-tag type="success" effect="dark" class="active-element" @click="updateFirmware(row)"
            >一致性升级</el-tag
          >
          <!-- <div @click="updateFirmware(row)" class="firmware_status">一致性升级</div> -->
        </div>
        <div
          v-if="row.firmware_status == 4"
          class="onlineStatus "
        >
        <div v-if="row.firmware_status == 4" class="onlineStatus">
          <el-tag effect="dark" class="active-element" @click="updateFirmware(row)">升级中</el-tag>
          <el-progress
            v-if="row.firmware_progress > 0 && row.firmware_progress < 100"
@@ -171,12 +145,8 @@
            :value="item.id"
          >
            <span style="float: left">{{ item.name + ': ' + item.endpoint }}</span>
            <span v-if="item.status == 1" style="float: right; color: #8492a6; font-size: 13px">{{
              item.categoryName
            }}</span>
            <span v-if="item.status == 2" style="float: right; color: #40cb8b; font-size: 13px">{{
              item.categoryName
            }}</span>
            <span v-if="item.status == 1" class="status1">{{ item.categoryName }}</span>
            <span v-if="item.status == 2" class="status2">{{ item.categoryName }}</span>
          </el-option>
        </el-select>
      </div>
@@ -707,9 +677,9 @@
      this.ossEnd = row.oss_id;
      // 查询下拉列表
      const param = {
        categoryKeys: "1,3,6"
      }
      getOssList(1, 50,param).then(res => {
        categoryKeys: '1,3,6',
      };
      getOssList(1, 50, param).then(res => {
        const data = res.data.data;
        that.ossList = data.records;
      });
@@ -1154,17 +1124,40 @@
</script>

<style lang="scss" scoped>
.status2 {
  float: right;
  color: #40cb8b;
  font-size: 13px;
}
.status1 {
  float: right;
  color: #8492a6;
  font-size: 13px;
}
.online {
  margin-left: 5px;
}
.onlineStatus1 {
display: flex; flex-direction: column; align-items: center
  display: flex;
  flex-direction: column;
  align-items: center;
}
.onlineStatus {
display: flex; flex-direction: row; align-items: center
  display: flex;
  flex-direction: row;
  align-items: center;
}
.onlineStatus-dot {
width: 15px; height: 15px; background-color: #40cb8b; border-radius: 50%
  width: 15px;
  height: 15px;
  background-color: #40cb8b;
  border-radius: 50%;
}
.onlineStatus-dot1 {
width: 15px; height: 15px; background-color: #de5e5e; border-radius: 50%
  width: 15px;
  height: 15px;
  background-color: #de5e5e;
  border-radius: 50%;
}
.firmware_status {
  background-color: aqua;

 src/views/device/components/firmwareManage.vue

@@ -429,3 +429,13 @@
  /* color: aqua; */
}
</style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/device/devicePerMenu.vue

@@ -311,3 +311,14 @@
  /* color: aqua; */
}
</style>
<style scoped lang="scss">

  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/device/fly.vue

@@ -1,6 +1,7 @@
<template>
  <basic-container>
    <avue-crud
      id="device"
      :option="option"
      :table-loading="loading"
      :data="data"
@@ -34,24 +35,13 @@
        <el-tag>{{ row.dept_name }}</el-tag>
      </template>
      <template #status="{ row }">
        <div
          v-if="row.status == true"
          class="onlineStatus"
         
        >
          <div
            class="onlineStatus-dot"
          ></div>
          <span style="margin-left: 5px">在线</span>
        <div v-if="row.status == true" class="onlineStatus">
          <div class="onlineStatus-dot"></div>
          <span class="online" >在线</span>
        </div>
        <div
          v-if="row.status == false"
           class="onlineStatus"
        >
          <div
           class="onlineStatus-dot1"
          ></div>
          <span style="margin-left: 5px">离线</span>
        <div v-if="row.status == false" class="onlineStatus">
          <div class="onlineStatus-dot1"></div>
          <span class="online">离线</span>
        </div>
      </template>
      <template #menu="scope">
@@ -74,12 +64,28 @@
      </template>
    </avue-crud>
    <el-dialog title="操控密码设置" append-to-body v-model="operatePasswordSetBox" width="455px">
      <el-form :model="passwordForm" ref="passwordForm" label-width="80px" :rules="rules" v-loading="loadingForm">
      <el-form
        :model="passwordForm"
        ref="passwordForm"
        label-width="80px"
        :rules="rules"
        v-loading="loadingForm"
      >
        <el-form-item label="密码" prop="password">
          <el-input type="password" v-model="passwordForm.password" placeholder="请输入密码" show-password></el-input>
          <el-input
            type="password"
            v-model="passwordForm.password"
            placeholder="请输入密码"
            show-password
          ></el-input>
        </el-form-item>
        <el-form-item label="确认密码" prop="password2">
          <el-input type="password" v-model="passwordForm.password2" placeholder="请输入确认密码" show-password></el-input>
          <el-input
            type="password"
            v-model="passwordForm.password2"
            placeholder="请输入确认密码"
            show-password
          ></el-input>
        </el-form-item>
      </el-form>
      <template #footer>
@@ -96,7 +102,15 @@
</template>

<script>
import { getList, remove, update, add, getDetail,getOperatePassword,operatePasswordUpdate } from '@/api/device/device';
import {
  getList,
  remove,
  update,
  add,
  getDetail,
  getOperatePassword,
  operatePasswordUpdate,
} from '@/api/device/device';
import { mapGetters } from 'vuex';

export default {
@@ -118,15 +132,15 @@
      }
    };
    return {
      loadingForm:false,
      loadingForm: false,
      rules: {
        password: [{ required: true, validator: validatePass, trigger: 'blur' }],
        password2: [{ required: true, validator: validatePass2, trigger: 'blur' }],
      },
      passwordForm:{
        id:'',
        password:'',
        password2:'',
      passwordForm: {
        id: '',
        password: '',
        password2: '',
      },
      operatePasswordSetBox: false,
      operatePasswordViewBox: false,
@@ -141,9 +155,9 @@
      },
      selectionList: [],
      option: {
        height: '460',
        calcHeight: 32,
        dialogWidth: 950,
        // height: '460',
        // calcHeight: 32,
        // dialogWidth: 950,
        tip: false,
        searchShow: true,
        searchMenuSpan: 6,
@@ -345,14 +359,14 @@
        if (valid) {
          this.loadingForm = true;
          const data = {
            id:this.passwordForm.id,
            operate_password: this.passwordForm.password
          }
            id: this.passwordForm.id,
            operate_password: this.passwordForm.password,
          };
          // 提交
          operatePasswordUpdate(data).then(res => {
            this.loadingForm = false;
            this.operatePasswordSetBox = false;
            that.passwordForm = {}
            that.passwordForm = {};
            this.onLoad(this.page);
            this.$message({
              type: 'success',
@@ -368,22 +382,22 @@
    // 操作密码设置
    handleOperatePassword(row) {
      this.operatePasswordSetBox = true;
      this.passwordForm.id = row.id
      this.passwordForm.id = row.id;
    },
    viewOperatePassword(row){
    viewOperatePassword(row) {
      this.operatePasswordViewBox = true;
      // 查询密码
      getOperatePassword(row.id).then(res=>{
         this.operate_password = res.data.data;
      })
      getOperatePassword(row.id).then(res => {
        this.operate_password = res.data.data;
      });
    },
    init() {
      this.page= {
      (this.page = {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      this.onLoad(this.page);
      }),
        this.onLoad(this.page);
    },
    rowSave(row, done, loading) {
      add(row).then(
@@ -526,16 +540,33 @@
</script>

<style lang="scss" scoped>
:deep(#device .el-card__body .avue-crud__body .el-form) {
  height: 655px !important;
  overflow: auto;
}
.online {
  margin-left: 5px;
}
.onlineStatus1 {
display: flex; flex-direction: column; align-items: center
  display: flex;
  flex-direction: column;
  align-items: center;
}
.onlineStatus {
display: flex; flex-direction: row; align-items: center
  display: flex;
  flex-direction: row;
  align-items: center;
}
.onlineStatus-dot {
width: 15px; height: 15px; background-color: #40cb8b; border-radius: 50%
  width: 15px;
  height: 15px;
  background-color: #40cb8b;
  border-radius: 50%;
}
.onlineStatus-dot1 {
width: 15px; height: 15px; background-color: #de5e5e; border-radius: 50%
  width: 15px;
  height: 15px;
  background-color: #de5e5e;
  border-radius: 50%;
}
</style>

 src/views/job/jobinfo.vue

@@ -292,4 +292,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/job/jobserver.vue

@@ -233,4 +233,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/monitor/log/api.vue

@@ -210,4 +210,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/monitor/log/error.vue

@@ -176,4 +176,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/odm/task.vue

@@ -471,4 +471,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/resource/attach.vue

@@ -343,4 +343,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/resource/media.vue

@@ -346,4 +346,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/resource/oss.vue

@@ -503,3 +503,13 @@
  },
};
</script>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/resource/wayline.vue

@@ -305,4 +305,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/resource/waylineFile.vue

@@ -227,8 +227,16 @@
};
</script>

<style scoped>
<style scoped lang="scss">
.avue-crud .el-table {
  max-height: none !important;
}
 :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/system/client.vue

@@ -380,4 +380,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/system/dict.vue

@@ -448,3 +448,13 @@
  },
};
</script>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/system/menu.vue

@@ -480,8 +480,17 @@
};
</script>

<style scoped>

<style scoped lang="scss">
.namei {
  margin-right: 5px;
}
</style>
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/system/param.vue

@@ -369,8 +369,11 @@
  },
};
</script>
<style scoped>

<style scoped lang="scss">
.rowStyle {
padding: 6px 18px
}

 
</style>

 src/views/system/sysConfig.vue

@@ -302,4 +302,13 @@
};
</script>

<style></style>
<style scoped lang="scss">
  :deep(){
    .avue-crud__body{
      .el-form{
        height: 745px;
        overflow: auto;
      }
    }
  }
</style>

 src/views/tickets/orderLog.vue

@@ -1381,6 +1381,14 @@
</script>

<style lang="scss" scoped>
 :deep(){
    .avue-crud__body{
      .el-form{
        height: 625px;
        overflow: auto;
      }
    }
  }
:deep(.el-pagination .el-select ){
width: 128px !important;
}

 src/views/tickets/ticket.vue

@@ -2829,6 +2829,14 @@
</script>

<style lang="scss" scoped>
 :deep(){
    .avue-crud__body{
      .el-form{
        height: 655px;
        overflow: auto;
      }
    }
  }
.uploadImg {
  margin-bottom: 32px
}

 src/views/util/affix.vue

@@ -15,8 +15,8 @@
    <avue-affix id="avue-view" :offset-top="150">
      <span class="affix-affix">固定在距离顶部 150px 的位置</span>
    </avue-affix>
    <div style="height: 2000px">
      <div style="padding: 15px 20px; font-size: 18px">往下拉就会出现图钉</div>
    <div class="tudingBox" >
      <div class="tuding" >往下拉就会出现图钉</div>
    </div>
  </div>
</template>
@@ -26,6 +26,12 @@
</script>

<style lang="scss">
.tudingBox {
height: 2000px
}
.tuding {
padding: 15px 20px; font-size: 18px
}
.affix {
  position: relative;
  background-color: #fff;

 src/views/util/cache.vue

@@ -11,7 +11,7 @@
    <br />
    <el-input v-model="value" placeholder="input here" />

    <div style="height: 1000px"></div>
    <div class="blocks" ></div>
  </basic-container>
</template>

@@ -24,3 +24,8 @@
  },
};
</script>
<style scoped lang="scss">
.blocks {
height: 1000px
}
</style>

 src/views/util/top.vue

@@ -1,7 +1,7 @@
<template>
  <div>
    <div style="height: 2000px; background-color: #fff">
      <div style="padding: 15px 20px; font-size: 18px">往下拉就会出现返回菜单</div>
    <div class="menus" >
      <div class="menusItem">往下拉就会出现返回菜单</div>
    </div>
    <avue-back-top id="avue-view"></avue-back-top>
    <avue-back-top id="avue-view" :height="100" :bottom="200">
@@ -15,6 +15,12 @@
</script>

<style scoped>
.menus{
height: 2000px; background-color: #fff
}
.menusItem {
padding: 15px 20px; font-size: 18px
}
.top {
  padding: 10px;
  font-size: 14px;