From 675cdb1c795f92163094a1b4c1ef68f3d528e5c3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Wed, 8 Jan 2025 16:46:55 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/src/components/networkRequest/EquipmentRequest.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/ruoyi-ui/src/components/networkRequest/EquipmentRequest.vue b/ruoyi-ui/src/components/networkRequest/EquipmentRequest.vue
index 4682099..a863fa2 100644
--- a/ruoyi-ui/src/components/networkRequest/EquipmentRequest.vue
+++ b/ruoyi-ui/src/components/networkRequest/EquipmentRequest.vue
@@ -10,7 +10,7 @@
         </el-option>
       </el-select>
     </el-form-item>
-    <el-form-item label="deviceModeId" v-show="true">
+    <el-form-item label="deviceModeId" v-show="false">
         <el-input
             v-model="form.deviceModeId">
         </el-input>

From 91814231b27175707b771cc2872b2ea97c315be5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Tue, 14 Jan 2025 10:02:35 +0800
Subject: [PATCH 2/3] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=AF=B7=E6=B1=82?=
 =?UTF-8?q?=E6=96=B9=E6=B3=95=E5=90=8D=E7=A7=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ruoyi-ui/src/components/networkRequest/NetworkRequest.vue | 4 ++--
 ruoyi-ui/src/utils/scrin.js                               | 2 +-
 ruoyi-ui/src/views/system/layoutEdit.vue                  | 2 +-
 ruoyi-ui/src/views/system/layoutModel.vue                 | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/ruoyi-ui/src/components/networkRequest/NetworkRequest.vue b/ruoyi-ui/src/components/networkRequest/NetworkRequest.vue
index ae3b170..b757cb2 100644
--- a/ruoyi-ui/src/components/networkRequest/NetworkRequest.vue
+++ b/ruoyi-ui/src/components/networkRequest/NetworkRequest.vue
@@ -358,7 +358,7 @@ export default {
       this.$set(this.requests[k], 'connectionStatus', 0)
       getHistoryData({
         deviceModeId: i.deviceModeId,
-        functionIdentifier: i.functionIdentifier + '1',
+        functionIdentifier: i.functionIdentifier,
         interval: i.interval,
         "sceneId": 144,
         "deviceId": i.deviceId,
@@ -474,7 +474,7 @@ export default {
       if (!this.requests?.[k]?.request) {
         getHistoryData({
           deviceModeId: i.deviceModeId,
-          functionIdentifier: i.functionIdentifier + '1',
+          functionIdentifier: i.functionIdentifier ,
           interval: i.interval,
           "sceneId": 144,
           "deviceId": i.deviceId,
diff --git a/ruoyi-ui/src/utils/scrin.js b/ruoyi-ui/src/utils/scrin.js
index dbc3059..f9d3759 100644
--- a/ruoyi-ui/src/utils/scrin.js
+++ b/ruoyi-ui/src/utils/scrin.js
@@ -30,7 +30,7 @@ const mappingFunction = async (data, method) => {
     if (data.type === 2) {
         let res2 = await getHistoryData({
             deviceModeId: data.deviceModeId,
-            functionIdentifier: data.functionIdentifier + '1',
+            functionIdentifier: data.functionIdentifier ,
             interval: data.interval,
             "sceneId": 144,
             "deviceId": data.deviceId,
diff --git a/ruoyi-ui/src/views/system/layoutEdit.vue b/ruoyi-ui/src/views/system/layoutEdit.vue
index 7b98220..f688a8c 100644
--- a/ruoyi-ui/src/views/system/layoutEdit.vue
+++ b/ruoyi-ui/src/views/system/layoutEdit.vue
@@ -187,7 +187,7 @@
         <el-form-item label="画布背景" label-width="120px">
           <el-upload
             class="avatar-uploader"
-            action="dev-api/basic/hwTemplateAchieve/saveImage"
+            :action="(process.env.NODE_ENV === 'development'?'dev-api':'prod-api')+'/basic/hwTemplateAchieve/saveImage'"
             :headers="{
             authorization:'Bearer ' + getToken()
               }"
diff --git a/ruoyi-ui/src/views/system/layoutModel.vue b/ruoyi-ui/src/views/system/layoutModel.vue
index 3c4a120..7b2f0ca 100644
--- a/ruoyi-ui/src/views/system/layoutModel.vue
+++ b/ruoyi-ui/src/views/system/layoutModel.vue
@@ -81,7 +81,7 @@
         <el-form-item label="背景" label-width="80px">
           <el-upload
             class="avatar-uploader"
-            action="dev-api/basic/hwTemplateAchieve/saveImage"
+            :action="(process.env.NODE_ENV === 'development'?'dev-api':'prod-api')+'/basic/hwTemplateAchieve/saveImage'"
             :headers="{
             authorization:'Bearer ' + getToken()
               }"

From d46eaf04101026711f3822784fc245c133db24fa Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A4=9C=E7=AC=99=E6=AD=8C?= <2277317060@qq.com>
Date: Tue, 14 Jan 2025 21:02:27 +0800
Subject: [PATCH 3/3] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/complex/basic/scrollTable.vue  |  16 +-
 ruoyi-ui/src/components/complex/chart.vue     |   1 -
 .../components/modelComponents/bar/bar.vue    | 119 ++---
 .../components/modelComponents/line/line.vue  | 172 ++++---
 .../components/modelComponents/pie/pie.vue    | 109 ++--
 .../srcollTable/srcollTable.vue               | 128 ++---
 .../networkRequest/EquipmentRequest.vue       | 109 ++--
 .../networkRequest/NetworkRequest.vue         | 221 ++++++--
 .../src/components/setLayout/leftRightStr.vue |   2 +-
 .../src/components/setLayout/upDownStr.vue    |   2 +-
 ruoyi-ui/src/components/view/line.vue         |   2 +-
 ruoyi-ui/src/components/view/pie.vue          |   7 +-
 ruoyi-ui/src/utils/request.js                 |   2 +-
 ruoyi-ui/src/utils/scrin.js                   | 478 +++++++++---------
 ruoyi-ui/src/views/sceneView/index.vue        |   2 +-
 ruoyi-ui/src/views/system/layoutEdit.vue      |  13 +-
 ruoyi-ui/src/views/system/layoutModel.vue     |   4 +
 17 files changed, 752 insertions(+), 635 deletions(-)

diff --git a/ruoyi-ui/src/components/complex/basic/scrollTable.vue b/ruoyi-ui/src/components/complex/basic/scrollTable.vue
index b3318f7..398c5cd 100644
--- a/ruoyi-ui/src/components/complex/basic/scrollTable.vue
+++ b/ruoyi-ui/src/components/complex/basic/scrollTable.vue
@@ -1,10 +1,10 @@
 <template>
   <div style="display: inline-block;width: 100%;height: 100% ">
-      <div style="background-color: #094170">
-        <div class="scrollTable" style="font-weight: bold;" :style="`width:calc(${100/defaultData.th.length}%)`" v-for="i in defaultData.th">
-          {{i}}
-        </div>
+    <div style="background-color: #094170">
+      <div class="scrollTable" style="font-weight: bold;" :style="`width:calc(${100/defaultData.th.length}%)`" v-for="i in defaultData.th">
+        {{i}}
       </div>
+    </div>
     <vue-seamless-scroll
       :class-option="chartTableOption"
       :data="tableData"
@@ -57,11 +57,17 @@ export default {
         this.getOption()
       },
       deep: true
+    },
+    defaultTableData:{
+      handler(a, b) {
+        this.getOption()
+      },
+      deep: true
     }
   },
   async mounted() {
-    this.getOption()
     await this.getData()
+    this.getOption()
     setInterval(async () => {
       await this.getData()
     }, 1000*10)
diff --git a/ruoyi-ui/src/components/complex/chart.vue b/ruoyi-ui/src/components/complex/chart.vue
index 678870d..638211e 100644
--- a/ruoyi-ui/src/components/complex/chart.vue
+++ b/ruoyi-ui/src/components/complex/chart.vue
@@ -28,7 +28,6 @@ export default {
     }
   },
   async mounted() {
-    console.log('123123', this.defaultData)
     await this.getData()
   },
   methods: {
diff --git a/ruoyi-ui/src/components/modelComponents/bar/bar.vue b/ruoyi-ui/src/components/modelComponents/bar/bar.vue
index 0dfa168..5e6469f 100644
--- a/ruoyi-ui/src/components/modelComponents/bar/bar.vue
+++ b/ruoyi-ui/src/components/modelComponents/bar/bar.vue
@@ -2,66 +2,69 @@
   <div style="height: 100%">
     <el-row style="height: 100%">
       <el-col :span="12" style="height: 100%;overflow: auto;padding-bottom: 12px;" class="leftCol">
-        <div style="text-align: center">
-          <el-switch
-              v-model="configSwitch"
-              active-text="数据配置"
-              inactive-text="图表配置">
-          </el-switch>
-        </div>
-        <div v-show="!configSwitch" style="height: 100%">
-          <el-form ref="form" :model="defaultData.configForm" label-width="80px">
-            <el-form-item label="字体颜色">
-              <el-cascader
-                  v-model="defaultData.configForm['textColor']" placeholder="请选择字体颜色"
-                  :options="getCascaderOption('color')"
-                  @change="textColorChange"></el-cascader>
-            </el-form-item>
-            <el-form-item label="X坐标数据">
-              <el-select v-model="defaultData.configForm['Xdata']" placeholder="请选择数据"
-                         @change="XdataChange"
-                         clearable>
-                <el-option :label="i" :value="i"
-                           v-for="i in Object.keys(networkData)"></el-option>
-              </el-select>
-            </el-form-item>
-            <div v-for=" (item,k) in defaultData.configForm['datas']">
-              <el-form-item label="名称">
-                <el-input v-model="item.name" @change="nameChange(k)"></el-input>
-              </el-form-item>
-              <el-form-item label="数据">
-                <el-select v-model="item['data']" placeholder="请选择数据" @change="dataChange(k)"
-                           clearable>
-                  <el-option :label="i" :value="i"
-                             v-for="i in Object.keys(networkData)"></el-option>
-                </el-select>
-              </el-form-item>
-              <el-form-item label="柱子颜色">
-                <el-cascader
-                    v-model="item['barColor']" placeholder="请选择线颜色"
-                    :options="getCascaderOption('color')"
-                    @change="barColorChange(k)"></el-cascader>
-              </el-form-item>
-              <div class="add" @click="addDatas()" v-if=" k === defaultData.configForm['datas'].length -1">
-                <img :src="addIcon" alt="" style="width: 100%">
-              </div>
-              <div class="subtract" @click="subtractDatas(k)">
-                <img :src="subtractIcon" alt="" style="width: 100%">
-              </div>
-            </div>
 
-            <div class="add" @click="addDatas()" v-if="  defaultData.configForm['datas'].length ===0">
-              <img :src="addIcon" alt="" style="width: 100%">
-            </div>
-          </el-form>
+        <div style="width: 96%;margin:0 auto">
+          <el-collapse v-model="configSwitch" accordion>
+            <el-collapse-item title="图表配置" name="1">
+              <div  style="height: 100%">
+                <el-form ref="form" :model="defaultData.configForm" label-width="80px">
+                  <el-form-item label="字体颜色">
+                    <el-cascader
+                      v-model="defaultData.configForm['textColor']" placeholder="请选择字体颜色"
+                      :options="getCascaderOption('color')"
+                      @change="textColorChange"></el-cascader>
+                  </el-form-item>
+                  <el-form-item label="X坐标数据">
+                    <el-select v-model="defaultData.configForm['Xdata']" placeholder="请选择数据"
+                               @change="XdataChange"
+                               clearable>
+                      <el-option :label="i" :value="i"
+                                 v-for="i in Object.keys(networkData)"></el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-divider></el-divider>
+                  <div v-for=" (item,k) in defaultData.configForm['datas']">
+                    <el-form-item label="名称">
+                      <el-input v-model="item.name" @change="nameChange(k)"></el-input>
+                    </el-form-item>
+                    <el-form-item label="数据">
+                      <el-select v-model="item['data']" placeholder="请选择数据" @change="dataChange(k)"
+                                 clearable>
+                        <el-option :label="i" :value="i"
+                                   v-for="i in Object.keys(networkData)"></el-option>
+                      </el-select>
+                    </el-form-item>
+                    <el-form-item label="柱子颜色">
+                      <el-cascader
+                        v-model="item['barColor']" placeholder="请选择线颜色"
+                        :options="getCascaderOption('color')"
+                        @change="barColorChange(k)"></el-cascader>
+                    </el-form-item>
+                    <div class="add" @click="addDatas()" v-if=" k === defaultData.configForm['datas'].length -1">
+                      <img :src="addIcon" alt="" style="width: 100%">
+                    </div>
+                    <div class="subtract" @click="subtractDatas(k)">
+                      <img :src="subtractIcon" alt="" style="width: 100%">
+                    </div>
+                  </div>
 
-          <div style="text-align: center;height: 60px;line-height: 60px">
-            <el-button type="primary" @click="onSubmit">立即创建</el-button>
-            <el-button>重置</el-button>
-          </div>
-        </div>
-        <div v-show="configSwitch">
-          <NetworkRequest :requests="defaultData.requests" @GetFinalData="getData"/>
+                  <div class="add" @click="addDatas()" v-if="  defaultData.configForm['datas'].length ===0">
+                    <img :src="addIcon" alt="" style="width: 100%">
+                  </div>
+                </el-form>
+
+                <div style="text-align: center;height: 60px;line-height: 60px">
+                  <el-button type="primary" @click="onSubmit">立即创建</el-button>
+                  <el-button>重置</el-button>
+                </div>
+              </div>
+            </el-collapse-item>
+            <el-collapse-item title="数据配置" name="2">
+              <div>
+                <NetworkRequest :requests="defaultData.requests" @GetFinalData="getData"/>
+              </div>
+            </el-collapse-item>
+          </el-collapse>
         </div>
       </el-col>
       <el-col :span="12" style="height: 100%">
diff --git a/ruoyi-ui/src/components/modelComponents/line/line.vue b/ruoyi-ui/src/components/modelComponents/line/line.vue
index c3edc25..9d5d3ce 100644
--- a/ruoyi-ui/src/components/modelComponents/line/line.vue
+++ b/ruoyi-ui/src/components/modelComponents/line/line.vue
@@ -2,71 +2,73 @@
   <div style="height: 100%">
     <el-row style="height: 100%">
       <el-col :span="12" style="height: 100%;overflow: auto;padding-bottom: 12px;" class="leftCol">
-        <div style="text-align: center">
-          <el-switch
-              v-model="configSwitch"
-              active-text="数据配置"
-              inactive-text="图表配置">
-          </el-switch>
-        </div>
-        <div v-show="!configSwitch" style="height: 100%">
-          <el-form ref="form" :model="defaultData.configForm" label-width="80px">
-            <el-form-item label="字体颜色">
-              <el-cascader
-                  v-model="defaultData.configForm['textColor']" placeholder="请选择字体颜色"
-                  :options="getCascaderOption('color')"
-                  @change="textColorChange">
-                <template slot-scope="{ node, data }">
+        <div style="width: 96%;margin:0 auto">
+          <el-collapse v-model="configSwitch" accordion>
+            <el-collapse-item title="图表配置" name="1">
+              <div style="height: 100%">
+                <el-form ref="form" :model="defaultData.configForm" label-width="80px">
+                  <el-form-item label="字体颜色">
+                    <el-cascader
+                      v-model="defaultData.configForm['textColor']" placeholder="请选择字体颜色"
+                      :options="getCascaderOption('color')"
+                      @change="textColorChange">
+                      <template slot-scope="{ node, data }">
                   <span
-                      :style="`color:${$testColor(data.color)?data.color: '#000'}`">{{
+                    :style="`color:${$testColor(data.color)?data.color: '#000'}`">{{
                       data.label
                     }}</span>
-                </template>
-              </el-cascader>
-            </el-form-item>
-            <el-form-item label="X坐标数据">
-              <el-select v-model="defaultData.configForm['Xdata']" placeholder="请选择数据" @change="XdataChange"
-                         clearable>
-                <el-option :label="i" :value="i"
-                           v-for="i in Object.keys(networkData)"></el-option>
-              </el-select>
-            </el-form-item>
-            <div v-for=" (item,k) in defaultData.configForm['datas']">
-              <el-form-item label="名称">
-                <el-input v-model="item.name" @change="nameChange(k)"></el-input>
-              </el-form-item>
-              <el-form-item label="数据">
-                <el-select v-model="item['data']" placeholder="请选择数据" @change="dataChange(k)"
-                           clearable>
-                  <el-option :label="i" :value="i"
-                             v-for="i in Object.keys(networkData)"></el-option>
-                </el-select>
-              </el-form-item>
-              <el-form-item label="线颜色">
-                <el-cascader
-                    v-model="item['lineColor']" placeholder="请选择线颜色"
-                    :options="getCascaderOption('color')"
-                    @change="lineColorChange(k)"></el-cascader>
-              </el-form-item>
-              <div class="add" @click="addDatas()" v-if="k === defaultData.configForm['datas'].length -1">
-                <img :src="addIcon" alt="" style="width: 100%">
-              </div>
-              <div class="subtract" @click="subtractDatas(k)">
-                <img :src="subtractIcon" alt="" style="width: 100%">
-              </div>
-            </div>
-            <div class="add" @click="addDatas()" v-if="  defaultData.configForm['datas'].length ===0">
-              <img :src="addIcon" alt="" style="width: 100%">
-            </div>
-          </el-form>
+                      </template>
+                    </el-cascader>
+                  </el-form-item>
+                  <el-form-item label="X坐标数据">
+                    <el-select v-model="defaultData.configForm['Xdata']" placeholder="请选择数据" @change="XdataChange"
+                               clearable>
+                      <el-option :label="i" :value="i"
+                                 v-for="i in Object.keys(networkData)"></el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-divider></el-divider>
+                  <div v-for=" (item,k) in defaultData.configForm['datas']">
+                    <el-form-item label="名称">
+                      <el-input v-model="item.name" @change="nameChange(k)"></el-input>
+                    </el-form-item>
+                    <el-form-item label="数据">
+                      <el-select v-model="item['data']" placeholder="请选择数据" @change="dataChange(k)"
+                                 clearable>
+                        <el-option :label="i" :value="i"
+                                   v-for="i in Object.keys(networkData)"></el-option>
+                      </el-select>
+                    </el-form-item>
+                    <el-form-item label="线颜色">
+                      <el-cascader
+                        v-model="item['lineColor']" placeholder="请选择线颜色"
+                        :options="getCascaderOption('color')"
+                        @change="lineColorChange(k)"></el-cascader>
+                    </el-form-item>
+                    <div class="add" @click="addDatas()" v-if="k === defaultData.configForm['datas'].length -1">
+                      <img :src="addIcon" alt="" style="width: 100%">
+                    </div>
+                    <div class="subtract" @click="subtractDatas(k)">
+                      <img :src="subtractIcon" alt="" style="width: 100%">
+                    </div>
+                  </div>
+                  <div class="add" @click="addDatas()" v-if="  defaultData.configForm['datas'].length ===0">
+                    <img :src="addIcon" alt="" style="width: 100%">
+                  </div>
+                </el-form>
 
-          <div style="text-align: center;height: 60px;line-height: 60px">
-            <el-button type="primary" @click="onSubmit">立即创建</el-button>
-            <el-button>重置</el-button>
-          </div>
-        </div>
-        <div v-show="configSwitch">
-          <NetworkRequest :requests="defaultData.requests" @GetFinalData="getData"/>
+                <div style="text-align: center;height: 60px;line-height: 60px">
+                  <el-button type="primary" @click="onSubmit">立即创建</el-button>
+                  <el-button>重置</el-button>
+                </div>
+              </div>
+            </el-collapse-item>
+            <el-collapse-item title="数据配置" name="2">
+              <div>
+                <NetworkRequest :requests="defaultData.requests" @GetFinalData="getData"/>
+              </div>
+            </el-collapse-item>
+          </el-collapse>
         </div>
       </el-col>
       <el-col :span="12" style="height: 100%">
@@ -93,26 +95,17 @@ export default {
   },
   props: ['defaultData', 'isDialog', 'styleData'],
   watch: {
-    networkData: {
-      handler() {
-        this.textColorChange()
-        this.defaultData.configForm['datas'].forEach((i, k) => {
-          this.dataChange(k)
-          this.lineColorChange(k)
-        })
-        this.XdataChange()
-      },
-      deep: true
-    },
     'defaultData.requests': {
       async handler() {
-        await this.getData()
-        this.textColorChange()
-        this.defaultData.configForm['datas'].forEach((i, k) => {
-          this.dataChange(k)
-          this.lineColorChange(k)
-        })
-        this.XdataChange()
+        setTimeout(async () => {
+          await this.getData()
+          this.textColorChange()
+          this.defaultData.configForm['datas'].forEach((i, k) => {
+            this.dataChange(k)
+            this.lineColorChange(k)
+          })
+          this.XdataChange()
+        }, 200)
       },
       deep: true
     },
@@ -130,9 +123,20 @@ export default {
   created() {
     this.$detectingNullValues(this.defaultData, ['configForm', 'textColor'])
     this.$detectingNullValues(this.defaultData, ['configForm', 'datas', 0])
+    console.log('12312342344324323423', this.defaultData)
   },
   async mounted() {
     this.chartData = JSON.parse(JSON.stringify(this.defaultData.chartData))
+    this.chartData.series.forEach((i, k) => {
+      if (!this.defaultData.configForm['datas'][k]) {
+        console.log('add,add')
+        this.$set(this.defaultData.configForm['datas'], k, {
+          data: '',
+          lineColor: '',
+          name: ''
+        })
+      }
+    })
     // 获取全局配置
     await queryGlobalCfg().then(e => {
       this.globalList = e
@@ -143,7 +147,7 @@ export default {
   },
   methods: {
     addDatas() {
-      let series = JSON.parse(JSON.stringify(this.chartData.series[0]))
+      let series = JSON.parse(JSON.stringify(this.chartData.series[0] || '{}'))
       this.$set(this.chartData.series, this.defaultData.configForm['datas'].length, series)
       this.$set(this.defaultData.chartData.series, this.defaultData.configForm['datas'].length, series)
       this.$set(this.defaultData.configForm['datas'], this.defaultData.configForm['datas'].length, {
@@ -272,8 +276,8 @@ export default {
 
 .add {
   display: inline-block;
-  width: 1vw;
-  height: 1vw;
+  width: 2vw;
+  height: 2vw;
   padding: 0.5vw;
   background-color: #409EFF;
   border-radius: 50%;
@@ -283,8 +287,8 @@ export default {
 
 .subtract {
   display: inline-block;
-  width: 1vw;
-  height: 1vw;
+  width: 2vw;
+  height: 2vw;
   padding: 0.5vw;
   background-color: #909399;
   border-radius: 50%;
diff --git a/ruoyi-ui/src/components/modelComponents/pie/pie.vue b/ruoyi-ui/src/components/modelComponents/pie/pie.vue
index 2dc88c5..3c2d17a 100644
--- a/ruoyi-ui/src/components/modelComponents/pie/pie.vue
+++ b/ruoyi-ui/src/components/modelComponents/pie/pie.vue
@@ -2,50 +2,51 @@
   <div style="height: 100%">
     <el-row style="height: 100%">
       <el-col :span="12" style="height: 100%;overflow: auto;padding-bottom: 12px;" class="leftCol">
-        <div style="text-align: center">
-          <el-switch
-              v-model="configSwitch"
-              active-text="数据配置"
-              inactive-text="图表配置">
-          </el-switch>
-        </div>
-        <div v-show="!configSwitch" style="height: 100%">
-          <el-form ref="form" :model="defaultData.configForm" label-width="80px">
-            <el-form-item label="数据">
-              <el-select v-model="defaultData.configForm['data']" placeholder="请选择数据"
-                         @change="dataChange" clearable>
-                <el-option :label="i" :value="i"
-                           v-for="i in Object.keys(networkData)"></el-option>
-              </el-select>
-            </el-form-item>
-            <el-form-item label="扇面名称">
-              <el-select v-model="defaultData.configForm['pieName']" placeholder="请选择数据"
-                         @change="pieDataChange" clearable>
-                <el-option :label="i.label" :value="i.value"
-                           v-for="i in option"></el-option>
-              </el-select>
-            </el-form-item>
-            <el-form-item label="扇面数据">
-              <el-select v-model="defaultData.configForm['pieData']" placeholder="请选择数据"
-                         @change="pieDataChange" clearable>
-                <el-option :label="i.label" :value="i.value"
-                           v-for="i in option"></el-option>
-              </el-select>
-            </el-form-item>
-          </el-form>
+        <div style="width: 96%;margin:0 auto">
+          <el-collapse v-model="configSwitch" accordion>
+            <el-collapse-item title="图表配置" name="1">
+              <div style="height: 100%">
+                <el-form ref="form" :model="defaultData.configForm" label-width="80px">
+                  <el-form-item label="数据">
+                    <el-select v-model="defaultData.configForm['data']" placeholder="请选择数据"
+                               @change="dataChange" clearable>
+                      <el-option :label="i" :value="i"
+                                 v-for="i in Object.keys(networkData)"></el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item label="扇面名称">
+                    <el-select v-model="defaultData.configForm['pieName']" placeholder="请选择数据"
+                               @change="pieDataChange" clearable>
+                      <el-option :label="i.label" :value="i.value"
+                                 v-for="i in option"></el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item label="扇面数据">
+                    <el-select v-model="defaultData.configForm['pieData']" placeholder="请选择数据"
+                               @change="pieDataChange" clearable>
+                      <el-option :label="i.label" :value="i.value"
+                                 v-for="i in option"></el-option>
+                    </el-select>
+                  </el-form-item>
+                </el-form>
 
-          <div style="text-align: center;height: 60px;line-height: 60px">
-            <el-button type="primary" @click="onSubmit">立即创建</el-button>
-            <el-button>重置</el-button>
-          </div>
-        </div>
-        <div v-show="configSwitch">
-          <NetworkRequest :requests="defaultData.requests" @GetFinalData="getData"/>
+                <div style="text-align: center;height: 60px;line-height: 60px">
+                  <el-button type="primary" @click="onSubmit">立即创建</el-button>
+                  <el-button>重置</el-button>
+                </div>
+              </div>
+            </el-collapse-item>
+            <el-collapse-item title="数据配置" name="2">
+              <div>
+                <NetworkRequest :requests="defaultData.requests" @GetFinalData="getData" :limit="{isDataSet:false}"/>
+              </div>
+            </el-collapse-item>
+          </el-collapse>
         </div>
       </el-col>
       <el-col :span="12" style="height: 100%">
         <div class="chart">
-          <ComplexChart :defaultData="chartData"></ComplexChart>
+          <ComplexChart :defaultData="chartData" :colors="(styleData||{}).colors1"></ComplexChart>
         </div>
       </el-col>
     </el-row>
@@ -62,19 +63,15 @@ export default {
     ComplexChart,
     NetworkRequest
   },
-  props: ['defaultData', 'isDialog'],
+  props: ['defaultData', 'isDialog', 'styleData'],
   watch: {
-    networkData: {
-      handler() {
-        this.dataChange()
-      },
-      deep: true
-    },
     'defaultData.requests': {
       async handler() {
-        console.log('defaultData.requests')
-        await this.getData()
-        this.dataChange()
+
+        setTimeout(async () => {
+          await this.getData()
+          this.dataChange()
+        }, 200)
       },
       deep: true
     },
@@ -173,7 +170,7 @@ export default {
     },
     dataChange() {
       this.pieData = this.networkData[this.defaultData.configForm.data]
-      console.log('this.pieData',this.pieData)
+      console.log('this.pieData', this.pieData)
       this.option = Object.keys(this.pieData?.[0]).map(e => {
         return {
           value: e,
@@ -183,15 +180,14 @@ export default {
     },
     pieDataChange() {
       if (this.defaultData.configForm['pieName'] && this.defaultData.configForm['pieData']) {
-        let data1 = this.pieData.map(e=>{
-          return [e[this.defaultData.configForm['pieName']],e[this.defaultData.configForm['pieData']]]
+        let data1 = this.pieData.map(e => {
+          return [e[this.defaultData.configForm['pieName']], e[this.defaultData.configForm['pieData']]]
         })
         this.$detectingNullValues(this.chartData, ['dataset', 'source', 0])
-        let data =[this.chartData.dataset.source[0],...data1]
+        let data = [this.chartData.dataset.source[0], ...data1]
 
-            this.$set(this.chartData.dataset,'source' , data)
+        this.$set(this.chartData.dataset, 'source', data)
 
-        console.log('this.chartData.dataset.source',this.chartData)
       }
     }
   },
@@ -200,7 +196,8 @@ export default {
 <style scoped lang="less">
 .chart {
   width: 100%;
-  height: 100%;
+  height: 50%;
+  transform: translateY(50%);
 }
 
 .notScroll {
diff --git a/ruoyi-ui/src/components/modelComponents/srcollTable/srcollTable.vue b/ruoyi-ui/src/components/modelComponents/srcollTable/srcollTable.vue
index cd4f877..fdaea9b 100644
--- a/ruoyi-ui/src/components/modelComponents/srcollTable/srcollTable.vue
+++ b/ruoyi-ui/src/components/modelComponents/srcollTable/srcollTable.vue
@@ -2,69 +2,70 @@
   <div style="height: 100%">
     <el-row style="height: 100%">
       <el-col :span="12" style="height: 100%;overflow: auto;padding-bottom: 12px;" class="leftCol">
-        <div style="text-align: center">
-          <el-switch
-              v-model="configSwitch"
-              active-text="数据配置"
-              inactive-text="图表配置">
-          </el-switch>
-        </div>
-        <div v-show="!configSwitch" style="height: 100%">
-          <el-form ref="form" :model="defaultData" label-width="80px">
-            <el-form-item label="表头数据">
-              <el-select
-                  v-model="defaultData.th"
-                  multiple
-                  filterable
-                  allow-create
-                  default-first-option
-                  @change="thListChange"
-                  placeholder="请选择表头">
-                <el-option
-                    v-for="item in defaultData.th"
-                    :key="item"
-                    :label="item"
-                    :value="item">
-                </el-option>
-              </el-select>
-            </el-form-item>
-            <el-form-item label="列数据">
-              <el-select
-                  v-model="defaultData.td"
-                  multiple
-                  filterable
-                  allow-create
-                  default-first-option
-                  @change="thListChange"
-                  placeholder="请选择列数据">
-                <el-option
-                    v-for="item in defaultData.td"
-                    :key="item"
-                    :label="item"
-                    :value="item">
-                </el-option>
-              </el-select>
-            </el-form-item>
-            <el-form-item label="数据集">
-              <el-select v-model="defaultData.tableDataKey" placeholder="请选择数据" @change="dataChange" clearable>
-                <el-option :label="i" :value="i"
-                           v-for="i in Object.keys(networkData)"></el-option>
-              </el-select>
-            </el-form-item>
-          </el-form>
 
-          <div style="text-align: center;height: 60px;line-height: 60px">
-            <el-button type="primary" @click="onSubmit">立即创建</el-button>
-            <el-button>重置</el-button>
-          </div>
-        </div>
-        <div v-show="configSwitch">
-          <NetworkRequest ref="NetworkRequest" :requests="defaultData.requests" @GetFinalData="getData"/>
+        <div style="width: 96%;margin:0 auto">
+          <el-collapse v-model="configSwitch" accordion>
+            <el-collapse-item title="图表配置" name="1">
+              <div style="height: 100%">
+                <el-form ref="form" :model="defaultData" label-width="80px">
+                  <el-form-item label="表头数据">
+                    <el-select
+                      v-model="defaultData.th"
+                      multiple
+                      filterable
+                      allow-create
+                      default-first-option
+                      placeholder="请选择表头">
+                      <el-option
+                        v-for="item in defaultData.th"
+                        :key="item"
+                        :label="item"
+                        :value="item">
+                      </el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item label="列数据">
+                    <el-select
+                      v-model="defaultData.td"
+                      multiple
+                      filterable
+                      allow-create
+                      default-first-option
+                      placeholder="请选择列数据">
+                      <el-option
+                        v-for="item in tdkeys"
+                        :key="item"
+                        :label="item"
+                        :value="item">
+                      </el-option>
+                    </el-select>
+                  </el-form-item>
+                  <el-form-item label="数据集">
+                    <el-select v-model="defaultData.tableDataKey" placeholder="请选择数据" @change="dataChange" clearable>
+                      <el-option :label="i" :value="i"
+                                 v-for="i in Object.keys(networkData)"></el-option>
+                    </el-select>
+                  </el-form-item>
+                </el-form>
+
+                <div style="text-align: center;height: 60px;line-height: 60px">
+                  <el-button type="primary" @click="onSubmit">立即创建</el-button>
+                  <el-button>重置</el-button>
+                </div>
+              </div>
+            </el-collapse-item>
+            <el-collapse-item title="数据配置" name="2">
+              <div>
+                <NetworkRequest ref="NetworkRequest" :requests="defaultData.requests" @GetFinalData="getData"/>
+              </div>
+            </el-collapse-item>
+          </el-collapse>
         </div>
       </el-col>
       <el-col :span="12" style="height: 100%">
         <div class="chart">
-          <ComplexScrollTable ref="ComplexScrollTable" :defaultData="defaultData" :default-table-data="tableData"></ComplexScrollTable>
+          <ComplexScrollTable ref="ComplexScrollTable" :defaultData="defaultData"
+                              :default-table-data="tableData"></ComplexScrollTable>
         </div>
       </el-col>
     </el-row>
@@ -95,19 +96,20 @@ export default {
   },
   data() {
     return {
-      tableData:[],
+      tableData: [],
       configSwitch: false,
       networkData: {},
+      tdkeys: [],
     }
   },
   created() {
   },
   async mounted() {
-    this.dataChange()
     await this.getData()
+    this.dataChange()
     setInterval(async () => {
       await this.getData()
-    }, 1000*10)
+    }, 1000 * 10)
   },
   methods: {
     async getData(e) {
@@ -121,9 +123,9 @@ export default {
       }
     },
     dataChange() {
-      console.log('dataChange')
       this.tableData = this.networkData[this.defaultData.tableDataKey]
-      console.log('this.tableData11',this.tableData)
+      let keys = Object.keys(this.tableData?.[0] || {})
+      this.tdkeys = keys
     }
   },
 }
diff --git a/ruoyi-ui/src/components/networkRequest/EquipmentRequest.vue b/ruoyi-ui/src/components/networkRequest/EquipmentRequest.vue
index a863fa2..394006d 100644
--- a/ruoyi-ui/src/components/networkRequest/EquipmentRequest.vue
+++ b/ruoyi-ui/src/components/networkRequest/EquipmentRequest.vue
@@ -11,12 +11,17 @@
       </el-select>
     </el-form-item>
     <el-form-item label="deviceModeId" v-show="false">
-        <el-input
-            v-model="form.deviceModeId">
-        </el-input>
+      <el-input
+          v-model="form.deviceModeId">
+      </el-input>
+    </el-form-item>
+    <el-form-item label="name" v-show="false">
+      <el-input
+          v-model="form.deviceName">
+      </el-input>
     </el-form-item>
     <el-form-item label="设备属性">
-      <el-select v-model="form.functionIdentifier" placeholder="请选择">
+      <el-select v-model="form.functionIdentifier" placeholder="请选择" @change="functionIdentifierChange">
         <el-option
             v-for="item in deviceFunList"
             :key="item.functionIdentifier"
@@ -25,25 +30,10 @@
         </el-option>
       </el-select>
     </el-form-item>
-    <el-form-item label="数据间隔">
-      <el-select v-model="form.interval" placeholder="请选择" @change="changeInterval">
-        <el-option
-            v-for="item in intervalOption"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value">
-        </el-option>
-      </el-select>
-    </el-form-item>
-    <el-form-item label="时间周期">
-      <el-date-picker
-          @change="timeChange"
-          v-model="time"
-          type="datetimerange"
-          range-separator="至"
-          start-placeholder="开始日期"
-          end-placeholder="结束日期">
-      </el-date-picker>
+    <el-form-item label="functionIdentifierName" v-show="false">
+      <el-input
+          v-model="form.functionIdentifierName">
+      </el-input>
     </el-form-item>
   </div>
 </template>
@@ -59,74 +49,39 @@ export default {
       time: [],
       deviceList: [],
       deviceFunList: [],
-      intervalOption: [
-        {
-          label: '时',
-          value: '1',
-          default: 1
-        },
-        {
-          label: '日',
-          value: '2',
-          default: 24
-        },
-        {
-          label: '周',
-          value: '3',
-          default: 7
-        },
-        {
-          label: '月',
-          value: '4',
-          default: 30
-        },
-        {
-          label: '年',
-          value: '5',
-          default: 12
-        },
-      ],
     }
   },
-  mounted() {
-    getDeviceList().then(e => {
+  async mounted() {
+    await getDeviceList().then(e => {
       this.deviceList = e.rows
     })
+    console.log('this.form.deviceId', this.form)
+    if (this.form.deviceId) {
+      let modelId = this.deviceList.find(v => v.deviceId === this.form.deviceId).deviceModeId
+      getDeviceFunctions(modelId).then(v => {
+        this.deviceFunList = v.data
+      })
+    }
   },
   methods: {
     setDeviceId(e) {
       let modelId = this.deviceList.find(v => v.deviceId === e).deviceModeId
       this.$set(this.form, 'deviceModeId', modelId)
-      console.log(modelId)
+      this.$set(this, 'form', {
+        ...this.form,
+        deviceName: this.deviceList.find(v => v.deviceId === e).deviceName,
+        functionIdentifier: '',
+        interval: '',
+      })
+      this.$set(this, 'time', [])
       getDeviceFunctions(modelId).then(v => {
         this.deviceFunList = v.data
       })
     },
-    timeChange() {
-      this.$set(this.form, 'startTime', new Date(this.time[0]).getTime())
-      this.$set(this.form, 'endTime', new Date(this.time[1]).getTime())
+    functionIdentifierChange(e) {
+      this.$set(this.form, 'functionIdentifierName', this.deviceFunList.find(v => v.functionIdentifier === e).functionName || '')
+      console.log('functionIdentifierNamefunctionIdentifierNamefunctionIdentifierName,', this.form)
     },
-    changeInterval(e) {
-      let data = this.intervalOption.find(v => v.value === e)
-      this.$set(this.form,'intervalType',data.default)
-      if (e === '1') {
-        this.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24)), this.$parseTime(new Date())]
-      }
-      if (e === '2') {
-        this.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24)), this.$parseTime(new Date())]
-      }
-      if (e === '3') {
-        this.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24 * 7)), this.$parseTime(new Date())]
-      }
-      if (e === '4') {
-        this.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24 * 30)), this.$parseTime(new Date())]
-      }
-      if (e === '5') {
-        this.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24 * 365)), this.$parseTime(new Date())]
-      }
-      this.$set(this.form, 'startTime', new Date(this.time[0]).getTime())
-      this.$set(this.form, 'endTime', new Date(this.time[1]).getTime())
-    }
   }
 }
 </script>
diff --git a/ruoyi-ui/src/components/networkRequest/NetworkRequest.vue b/ruoyi-ui/src/components/networkRequest/NetworkRequest.vue
index b757cb2..10802eb 100644
--- a/ruoyi-ui/src/components/networkRequest/NetworkRequest.vue
+++ b/ruoyi-ui/src/components/networkRequest/NetworkRequest.vue
@@ -3,6 +3,8 @@
     <div style="width: 90%;margin: 0 auto ">
       <div style="margin: 8px 0">
         <el-button type="primary" @click="addRequest()">添加</el-button>
+        <el-button type="primary" @click="setInterval()">设置设备获取数据间隔</el-button>
+
       </div>
 
       <div v-for="(i,k) in requests" style="display: inline-block;margin: 0 8px 8px 0">
@@ -12,9 +14,9 @@
               <div style="width: 100%;height: 50px">
                 <div style="width: 50px;height: 100%;display: inline-block">
                   <el-image
-                      style="width: 100%; height: 100%;"
-                      :src="customizationRequestImg"
-                      fit="fill"></el-image>
+                    style="width: 100%; height: 100%;"
+                    :src="customizationRequestImg"
+                    fit="fill"></el-image>
                 </div>
                 <div style="width: calc(100% - 50px - 150px);height: 100%;display: inline-block;vertical-align: top">
                   <div style="width: 100%;height: 50%;padding-left: 12px;line-height: 25px;font-weight: 700">
@@ -23,7 +25,7 @@
                     </span>
                   </div>
                   <div
-                      style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis; width: 175%;height: 50%;padding-left: 12px;line-height: 25px;font-size: 12px;color: #0009">
+                    style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis; width: 175%;height: 50%;padding-left: 12px;line-height: 25px;font-size: 12px;color: #0009">
                     <span>
                       {{ i.url || ' http:10.11.111.111:1111' }}
                     </span>
@@ -60,9 +62,9 @@
               <div style="width: 100%;height: 50px">
                 是否启用：
                 <el-switch
-                    v-model="i.isOpen"
-                    active-color="#13ce66"
-                    inactive-color="#ff4949">
+                  v-model="i.isOpen"
+                  active-color="#13ce66"
+                  inactive-color="#ff4949">
                 </el-switch>
               </div>
             </div>
@@ -74,20 +76,20 @@
               <div style="width: 100%;height: 50px">
                 <div style="width: 50px;height: 100%;display: inline-block">
                   <el-image
-                      style="width: 100%; height: 100%;"
-                      :src="customizationRequestImg"
-                      fit="fill"></el-image>
+                    style="width: 100%; height: 100%;"
+                    :src="customizationRequestImg"
+                    fit="fill"></el-image>
                 </div>
                 <div style="width: calc(100% - 50px - 150px);height: 100%;display: inline-block;vertical-align: top">
                   <div style="width: 100%;height: 50%;padding-left: 12px;line-height: 25px;font-weight: 700">
                     <span>
-                      {{ i.deviceId || '设备' }}
+                      {{ i.deviceName || i.deviceId || '设备' }}
                     </span>
                   </div>
                   <div
-                      style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis; width: 175%;height: 50%;padding-left: 12px;line-height: 25px;font-size: 12px;color: #0009">
+                    style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis; width: 175%;height: 50%;padding-left: 12px;line-height: 25px;font-size: 12px;color: #0009">
                     <span>
-                      {{ i.functionIdentifier || '属性' }}
+                      {{ i.functionIdentifierName || i.functionIdentifier || '属性' }}
                     </span>
                   </div>
                 </div>
@@ -123,9 +125,9 @@
               <div style="width: 100%;height: 50px">
                 是否启用：
                 <el-switch
-                    v-model="i.isOpen"
-                    active-color="#13ce66"
-                    inactive-color="#ff4949">
+                  v-model="i.isOpen"
+                  active-color="#13ce66"
+                  inactive-color="#ff4949">
                 </el-switch>
               </div>
             </div>
@@ -135,19 +137,19 @@
     </div>
 
     <el-dialog
-        title="添加请求"
-        append-to-body
-        :visible.sync="addRequestDialogVisible"
-        width="30%">
+      title="添加请求"
+      append-to-body
+      :visible.sync="addRequestDialogVisible"
+      width="30%">
       <el-row :gutter="12">
         <el-col :span="8">
           <el-card shadow="hover" :body-style="{padding: '0'}">
             <div @click="addNetworkRequest" style="padding:20px">
               <div style="text-align: center">
                 <el-image
-                    style="width: 100px; height: 100px;"
-                    :src="networkImg"
-                    fit="fill"></el-image>
+                  style="width: 100px; height: 100px;"
+                  :src="networkImg"
+                  fit="fill"></el-image>
               </div>
               <div style="text-align: center">网络请求</div>
             </div>
@@ -158,9 +160,9 @@
             <div @click="addEquipment" style="padding:20px">
               <div style="text-align: center">
                 <el-image
-                    style="width: 100px; height: 100px;"
-                    :src="customizationRequestImg"
-                    fit="fill"></el-image>
+                  style="width: 100px; height: 100px;"
+                  :src="customizationRequestImg"
+                  fit="fill"></el-image>
               </div>
               <div style="text-align: center">设备信息</div>
             </div>
@@ -171,9 +173,9 @@
             <div @click="addNetworkRequest" style="padding:20px">
               <div style="text-align: center">
                 <el-image
-                    style="width: 100px; height: 100px;"
-                    :src="customizationRequestImg"
-                    fit="fill"></el-image>
+                  style="width: 100px; height: 100px;"
+                  :src="customizationRequestImg"
+                  fit="fill"></el-image>
               </div>
               <div style="text-align: center">自定义请求</div>
             </div>
@@ -186,10 +188,46 @@
     </el-dialog>
 
     <el-dialog
-        title="网络请求"
-        append-to-body
-        :visible.sync="addRequestFormDialogVisible"
-        width="30%">
+      title="设置设备获取数据间隔"
+      append-to-body
+      :visible.sync="setIntervalDialogVisible"
+      width="30%">
+      <el-form :model="equipmentIntervalForm" label-width="120px">
+        <el-form-item label="数据间隔" v-if="false">
+          <el-input v-model="equipmentIntervalForm.intervalType"></el-input>
+        </el-form-item>
+        <el-form-item label="数据间隔">
+          <el-select v-model="equipmentIntervalForm.interval" placeholder="请选择" @change="changeInterval">
+            <el-option
+              v-for="item in intervalOption"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="时间周期">
+          <el-date-picker
+            @change="timeChange"
+            v-model="equipmentIntervalForm.time"
+            type="datetimerange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期">
+          </el-date-picker>
+        </el-form-item>
+      </el-form>
+      <span slot="footer" class="dialog-footer">
+    <el-button @click="setIntervalDialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="setIntervalOk">确 定</el-button>
+  </span>
+    </el-dialog>
+
+    <el-dialog
+      title="网络请求"
+      append-to-body
+      :visible.sync="addRequestFormDialogVisible"
+      width="30%">
       <el-form :model="addRequestForm">
         <InterfaceRequest :form="addRequestForm"/>
       </el-form>
@@ -200,12 +238,12 @@
     </el-dialog>
 
     <el-dialog
-        title="添加设备"
-        append-to-body
-        :visible.sync="addEquipmentFormDialogVisible"
-        width="30%">
+      title="添加设备"
+      append-to-body
+      :visible.sync="addEquipmentFormDialogVisible"
+      width="30%">
       <el-form :model="addEquipmentForm" label-width="120px">
-        <EquipmentRequest :form="addEquipmentForm"/>
+        <EquipmentRequest :form="addEquipmentForm" v-if="addEquipmentFormDialogVisible"/>
       </el-form>
       <span slot="footer" class="dialog-footer">
     <el-button @click="addEquipmentFormDialogVisible = false">取 消</el-button>
@@ -225,10 +263,10 @@
           </el-form-item>
           <el-form-item label="映射字段" label-width="120px">
             <el-cascader
-                v-model="i.region"
-                :options="options" @change="mappingChange(i,k)"></el-cascader>
+              v-model="i.region"
+              :options="options" @change="mappingChange(i,k)"></el-cascader>
           </el-form-item>
-          <el-form-item label="将数据某一项集合" v-if="i.isArray">
+          <el-form-item label="将数据某一项集合" v-if="(!((limit||{}).isDataSet===false))&& i.isArray">
             <el-select v-model="i.mapData" clearable placeholder="非必选">
               <el-option :label="i.label" :value="i.value" v-for="i in enumOption"></el-option>
             </el-select>
@@ -262,7 +300,7 @@ export default {
     InterfaceRequest,
     EquipmentRequest
   },
-  props: ['requests'],
+  props: ['requests', 'limit'],
   data() {
     return {
       value: false,
@@ -271,11 +309,13 @@ export default {
       networkImg,
       customizationRequestImg,
       addRequestDialogVisible: false,
+      setIntervalDialogVisible: false,
       addRequestFormDialogVisible: false,
       addEquipmentFormDialogVisible: false,
       mappingDialogVisible: false,
       addRequestForm: {},
       addEquipmentForm: {},
+      equipmentIntervalForm: {},
       mappingForm: {},
       option: [],
       enumOption: [],
@@ -283,17 +323,88 @@ export default {
       updateIndex: 0,
       updateDeviceFlag: false,
       updateDeviceIndex: 0,
+      intervalOption: [
+        {
+          label: '时',
+          value: '1',
+          default: 1
+        },
+        {
+          label: '日',
+          value: '2',
+          default: 24
+        },
+        {
+          label: '周',
+          value: '3',
+          default: 7
+        },
+        {
+          label: '月',
+          value: '4',
+          default: 30
+        },
+        {
+          label: '年',
+          value: '5',
+          default: 12
+        },
+      ],
     }
   },
   mounted() {
     if (!this.requests || !Array.isArray(this.requests)) {
       this.requests = []
     }
+    let firstDevice = this.requests.find(e => e.type === 2)
+    this.$set(this, 'equipmentIntervalForm', {
+      intervalType: firstDevice.intervalType,
+      interval: firstDevice.interval,
+      time: [this.$parseTime(firstDevice?.startTime), this.$parseTime(firstDevice?.endTime)]
+    })
   },
   methods: {
     addRequest() {
       this.addRequestDialogVisible = true
     },
+    setInterval() {
+      this.setIntervalDialogVisible = true
+    },
+    changeInterval(e) {
+      let data = this.intervalOption.find(v => v.value === e)
+      this.$set(this.equipmentIntervalForm, 'intervalType', data.default)
+      if (e === '1') {
+        this.equipmentIntervalForm.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24)), this.$parseTime(new Date())]
+      }
+      if (e === '2') {
+        this.equipmentIntervalForm.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24)), this.$parseTime(new Date())]
+      }
+      if (e === '3') {
+        this.equipmentIntervalForm.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24 * 7)), this.$parseTime(new Date())]
+      }
+      if (e === '4') {
+        this.equipmentIntervalForm.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24 * 30)), this.$parseTime(new Date())]
+      }
+      if (e === '5') {
+        this.equipmentIntervalForm.time = [this.$parseTime(new Date().getTime() - (1000 * 60 * 60 * 24 * 365)), this.$parseTime(new Date())]
+      }
+      this.$set(this.equipmentIntervalForm, 'startTime', new Date(this.equipmentIntervalForm.time[0]).getTime())
+      this.$set(this.equipmentIntervalForm, 'endTime', new Date(this.equipmentIntervalForm.time[1]).getTime())
+    },
+    timeChange() {
+      this.$set(this.form, 'startTime', new Date(this.time[0]).getTime())
+      this.$set(this.form, 'endTime', new Date(this.time[1]).getTime())
+    },
+    setIntervalOk() {
+      this.requests.forEach((e,k) => {
+        if (e.type === 2) {
+          this.$set(this.requests[k], 'interval', this.equipmentIntervalForm.interval)
+          this.$set(this.requests[k], 'intervalType', this.equipmentIntervalForm.intervalType)
+          this.$set(this.requests[k], 'startTime', new Date(this.equipmentIntervalForm.time[0]).getTime())
+          this.$set(this.requests[k], 'endTime', new Date(this.equipmentIntervalForm.time[1]).getTime())
+        }
+      })
+    },
     subtractRequest(key) {
       if (this.requests?.length > 1) {
         this.$delete(this.requests, key)
@@ -327,9 +438,15 @@ export default {
       this.addRequestForm = {}
     },
     addEquipmentConfirm() {
+      console.log('123123,345345,12313',this.addEquipmentForm)
+      console.log('123123,345345,12313',this.requests)
       if (this.updateDeviceFlag) {
         this.$set(this.requests, this.updateDeviceIndex, Vue.observable({
           ...this.addEquipmentForm,
+          interval: this.equipmentIntervalForm.interval,
+          intervalType: this.equipmentIntervalForm.intervalType,
+          startTime: new Date(this.equipmentIntervalForm.time[0]).getTime(),
+          endTime: new Date(this.equipmentIntervalForm.time[1]).getTime(),
           type: 2,
           connectionStatus: -1,
           isOpen: true
@@ -337,6 +454,10 @@ export default {
       } else {
         this.requests.push(Vue.observable({
           ...this.addEquipmentForm,
+          interval: this.equipmentIntervalForm.interval,
+          intervalType: this.equipmentIntervalForm.intervalType,
+          startTime: new Date(this.equipmentIntervalForm.time[0]).getTime(),
+          endTime: new Date(this.equipmentIntervalForm.time[1]).getTime(),
           type: 2,
           connectionStatus: -1,
           isOpen: true
@@ -472,9 +593,9 @@ export default {
     },
     async setDeviceMapping(i, k) {
       if (!this.requests?.[k]?.request) {
-        getHistoryData({
+        await getHistoryData({
           deviceModeId: i.deviceModeId,
-          functionIdentifier: i.functionIdentifier ,
+          functionIdentifier: i.functionIdentifier,
           interval: i.interval,
           "sceneId": 144,
           "deviceId": i.deviceId,
@@ -550,12 +671,12 @@ export default {
     },
     addMappingArr() {
       this.mappingForm.mappingArr.push(
-          {
-            name: '',
-            region: '',
-            isArray: false,
-            mapData: '',
-          }
+        {
+          name: '',
+          region: '',
+          isArray: false,
+          mapData: '',
+        }
       )
     },
   }
diff --git a/ruoyi-ui/src/components/setLayout/leftRightStr.vue b/ruoyi-ui/src/components/setLayout/leftRightStr.vue
index ce6c7a9..2b6d213 100644
--- a/ruoyi-ui/src/components/setLayout/leftRightStr.vue
+++ b/ruoyi-ui/src/components/setLayout/leftRightStr.vue
@@ -296,7 +296,7 @@ export default {
       this.dialogVisible = false
     },
     SelectComponentsCB(e) {
-      this.$set(this.tree, this.type, e)
+      this.$set(this.tree, this.type, JSON.parse(JSON.stringify(e)))
       this.componentsDialogVisible = false
     },
     clearCom() {
diff --git a/ruoyi-ui/src/components/setLayout/upDownStr.vue b/ruoyi-ui/src/components/setLayout/upDownStr.vue
index ce5c94f..4d49f38 100644
--- a/ruoyi-ui/src/components/setLayout/upDownStr.vue
+++ b/ruoyi-ui/src/components/setLayout/upDownStr.vue
@@ -294,7 +294,7 @@ export default {
       this.dialogVisible = false
     },
     SelectComponentsCB(e) {
-      this.$set(this.tree, this.type, e)
+      this.$set(this.tree, this.type, JSON.parse(JSON.stringify(e)))
       this.componentsDialogVisible = false
     },
     clearCom() {
diff --git a/ruoyi-ui/src/components/view/line.vue b/ruoyi-ui/src/components/view/line.vue
index e9ee44f..9564184 100644
--- a/ruoyi-ui/src/components/view/line.vue
+++ b/ruoyi-ui/src/components/view/line.vue
@@ -35,7 +35,7 @@ export default {
       if (Object.keys(data).length > 0) {
         this.getChartData(data)
       }
-      this.chartData.color = this.styleData?.colors?.length > 0 ? this.styleData.colors : ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
+      this.chartData.color = this.styleData?.colors1?.length > 0 ? this.styleData.colors1 : ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
 
       this.$refs.chart?.setData(this.$clearNull(this.chartData, this.requestData) || {})
     },
diff --git a/ruoyi-ui/src/components/view/pie.vue b/ruoyi-ui/src/components/view/pie.vue
index df2c202..f04be67 100644
--- a/ruoyi-ui/src/components/view/pie.vue
+++ b/ruoyi-ui/src/components/view/pie.vue
@@ -8,7 +8,7 @@ import Chart from '@/components/chart'
 import Vue from "vue";
 
 export default {
-  props: ['defaultData'],
+  props: ['defaultData', 'styleData'],
   components: {
     Chart
   },
@@ -28,13 +28,14 @@ export default {
     await this.getData()
     setInterval(async () => {
       await this.getData()
-    }, 10000)
+    }, 60000)
   },
   methods: {
     async getData() {
       this.chartData = JSON.parse(JSON.stringify(this.defaultData.chartData))
+      this.chartData.color = this.styleData?.colors1?.length > 0 ? this.styleData.colors1 : ['#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']
       let data = await this.$getFinalData(this.defaultData.requests)
-      console.log('chart-data',data)
+      console.log('chart-data',this.styleData?.colors)
       console.log('chart-data==--==',this.defaultData)
       if (Object.keys(data).length > 0) {
         this.pieData = data[this.defaultData.configForm.data]
diff --git a/ruoyi-ui/src/utils/request.js b/ruoyi-ui/src/utils/request.js
index 8aead8b..0095346 100644
--- a/ruoyi-ui/src/utils/request.js
+++ b/ruoyi-ui/src/utils/request.js
@@ -49,7 +49,7 @@ service.interceptors.request.use(config => {
       const s_url = sessionObj.url;                  // 请求地址
       const s_data = sessionObj.data;                // 请求数据
       const s_time = sessionObj.time;                // 请求时间
-      const interval = 1000;                         // 间隔时间(ms)，小于此时间视为重复提交
+      const interval = 100;                         // 间隔时间(ms)，小于此时间视为重复提交
       if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) {
         const message = '数据正在处理，请勿重复提交';
         console.warn(`[${s_url}]: ` + message)
diff --git a/ruoyi-ui/src/utils/scrin.js b/ruoyi-ui/src/utils/scrin.js
index f9d3759..5d9df56 100644
--- a/ruoyi-ui/src/utils/scrin.js
+++ b/ruoyi-ui/src/utils/scrin.js
@@ -3,276 +3,290 @@ import {getHistoryData} from "@/api/configuration/equipment";
 import Vue from 'vue'
 
 const mappingFunction = async (data, method) => {
-    if (data.type === 1) {
-        let res2 = await interfaceRequest(data)
-        let returnRes = {}
-        method?.mappingArr?.forEach(v => {
-            let res = res2.data
-            for (let i of (v?.region || [])) {
-                if (res[i]) {
-                    res = res[i]
-                } else {
-                    res = null
-                    return
-                }
-            }
-            if (v?.isArray && v?.mapData && Array.isArray(res)) {
-                res = res.map(e => e[v.mapData])
-            }
-            returnRes = {
-                ...returnRes,
-                [v?.name]: res
-            }
-        })
-        return returnRes
-    }
+  if (data.type === 1) {
+    let res2 = await interfaceRequest(data)
+    let returnRes = {}
+    method?.mappingArr?.forEach(v => {
+      let res = res2.data
+      for (let i of (v?.region || [])) {
+        if (res[i]) {
+          res = res[i]
+        } else {
+          res = null
+          return
+        }
+      }
+      if (v?.isArray && v?.mapData && Array.isArray(res)) {
+        res = res.map(e => e[v.mapData])
+      }
+      returnRes = {
+        ...returnRes,
+        [v?.name]: res
+      }
+    })
+    return returnRes
+  }
 
-    if (data.type === 2) {
-        let res2 = await getHistoryData({
-            deviceModeId: data.deviceModeId,
-            functionIdentifier: data.functionIdentifier ,
-            interval: data.interval,
-            "sceneId": 144,
-            "deviceId": data.deviceId,
-            startTime: data.startTime,
-            endTime: data.endTime,
-            intervalType: 1 || data.intervalType,
-        })
-        let returnRes = {}
-        method?.mappingArr?.forEach(v => {
-            let res = res2.data
-            for (let i of (v?.region || [])) {
-                if (res[i]) {
-                    res = res[i]
-                } else {
-                    res = null
-                    return
-                }
-            }
-            if (v?.isArray && v?.mapData && Array.isArray(res)) {
-                res = res.map(e => e[v.mapData])
-            }
-            returnRes = {
-                ...returnRes,
-                [v?.name]: res
-            }
-        })
-        return returnRes
+  if (data.type === 2) {
+    let res2 = await getHistoryData({
+      deviceModeId: data.deviceModeId,
+      functionIdentifier: data.functionIdentifier,
+      interval: data.interval,
+      "sceneId": 144,
+      "deviceId": data.deviceId,
+      startTime: data.startTime,
+      endTime: data.endTime,
+      intervalType: 1 || data.intervalType,
+    })
+    console.log('datadata', data.interval)
+    if (data.interval === '5') {
+      res2.data.groupDeviceData.dataList = res2.data.groupDeviceData.dataList.map(e => {
+        return {...e, time: parseTime(e.time, '{y}-{m}')}
+      })
+    } else if (data.interval === '4' || data.interval === '3') {
+      res2.data.groupDeviceData.dataList = res2.data.groupDeviceData.dataList.map(e => {
+        return {...e, time: parseTime(e.time, '{y}-{m}-{d}')}
+      })
+    }else{
+      res2.data.groupDeviceData.dataList = res2.data.groupDeviceData.dataList.map(e => {
+        return {...e, time: parseTime(e.time, '{y}-{m}-{d} {h}:{i}:{s}')}
+      })
     }
+    let returnRes = {}
+    method?.mappingArr?.forEach(v => {
+      let res = res2.data
+      for (let i of (v?.region || [])) {
+        if (res[i]) {
+          res = res[i]
+        } else {
+          res = null
+          return
+        }
+      }
+      if (v?.isArray && v?.mapData && Array.isArray(res)) {
+        res = res.map(e => e[v.mapData])
+      }
+      returnRes = {
+        ...returnRes,
+        [v?.name]: res
+      }
+    })
+    return returnRes
+  }
 }
 
 
 const detectingNullValues = (obj, keys) => {
-    let data = obj
-    if (keys.length > 1) {
-        if (!data[keys[0]]) {
-            if (typeof keys[1] === 'string') {
-                Vue.set(data, keys[0], {})
-                detectingNullValues(data[keys[0]], keys.slice(1))
-            }
-            if (typeof keys[1] === 'number') {
-                Vue.set(data, keys[0], [])
-                detectingNullValues(data[keys[0]], keys.slice(1))
-            }
-        } else {
-            detectingNullValues(data[keys[0]], keys.slice(1))
-        }
+  let data = obj
+  if (keys.length > 1) {
+    if (!data[keys[0]]) {
+      if (typeof keys[1] === 'string') {
+        Vue.set(data, keys[0], {})
+        detectingNullValues(data[keys[0]], keys.slice(1))
+      }
+      if (typeof keys[1] === 'number') {
+        Vue.set(data, keys[0], [])
+        detectingNullValues(data[keys[0]], keys.slice(1))
+      }
+    } else {
+      detectingNullValues(data[keys[0]], keys.slice(1))
     }
-    return data
+  }
+  return data
 }
 
 const GetFinalData = async (requests) => {
-    let requestArr = []
-    requests.forEach(e => {
-        if (e.type === 'network') {
-            requestArr.push(mappingFunction(e, e.mappingForm))
-        }
-    })
-    return Promise.all(requestArr).then(e => {
-        let data = {}
-        e.forEach(v => {
-            data = {
-                ...data,
-                ...v
-            }
-        })
-        return data
+  let requestArr = []
+  requests.forEach(e => {
+    if (e.type === 'network') {
+      requestArr.push(mappingFunction(e, e.mappingForm))
+    }
+  })
+  return Promise.all(requestArr).then(e => {
+    let data = {}
+    e.forEach(v => {
+      data = {
+        ...data,
+        ...v
+      }
     })
+    return data
+  })
 }
 
 const limitSolve = (type, e) => {
-    switch (type) {
-        case 0:
-            if (e.data2) {
-                return e.data3
-            } else if (e.data1 >= 100) {
-                return 100
-            } else if (e.data1 <= 0) {
-                return 0
-            } else {
-                return e.data1
-            }
-        case 1:
-            if (e.data1 >= 100) {
-                return 100
-            } else if (e.data1 <= 0) {
-                return 0
-            } else {
-                return e.data1
-            }
-    }
+  switch (type) {
+    case 0:
+      if (e.data2) {
+        return e.data3
+      } else if (e.data1 >= 100) {
+        return 100
+      } else if (e.data1 <= 0) {
+        return 0
+      } else {
+        return e.data1
+      }
+    case 1:
+      if (e.data1 >= 100) {
+        return 100
+      } else if (e.data1 <= 0) {
+        return 0
+      } else {
+        return e.data1
+      }
+  }
 }
 const parseData = (str, data) => {
-    let data1 = str.substring(2, str.length - 2)
-    let keys = data1.split('.')
-    let dataRow = data
-    keys.forEach(e => {
-        if (dataRow && dataRow !== void 0) {
-            dataRow = dataRow[e]
-        }
-    })
-    return dataRow
+  let data1 = str.substring(2, str.length - 2)
+  let keys = data1.split('.')
+  let dataRow = data
+  keys.forEach(e => {
+    if (dataRow && dataRow !== void 0) {
+      dataRow = dataRow[e]
+    }
+  })
+  return dataRow
 }
 const clearObjNull = (e, data1) => {
-    let obj = {}
-    for (const key in e) {
-        if (e.hasOwnProperty(key)) {
-            if (e[key] === null || (e[key] === void 0) || e[key] === '') {
-            } else if (e[key]?.constructor === Object) {
-                let data = clearObjNull(e[key], data1)
-                if (data) {
-                    obj[key] = data
-                }
-            } else if (Array.isArray(e[key])) {
-                let data = clearArrNull(e[key], data1)
-                if (data) {
-                    obj[key] = data
-                }
-            } else {
-                let v = e[key]
-                if (typeof v === 'string' && v.startsWith('{{') && v.endsWith('}}')) {
-                    obj[key] = parseData(v, data1)
-                } else {
-                    obj[key] = v
-                }
-            }
+  let obj = {}
+  for (const key in e) {
+    if (e.hasOwnProperty(key)) {
+      if (e[key] === null || (e[key] === void 0) || e[key] === '') {
+      } else if (e[key]?.constructor === Object) {
+        let data = clearObjNull(e[key], data1)
+        if (data) {
+          obj[key] = data
         }
+      } else if (Array.isArray(e[key])) {
+        let data = clearArrNull(e[key], data1)
+        if (data) {
+          obj[key] = data
+        }
+      } else {
+        let v = e[key]
+        if (typeof v === 'string' && v.startsWith('{{') && v.endsWith('}}')) {
+          obj[key] = parseData(v, data1)
+        } else {
+          obj[key] = v
+        }
+      }
     }
-    return Object.keys(obj).length === 0 ? null : obj
+  }
+  return Object.keys(obj).length === 0 ? null : obj
 }
 const clearArrNull = (e, data1) => {
-    if (!Array.isArray(e)) {
-        return null
+  if (!Array.isArray(e)) {
+    return null
+  }
+  let arr = []
+  e.forEach(v => {
+    if (v === null || (v === void 0) || v === '') {
+    } else if (v?.constructor === Object) {
+      let data = clearObjNull(v, data1)
+      if (data) {
+        arr.push(data)
+      }
+    } else if (Array.isArray(v)) {
+      let data = clearArrNull(v, data1)
+      if (data) {
+        arr.push(data)
+      }
+    } else {
+      if (typeof v === 'string' && v.startsWith('{{') && v.endsWith('}}')) {
+        arr.push(parseData(v, data1))
+      } else {
+        arr.push(v)
+      }
     }
-    let arr = []
-    e.forEach(v => {
-        if (v === null || (v === void 0) || v === '') {
-        } else if (v?.constructor === Object) {
-            let data = clearObjNull(v, data1)
-            if (data) {
-                arr.push(data)
-            }
-        } else if (Array.isArray(v)) {
-            let data = clearArrNull(v, data1)
-            if (data) {
-                arr.push(data)
-            }
-        } else {
-            if (typeof v === 'string' && v.startsWith('{{') && v.endsWith('}}')) {
-                arr.push(parseData(v, data1))
-            } else {
-                arr.push(v)
-            }
-        }
-    })
-    return arr.length === 0 ? null : arr
+  })
+  return arr.length === 0 ? null : arr
 }
 const clearNull = (e, data) => {
-    if (typeof e === 'string' && e.startsWith('{{') && e.endsWith('}}')) {
-        return parseData(e, data)
-    }
-    if (e?.constructor === Object) {
-        return clearObjNull(e, data)
-    } else if (Array.isArray(e)) {
-        return clearArrNull(e, data)
-    } else {
-        return e
-    }
+  if (typeof e === 'string' && e.startsWith('{{') && e.endsWith('}}')) {
+    return parseData(e, data)
+  }
+  if (e?.constructor === Object) {
+    return clearObjNull(e, data)
+  } else if (Array.isArray(e)) {
+    return clearArrNull(e, data)
+  } else {
+    return e
+  }
 }
 
 const parseTime = (time, pattern) => {
-    if (arguments.length === 0 || !time) {
-        return null
+  if (arguments.length === 0 || !time) {
+    return null
+  }
+  const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
+  let date
+  if (typeof time === 'object') {
+    date = time
+  } else {
+    if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
+      time = parseInt(time)
+    } else if (typeof time === 'string') {
+      time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
     }
-    const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
-    let date
-    if (typeof time === 'object') {
-        date = time
-    } else {
-        if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
-            time = parseInt(time)
-        } else if (typeof time === 'string') {
-            time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
-        }
-        if ((typeof time === 'number') && (time.toString().length === 10)) {
-            time = time * 1000
-        }
-        date = new Date(time)
+    if ((typeof time === 'number') && (time.toString().length === 10)) {
+      time = time * 1000
     }
-    const formatObj = {
-        y: date.getFullYear(),
-        m: date.getMonth() + 1,
-        d: date.getDate(),
-        h: date.getHours(),
-        i: date.getMinutes(),
-        s: date.getSeconds(),
-        a: date.getDay()
+    date = new Date(time)
+  }
+  const formatObj = {
+    y: date.getFullYear(),
+    m: date.getMonth() + 1,
+    d: date.getDate(),
+    h: date.getHours(),
+    i: date.getMinutes(),
+    s: date.getSeconds(),
+    a: date.getDay()
+  }
+  const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
+    let value = formatObj[key]
+    // Note: getDay() returns 0 on Sunday
+    if (key === 'a') {
+      return ['日', '一', '二', '三', '四', '五', '六'][value]
     }
-    const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
-        let value = formatObj[key]
-        // Note: getDay() returns 0 on Sunday
-        if (key === 'a') {
-            return ['日', '一', '二', '三', '四', '五', '六'][value]
-        }
-        if (result.length > 0 && value < 10) {
-            value = '0' + value
-        }
-        return value || 0
-    })
-    return time_str
+    if (result.length > 0 && value < 10) {
+      value = '0' + value
+    }
+    return value || 0
+  })
+  return time_str
 }
 
 const getFinalData = async (e) => {
-    let requestArr = []
-    e.forEach((i, k) => {
-        requestArr.push(mappingFunction(i, i.mappingForm))
-    })
-    return Promise.all(requestArr).then(i => {
-        let data = {}
-        i.forEach(v => {
-            data = {
-                ...data,
-                ...v
-            }
-        })
-        return data
+  let requestArr = []
+  e.forEach((i, k) => {
+    requestArr.push(mappingFunction(i, i.mappingForm))
+  })
+  return Promise.all(requestArr).then(i => {
+    let data = {}
+    i.forEach(v => {
+      data = {
+        ...data,
+        ...v
+      }
     })
+    return data
+  })
 }
 const testColor = (color) => {
-    const regexHex = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i;
-    const regexRgb = /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/;
-    const regexRgba = /^rgba\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3}),\s*([0-9]*\.?[0-9]+)\)$/;
+  const regexHex = /^#([0-9a-f]{3}|[0-9a-f]{6})$/i;
+  const regexRgb = /^rgb\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})\)$/;
+  const regexRgba = /^rgba\((\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3}),\s*([0-9]*\.?[0-9]+)\)$/;
 
-    return regexHex.test(color) || regexRgb.test(color) || regexRgba.test(color);
+  return regexHex.test(color) || regexRgb.test(color) || regexRgba.test(color);
 }
 export {
-    limitSolve,
-    parseData,
-    clearObjNull,
-    clearArrNull,
-    clearNull,
-    detectingNullValues,
-    getFinalData,
-    parseTime,
-    testColor
+  limitSolve,
+  parseData,
+  clearObjNull,
+  clearArrNull,
+  clearNull,
+  detectingNullValues,
+  getFinalData,
+  parseTime,
+  testColor
 }
diff --git a/ruoyi-ui/src/views/sceneView/index.vue b/ruoyi-ui/src/views/sceneView/index.vue
index dbe5180..ef8dfe0 100644
--- a/ruoyi-ui/src/views/sceneView/index.vue
+++ b/ruoyi-ui/src/views/sceneView/index.vue
@@ -2,7 +2,7 @@
   <div style="width: 100vw;height: 100vh;overflow:auto;" class="container">
     <div class="bindComponents" ref="container">
       <div ref="scene" class="scene"
-           :style="`width:${pageData.width?( pageData.width -1 +'px'):'100%'};height:${pageData.height?( pageData.height - 1+'px'):'100%'};background-image:url(${pageCfg.bg})`">
+           :style="`width:${pageData.width?( pageData.width -1 +'px'):'100%'};height:${pageData.height?( pageData.height - 1+'px'):'100%'};${pageCfg.isBgImg? `background-image:url(${pageCfg.bg})`:`background-color:${pageCfg.bg}`}`">
         <component :is="sceneData.center" :viewFlag="true" :styleData="pageCfg.styleData"
                    :tree="sceneData.centerChildren"></component>
       </div>
diff --git a/ruoyi-ui/src/views/system/layoutEdit.vue b/ruoyi-ui/src/views/system/layoutEdit.vue
index f688a8c..d8e248f 100644
--- a/ruoyi-ui/src/views/system/layoutEdit.vue
+++ b/ruoyi-ui/src/views/system/layoutEdit.vue
@@ -153,7 +153,7 @@
       </div>
       <div class="bindComponents" ref="container">
         <div ref="scene" class="scene"
-             :style="`width:${pageData.width?( pageData.width+'px'):'100%'};height:${pageData.height?( pageData.height+'px'):'100%'};background-image:url(${pageCfg.bg})`">
+             :style="`width:${pageData.width?( pageData.width+'px'):'100%'};height:${pageData.height?( pageData.height+'px'):'100%'};${pageCfg.isBgImg? `background-image:url(${pageCfg.bg})`:`background-color:${pageCfg.bg}`}`">
           <component :is="bindComponentsData.sceneData.center "
                      :styleData="pageCfg.styleData"
                      :tree="bindComponentsData.sceneData.centerChildren"></component>
@@ -185,7 +185,17 @@
           </el-col>
         </el-form-item>
         <el-form-item label="画布背景" label-width="120px">
+          <el-switch
+            v-model="pageCfg.isBgImg"
+            active-color="#13ce66"
+            inactive-color="#ff4949"
+            active-text="图片"
+            inactive-text="纯色">
+          </el-switch>
+          <br>
+          <el-color-picker v-if="!pageCfg.isBgImg" v-model="pageCfg.bg"></el-color-picker>
           <el-upload
+            v-if="pageCfg.isBgImg"
             class="avatar-uploader"
             :action="(process.env.NODE_ENV === 'development'?'dev-api':'prod-api')+'/basic/hwTemplateAchieve/saveImage'"
             :headers="{
@@ -271,6 +281,7 @@ export default {
   },
   data() {
     return {
+      process,
       inputVisible: false,
       inputValue: '',
       inputVisible1: false,
diff --git a/ruoyi-ui/src/views/system/layoutModel.vue b/ruoyi-ui/src/views/system/layoutModel.vue
index 7b2f0ca..2c4b4b5 100644
--- a/ruoyi-ui/src/views/system/layoutModel.vue
+++ b/ruoyi-ui/src/views/system/layoutModel.vue
@@ -127,6 +127,7 @@ export default {
   },
   data() {
     return {
+      process,
       load: false,
       dialogTitle1: '',
       addModelDialog: false,
@@ -151,6 +152,9 @@ export default {
       tableData: []
     }
   },
+  created() {
+    this.process = process
+  },
   mounted() {
     this.queryModels()
   },