完成部分设备总览页面

licp

2024-03-04 307095f257487bf74e76934e1dfccb1a4151f89b

完成部分设备总览页面

 src/assets/api/controller.js

@@ -98,6 +98,7 @@
    addDeviceParameter: "/deviceScope/addDeviceParameter", //添加设备详情参数
    delDeviceParameter: "/deviceScope/delDeviceParameter", //删除设备详情参数
    upDeviceParameter: "/deviceScope/upDeviceParameter", //修改设备详情参数
  authorizedPerson: "/deviceScope/authorizedPerson", //获取授权人
}

const systemLog = {

 src/components/view/a6-device-management.vue

@@ -53,7 +53,7 @@
        <div class="search">
            <div class="search_thing">
                <div class="search_label">状态：</div>
                <el-select v-model="value" placeholder="全部">
                <el-select v-model="componentData.entity.status" placeholder="全部">
                    <el-option
                      v-for="item in options"
                      :key="item.value"
@@ -65,16 +65,16 @@
            <div class="search_thing">
                <div class="search_label">设备名称：</div>
                <div class="search_input"><el-input size="small" placeholder="请输入" clearable
                        v-model="componentData.entity.laboratoryNumber" @keyup.enter.native="refreshTable()"></el-input></div>
                        v-model="componentData.entity.deviceName" @keyup.enter.native="refreshTable()"></el-input></div>
            </div>
            <div class="search_thing">
                <div class="search_label">规格型号：</div>
                <div class="search_input"><el-input size="small" placeholder="请输入" clearable
                        v-model="componentData.entity.head" @keyup.enter.native="refreshTable()"></el-input></div>
                        v-model="componentData.entity.internalCode" @keyup.enter.native="refreshTable()"></el-input></div>
            </div>
                        <div class="search_thing">
                            <div class="search_label">设备大类：</div>
                            <el-select v-model="value" placeholder="请选择">
                            <div class="search_label">设备类型：</div>
                            <el-select v-model="componentData.entity.type" placeholder="请选择">
                                <el-option
                                  v-for="item in options"
                                  :key="item.value"
@@ -370,6 +370,7 @@
        mounted() {
            this.entityCopy = this.HaveJson(this.componentData.entity)
            this.getPower()
      this.getAuthorizedPerson()
        },
        methods: {
            refreshTable() {
@@ -405,6 +406,20 @@
                }
                this.addPower = add
            },
      // èŽ·å–授权人
      getAuthorizedPerson(){
        this.$axios.get(this.$api.deviceScope.authorizedPerson).then(res => {
          console.log(11111,res)
                    let data = []
                    res.data.forEach(a=>{
                        data.push({
                            label: a.laboratoryName,
                            value: a.laboratoryName
                        })
                    })
                    this.authorizerList = data
                })
      },
            handleClose(){
                this.dialogVisible = false;
            },

 src/components/view/a6-device-overview.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,141 @@
<style scoped>
    .title {
        height: 60px;
        line-height: 60px;
    }

    .search {
        background-color: #fff;
        height: 80px;
        display: flex;
        align-items: center;
    }

    .search_thing {
        width: 350px;
        display: flex;
        align-items: center;
    }

    .search_label {
        width: 110px;
        font-size: 14px;
        text-align: right;
    }

    .search_input {
        width: calc(100% - 110px);
    }

    .table {
        margin-top: 10px;
        background-color: #fff;
        width: calc(100% - 40px);
        height: calc(100% - 60px - 80px - 10px - 40px);
        padding: 20px;
    }

  ul {
    list-style-type: none;
    display: grid;
    grid-template-columns: repeat(auto-fit, 370px);
    justify-content: center;
    grid-gap: 22px;
  }
  ul li{
    width: 370px;
    height: 160px;
    border-radius: 8px 8px 8px 8px;
    border: 1px solid #EEEEEE;
    margin: 0 !important;
    display: flex;
    align-items: center;
  }
  ul li img{
    width: 131px;
    height: 131px;
    border-radius: 16px;
    margin-right: 24px;
  }
</style>

<template>
    <div class="role_manage">
        <div>
            <el-row class="title">
                <el-col :span="12" style="padding-left: 20px;">设备总览</el-col>
            </el-row>
        </div>
        <div class="search">
      <div class="search_thing">
                <div class="search_label">状态：</div>
                <el-select v-model="searchForm.status" placeholder="全部" size="small">
                    <el-option
                      v-for="item in options"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value">
                    </el-option>
                  </el-select>
            </div>
            <div class="search_thing">
                <div class="search_label">设备名称：</div>
                <div class="search_input"><el-input size="small" placeholder="请输入" clearable v-model="searchForm.name"
                        @keyup.enter.native="refreshTable()"></el-input></div>
            </div>
            <div class="search_thing" style="padding-left: 30px;">
                <el-button size="small" @click="refresh()">重 ç½®</el-button>
                <el-button size="small" type="primary" @click="refreshTable()">查 è¯¢</el-button>
            </div>
        </div>
        <div class="table">
      <ul>
        <li v-for="m in 10" :key="m">
          <img src="https://cn.bing.com/images/search?view=detailV2&ccid=2rNAMzsn&id=EE3F6A1D4B80118C0F4376BEBAD7B9690DCA0029&thid=OIP.2rNAMzsnuOFoZdUl_OIltQHaE8&mediaurl=https%3a%2f%2fts1.cn.mm.bing.net%2fth%2fid%2fR-C.dab340333b27b8e16865d525fce225b5%3frik%3dKQDKDWm517q%252bdg%26riu%3dhttp%253a%252f%252fseopic.699pic.com%252fphoto%252f50052%252f2932.jpg_wh1200.jpg%26ehk%3dViGq82qf5d0jyp5G9R6ZLs8p6PmBR4IGfEPP48JYdZg%253d%26risl%3d%26pid%3dImgRaw%26r%3d0&exph=800&expw=1200&q=%e5%9c%a8%e7%ba%bf%e8%ae%be%e5%a4%87%e5%9b%be%e7%89%87%e4%b8%8d%e8%b7%a8%e5%9f%9f&simid=608030609452501280&FORM=IRPRST&ck=E1891E3AC31F578247B495D0C618E8AE&selectedIndex=1&itb=0&ajaxhist=0&ajaxserp=0" alt="">
          <div class="list-left">
            <div class="list-left-info">
              <span class="label">设备名称：</span>
              <span>小舞灵漩涡混合器</span>
            </div>
            <div class="list-left-info">
              <span class="label">规格型号：</span>
              <span>CASJTS-C004-01</span>
            </div>
            <div class="list-left-info">
              <span class="label">状态：</span>
              <el-tag type="danger">标签五</el-tag>
            </div>
          </div>
          <div class="circles">
            <div class="circle0 circle"></div>
            <div class="circle1 circle"></div>
            <div class="circle2 circle"></div>
            <div class="circle3 circle"></div>
          </div>
        </li>
      </ul>
        </div>
    </div>
</template>

<script>
    export default {
        data() {
            return {
        options:[],
        // æœç´¢è¡¨å•
        searchForm:{}
            }
        },
        mounted() {
        },
        methods: {
            refreshTable() {

            },
            refresh() {

            },
        }
    }
</script>

 src/main.js

@@ -13,7 +13,7 @@

//本地
Vue.prototype.LOCATIONVUE = "http://127.0.0.1:80";
const javaApi = 'http://192.168.0.133:8001';
const javaApi = 'http://192.168.0.133:8003';
//胜云服务器
// Vue.prototype.LOCATIONVUE = "http://syxt.shxiao2.cn";
// const javaApi = 'http://122.114.52.69:8001';

 static/js/menu.js

@@ -399,9 +399,9 @@
        }, {
            v: "设备总览",
            i: "font icon-24gl-clipboardList",
            u: "",
            u: "a6-device-overview",
            g: "6.4 è®¾å¤‡",
            p: ""
            p: "selectDeviceParameter"
        }, {
            v: "设备工具明细",
            i: "font icon-24gl-clipboardList",