diff --git a/src/assets/images/bgs/equ.jpg b/src/assets/images/bgs/equ.jpg
new file mode 100644
index 00000000..573e1dd2
Binary files /dev/null and b/src/assets/images/bgs/equ.jpg differ
diff --git a/src/assets/images/bgs/pro1.jpg b/src/assets/images/bgs/pro1.jpg
new file mode 100644
index 00000000..79e518fc
Binary files /dev/null and b/src/assets/images/bgs/pro1.jpg differ
diff --git a/src/assets/images/bgs/pro2.jpg b/src/assets/images/bgs/pro2.jpg
new file mode 100644
index 00000000..d6f8d88e
Binary files /dev/null and b/src/assets/images/bgs/pro2.jpg differ
diff --git a/src/assets/images/bgs/switch.png b/src/assets/images/bgs/switch.png
new file mode 100644
index 00000000..721bdf42
Binary files /dev/null and b/src/assets/images/bgs/switch.png differ
diff --git a/src/views/home/components/provincial/Dialog/AllEquip-old.vue b/src/views/home/components/provincial/Dialog/AllEquip-old.vue
new file mode 100644
index 00000000..291c6809
--- /dev/null
+++ b/src/views/home/components/provincial/Dialog/AllEquip-old.vue
@@ -0,0 +1,516 @@
+<template>
+  <div>
+    <el-dialog
+      v-loading="isLoading"
+      :visible.sync="dialogVisible"
+      width="85%"
+      :modal="false"
+      class="dlg-box"
+    >
+      <div>
+        <!-- 自定义title -->
+        <i class="close-btn" @click="dialogVisible = false" />
+        <div class="dlg-title">全量装备</div>
+
+        <!-- 表单 -->
+        <el-form
+          v-show="showSearch"
+          :model="queryParams"
+          ref="queryForm"
+          size="small"
+          inline
+          label-width="110px"
+          @submit.native.prevent
+        >
+          <el-form-item label="装备范围" prop="deptName">
+            <el-select
+              v-model="queryParams.deptName"
+              placeholder="请选择"
+              clearable
+              :popper-append-to-body="false"
+              style="width: 240px"
+              @change="changeDept"
+            >
+              <el-option v-for="item in deptNameList" :key="item.area_code" :label="item.name" :value="item.area_code" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="产权单位" prop="propertyUnit">
+            <el-select
+              v-model="queryParams.propertyUnit"
+              placeholder="请选择"
+              clearable
+              :popper-append-to-body="false"
+              style="width: 240px"
+            >
+              <el-option
+                v-for="item in companyNameList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="专业" prop="major">
+            <el-select
+              v-model="queryParams.major"
+              placeholder="请选择"
+              clearable
+              :popper-append-to-body="false"
+              style="width: 240px"
+              @change="changeProType"
+            >
+              <el-option v-for="item in proTypeList" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="装备类目" prop="deviceSeries">
+            <el-cascader
+              popper-class="my-cas"
+              v-model="deviceSeries"
+              :options="deviceSeriesList"
+              clearable
+              @change="changeDeviceSeries"
+              style="width: 240px"
+            />
+          </el-form-item>
+          <el-form-item label="装备名称" prop="name">
+            <el-input v-model="queryParams.name" placeholder="请输入" clearable style="width: 240px" />
+          </el-form-item>
+          <el-form-item label="规格型号" prop="specificationModel">
+            <el-input v-model="queryParams.specificationModel" placeholder="请输入" clearable style="width: 240px" />
+          </el-form-item>
+          <el-form-item label="装备编号" prop="code">
+            <el-input v-model="queryParams.code" placeholder="请输入" clearable style="width: 240px" />
+          </el-form-item>
+          <el-form-item label="装备原始编码" prop="originalCode">
+            <el-input v-model="queryParams.originalCode" placeholder="请输入" clearable style="width: 240px" />
+          </el-form-item>
+          <el-form-item label="装备状态" prop="changeStatus">
+            <el-select
+              v-model="queryParams.changeStatus"
+              placeholder="请选择"
+              clearable
+              :popper-append-to-body="false"
+              style="width: 240px"
+            >
+              <el-option v-for="item in changeStatusList" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="所在项目" prop="onProject">
+            <el-select
+              v-model="queryParams.onProject"
+              placeholder="请选择"
+              clearable
+              :popper-append-to-body="false"
+              style="width: 240px"
+            >
+              <el-option
+                v-for="item in onProjectList"
+                :key="item.proCode"
+                :label="item.usingProject"
+                :value="item.proCode"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="装备厂家" prop="brand">
+            <el-input v-model="queryParams.brand" placeholder="请输入" clearable style="width: 240px" />
+            <!-- <el-select v-model="queryParams.brand" placeholder="请选择" clearable style="width: 240px">
+              <el-option v-for="item in brandList" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select> -->
+          </el-form-item>
+          <el-form-item label="出厂日期" prop="productionDate">
+            <el-date-picker
+              popper-class="my-date"
+              v-model="queryParams.productionDate"
+              type="date"
+              placeholder="请选择"
+              clearable
+              value-format="yyyy-MM-dd"
+              format="yyyy-MM-dd"
+              style="width: 240px"
+            />
+          </el-form-item>
+          <el-form-item label="使用年限" prop="maxServiceLifeYears">
+            <el-select
+              v-model="queryParams.maxServiceLifeYears"
+              placeholder="请选择"
+              clearable
+              :popper-append-to-body="false"
+              style="width: 240px"
+            >
+              <el-option v-for="item in workingHoursList" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="资产原值(万元)" prop="originalValue">
+            <el-input v-model="queryParams.originalValue" placeholder="请输入" clearable style="width: 240px" />
+          </el-form-item>
+          <el-form-item label="下次检测日期" prop="nextMaintenanceDate">
+            <el-date-picker
+              popper-class="my-date"
+              v-model="queryParams.nextMaintenanceDate"
+              type="date"
+              placeholder="请选择"
+              clearable
+              value-format="yyyy-MM-dd"
+              format="yyyy-MM-dd"
+              style="width: 240px"
+            />
+          </el-form-item>
+          <el-form-item label="特征项" prop="featureItem">
+            <el-input v-model="queryParams.featureItem" placeholder="请输入" clearable style="width: 240px" />
+          </el-form-item>
+          <el-form-item label="特征值" prop="featureValue">
+            <el-input v-model="queryParams.featureValue" placeholder="请输入" clearable style="width: 240px" />
+            <!-- <el-select v-model="queryParams.featureValue" placeholder="请选择" clearable style="width: 240px">
+              <el-option v-for="item in featureValueList" :key="item.value" :label="item.label" :value="item.value" />
+            </el-select> -->
+          </el-form-item>
+
+          <!-- 表单按钮 -->
+          <el-form-item>
+            <el-button icon="el-icon-refresh" @click="handleReset" class="btn">重置</el-button>
+            <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
+          </el-form-item>
+        </el-form>
+
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <!-- <el-button class="btn" plain icon="el-icon-download" size="mini" @click="handleExport">导出数据</el-button> -->
+          </el-col>
+          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" />
+        </el-row>
+
+        <el-table
+          v-loading="isLoading"
+          :data="tableList"
+          stripe
+          highlight-current-row
+          style="width: 100%"
+          height="546"
+          class="table-container"
+        >
+          <el-table-column
+            type="index"
+            width="55"
+            label="序号"
+            align="center"
+            :index="(index) => (queryParams.pageNum - 1) * queryParams.pageSize + index + 1"
+          />
+          <el-table-column
+            v-for="(column, index) in tableColumns"
+            show-overflow-tooltip
+            :key="index"
+            :label="column.label"
+            :prop="column.prop"
+            align="center"
+          >
+            <template v-slot="{ row }" v-if="column.prop === 'featureItem'">
+              <span>{{ getFeatureItem(row.propertyVoList) }}</span>
+            </template>
+            <template v-slot="{ row }" v-else-if="column.prop === 'featureValue'">
+              <span>{{ getFeatureValue(row.propertyVoList) }}</span>
+            </template>
+          </el-table-column>
+          <!-- 操作 -->
+          <!-- <el-table-column label="操作" align="center" width="130">
+            <template slot-scope="{ row }">
+              <el-button type="text" size="mini" @click="" style="color: #409eff">查看详情</el-button>
+            </template>
+          </el-table-column> -->
+        </el-table>
+
+        <!-- 分页 -->
+        <pagination
+
+          :total="total"
+          :page.sync="queryParams.pageNum"
+          :limit.sync="queryParams.pageSize"
+          @pagination="getList"
+        />
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { getDeviceListAPI } from '@/api/EquipmentLedger'
+import { getAddressApi, getDeptApi, getMaTypeApi, getFirstLevelApi, getProListApi } from '@/api/wsScreen'
+
+export default {
+  data() {
+    return {
+      isLoading: false,
+      dialogVisible: false,
+      showSearch: true,
+      deviceSeries: [],
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        deptName: '', // 装备范围
+        propertyUnit: '', // 地市公司
+        name: '', // 装备名称
+        deviceSeries: '', // 装备系列
+        code: '', // 装备编号
+        changeStatus: '', // 装备状态
+        onProject: '', // 所在项目
+        purchaseDate: '', // 采购日期
+        productionDate: '', // 出厂日期
+        maxServiceLifeYears: '', // 使用年限
+        propertyUnit: '', // 产权单位
+        brand: '', // 生产厂家
+        originalValue: '', // 资产原值
+        nextMaintenanceDate: '', // 下次检测日期
+        featureItem: '', // 特征项
+        featureValue: '', // 特征值
+      },
+      deptNameList: [],
+      companyNameList: [],
+      deviceSeriesList: [],
+      changeStatusList: [
+        { label: '在库', value: 1 },
+        { label: '自用', value: 2 },
+        { label: '共享', value: 3 },
+        { label: '退役', value: 4 },
+        { label: '维修', value: 5 },
+      ],
+      proTypeList: [],
+      onProjectList: [],
+      workingHoursList: [
+        { label: '5年', value: 1 },
+        { label: '5-10年', value: 2 },
+        { label: '10年以上', value: 3 },
+      ],
+      companyNameList: [
+        { label: '单位1', value: 1 },
+        { label: '单位2', value: 2 },
+      ],
+      brandList: [
+        { label: '单位1', value: 1 },
+        { label: '单位2', value: 2 },
+      ],
+      buyPriceList: [
+        { label: '原值1', value: 1 },
+        { label: '原值2', value: 2 },
+      ],
+      featureValueList: [
+        { label: '特征1', value: 1 },
+        { label: '特征2', value: 2 },
+      ],
+
+      tableColumns: [
+        { label: '公司名称', prop: 'propertyUnit' },
+        { label: '产权单位', prop: 'propertyUnit' },
+        { label: '专业', prop: 'major' },
+        { label: '主工序', prop: 'mainProcess' },
+        { label: '子工序', prop: 'subProcess' },
+        { label: '装备大类', prop: 'mainCategory' },
+        { label: '装备小类', prop: 'subCategory' },
+        { label: '类型分支', prop: 'branch' },
+        { label: '装备名称', prop: 'name' },
+        { label: '规格型号', prop: 'specificationModel' },
+        { label: '装备编号', prop: 'code' },
+        { label: '计量单位', prop: 'unit' },
+        { label: '所在项目', prop: 'usingProject' },
+        { label: '使用到期时间', prop: 'expirationTime' },
+        { label: '装备原始编码', prop: 'originalCode' },
+        { label: '出厂日期', prop: 'productionDate' },
+        { label: '生产厂家', prop: 'manufacturer' },
+        { label: '资产原值', prop: 'originalValue' },
+        { label: '下次维保日期', prop: 'nextMaintenanceDate' },
+        { label: '最大使用年限 (年)', prop: 'maxServiceLifeYears' },
+        { label: '特征项', prop: 'featureItem' },
+        { label: '特征值', prop: 'featureValue' },
+      ],
+      tableList: [],
+      total: 0,
+    }
+  },
+  created() {},
+  methods: {
+    openDialog() {
+      this.dialogVisible = true
+      this.getList()
+      this.getDeptNameList()
+      this.getProTypeList()
+      this.getOnProjectList()
+    },
+    async getList() {
+      try {
+        const res = await getDeviceListAPI(this.queryParams)
+        console.log('🚀 ~ getList ~ res:', res)
+        this.tableList = res.data?.rows || []
+        this.total = res.data?.total || 0
+      } catch (error) {
+        console.log('🚀 ~ getList ~ error:', error)
+      }
+    },
+    // 查询
+    handleQuery() {
+      this.queryParams.pageNum = 1
+      this.getList()
+    },
+    // 重置
+    handleReset() {
+      this.$refs.queryForm.resetFields()
+      this.queryParams.pageNum = 1
+      this.queryParams.pageSize = 10
+      this.getList()
+    },
+    // 拼接特征项
+    getFeatureItem(item) {
+      if (!item || item.length == 0) return ''
+      return item.map((item) => item.propertyName).join(',')
+    },
+    // 拼接特征值
+    getFeatureValue(item) {
+      if (!item || item.length == 0) return ''
+      return item.map((item) => item.propertyValue).join(',')
+    },
+    // 装备范围
+    async getDeptNameList() {
+      try {
+        const res = await getAddressApi()
+        console.log('🚀 ~ getDeptNameList ~ res:', res)
+        this.deptNameList = res.data || []
+      } catch (error) {
+        console.log('🚀 ~ getDeptNameList ~ error:', error)
+      }
+    },
+    // 转换为树结构
+    convertToSubTree(list) {
+      const map = {}
+      const tree = []
+
+      // 构建节点映射
+      list.forEach((item) => {
+        map[item.value] = {
+          value: item.value.toString(),
+          label: item.label,
+        }
+      })
+
+      // 构建树形关系
+      list.forEach((item) => {
+        const current = map[item.value]
+        const parent = map[item.parentId]
+
+        if (parent) {
+          if (!parent.children) {
+            parent.children = []
+          }
+          parent.children.push(current)
+        } else {
+          tree.push(current)
+        }
+      })
+
+      return tree
+    },
+    changeDept(val) {
+      if (val) {
+        this.getCompanyNameList(val)
+      } else {
+        this.companyNameList = []
+        this.queryParams.propertyUnit = ''
+      }
+    },
+    // 地市公司
+    async getCompanyNameList(code) {
+      console.log('🚀 ~ getCompanyNameList ~ code:', code)
+      try {
+        const res = await getDeptApi({ code })
+        console.log('🚀 ~ getCompanyNameList ~ res:', res)
+        this.companyNameList = res.data || []
+      } catch (error) {
+        console.log('🚀 ~ getCompanyNameList ~ error:', error)
+      }
+    },
+    // 装备类目
+    async getDeviceSeriesList(firstLevelId) {
+      try {
+        const res = await getMaTypeApi({ firstLevelId })
+        console.log('🚀 ~ getMaTypeApi ~ res:', res)
+        this.deviceSeriesList = this.convertToSubTree(res.data) || []
+      } catch (error) {
+        console.log('🚀 ~ getMaTypeApi ~ error:', error)
+      }
+    },
+    changeDeviceSeries(val) {
+      console.log('🚀 ~ changeDeviceSeries ~ val:', val)
+      if (!val) {
+        this.queryParams.deviceSeries == ''
+        return
+      }
+      this.queryParams.deviceSeries = val[val.length - 1]
+    },
+    // 工程专业
+    async getProTypeList() {
+      try {
+        const res = await getFirstLevelApi()
+        this.proTypeList = res.data || []
+      } catch (error) {
+        console.log('🚀 ~ getProTypeList ~ error:', error)
+      }
+    },
+    changeProType(val) {
+      console.log('🚀 ~ changeProType ~ val:', val)
+      this.deviceSeries = []
+      if (val) {
+        this.getDeviceSeriesList(val)
+      } else {
+        this.deviceSeriesList = []
+        this.queryParams.deviceSeries = ''
+      }
+    },
+    // 所在项目
+    async getOnProjectList() {
+      try {
+        const res = await getProListApi()
+        this.onProjectList = res.data || []
+      } catch (error) {
+        console.log('🚀 ~ getOnProjectList ~ error:', error)
+      }
+    },
+    // 导出数据
+    handleExport() {
+      // 提示
+      this.$message({
+        type: 'warning',
+        message: '导出功能开发中，敬请期待！',
+      })
+      try {
+        let fileName = `导出_${formatTime(new Date())}.xLsx`
+        let url = '/material/backstage/costPush/exportPushCheck'
+        const params = { ...this.queryParams }
+        console.log('🚀 ~ 导出 ~ params:', params)
+        // this.derive(url, params, fileName)
+        // this.download(url, params, fileName)
+      } catch (error) {
+        console.log('导出数据失败', error)
+      }
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.dlg-box {
+  // position: absolute;
+  .close-btn {
+    width: 39px;
+    height: 39px;
+    position: absolute;
+    right: 0;
+    top: 0;
+    cursor: pointer;
+    // background-image: url('../../img/close.png');
+    // background-size: 100% 100%;
+  }
+  .dlg-title {
+    margin-top: -25px;
+    margin-bottom: 45px;
+    font-size: 21px;
+    text-align: center;
+    font-weight: 800;
+  }
+}
+</style>
diff --git a/src/views/home/components/provincial/Dialog/AllEquip.vue b/src/views/home/components/provincial/Dialog/AllEquip.vue
index 291c6809..9d4fd810 100644
--- a/src/views/home/components/provincial/Dialog/AllEquip.vue
+++ b/src/views/home/components/provincial/Dialog/AllEquip.vue
@@ -1,516 +1,488 @@
 <template>
   <div>
-    <el-dialog
-      v-loading="isLoading"
-      :visible.sync="dialogVisible"
-      width="85%"
-      :modal="false"
-      class="dlg-box"
-    >
+    <el-dialog v-loading="isLoading" :visible.sync="dialogVisible" width="85%" :modal="false">
       <div>
-        <!-- 自定义title -->
-        <i class="close-btn" @click="dialogVisible = false" />
-        <div class="dlg-title">全量装备</div>
-
-        <!-- 表单 -->
-        <el-form
-          v-show="showSearch"
-          :model="queryParams"
-          ref="queryForm"
-          size="small"
-          inline
-          label-width="110px"
-          @submit.native.prevent
-        >
-          <el-form-item label="装备范围" prop="deptName">
-            <el-select
-              v-model="queryParams.deptName"
-              placeholder="请选择"
-              clearable
-              :popper-append-to-body="false"
-              style="width: 240px"
-              @change="changeDept"
-            >
-              <el-option v-for="item in deptNameList" :key="item.area_code" :label="item.name" :value="item.area_code" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="产权单位" prop="propertyUnit">
-            <el-select
-              v-model="queryParams.propertyUnit"
-              placeholder="请选择"
-              clearable
-              :popper-append-to-body="false"
-              style="width: 240px"
-            >
-              <el-option
-                v-for="item in companyNameList"
-                :key="item.deptId"
-                :label="item.deptName"
-                :value="item.deptId"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="专业" prop="major">
-            <el-select
-              v-model="queryParams.major"
-              placeholder="请选择"
-              clearable
-              :popper-append-to-body="false"
-              style="width: 240px"
-              @change="changeProType"
-            >
-              <el-option v-for="item in proTypeList" :key="item.value" :label="item.label" :value="item.value" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="装备类目" prop="deviceSeries">
-            <el-cascader
-              popper-class="my-cas"
-              v-model="deviceSeries"
-              :options="deviceSeriesList"
-              clearable
-              @change="changeDeviceSeries"
-              style="width: 240px"
-            />
-          </el-form-item>
-          <el-form-item label="装备名称" prop="name">
-            <el-input v-model="queryParams.name" placeholder="请输入" clearable style="width: 240px" />
-          </el-form-item>
-          <el-form-item label="规格型号" prop="specificationModel">
-            <el-input v-model="queryParams.specificationModel" placeholder="请输入" clearable style="width: 240px" />
-          </el-form-item>
-          <el-form-item label="装备编号" prop="code">
-            <el-input v-model="queryParams.code" placeholder="请输入" clearable style="width: 240px" />
-          </el-form-item>
-          <el-form-item label="装备原始编码" prop="originalCode">
-            <el-input v-model="queryParams.originalCode" placeholder="请输入" clearable style="width: 240px" />
-          </el-form-item>
-          <el-form-item label="装备状态" prop="changeStatus">
-            <el-select
-              v-model="queryParams.changeStatus"
-              placeholder="请选择"
-              clearable
-              :popper-append-to-body="false"
-              style="width: 240px"
-            >
-              <el-option v-for="item in changeStatusList" :key="item.value" :label="item.label" :value="item.value" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="所在项目" prop="onProject">
-            <el-select
-              v-model="queryParams.onProject"
-              placeholder="请选择"
-              clearable
-              :popper-append-to-body="false"
-              style="width: 240px"
-            >
-              <el-option
-                v-for="item in onProjectList"
-                :key="item.proCode"
-                :label="item.usingProject"
-                :value="item.proCode"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="装备厂家" prop="brand">
-            <el-input v-model="queryParams.brand" placeholder="请输入" clearable style="width: 240px" />
-            <!-- <el-select v-model="queryParams.brand" placeholder="请选择" clearable style="width: 240px">
-              <el-option v-for="item in brandList" :key="item.value" :label="item.label" :value="item.value" />
-            </el-select> -->
-          </el-form-item>
-          <el-form-item label="出厂日期" prop="productionDate">
-            <el-date-picker
-              popper-class="my-date"
-              v-model="queryParams.productionDate"
-              type="date"
-              placeholder="请选择"
-              clearable
-              value-format="yyyy-MM-dd"
-              format="yyyy-MM-dd"
-              style="width: 240px"
-            />
-          </el-form-item>
-          <el-form-item label="使用年限" prop="maxServiceLifeYears">
-            <el-select
-              v-model="queryParams.maxServiceLifeYears"
-              placeholder="请选择"
-              clearable
-              :popper-append-to-body="false"
-              style="width: 240px"
-            >
-              <el-option v-for="item in workingHoursList" :key="item.value" :label="item.label" :value="item.value" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="资产原值(万元)" prop="originalValue">
-            <el-input v-model="queryParams.originalValue" placeholder="请输入" clearable style="width: 240px" />
-          </el-form-item>
-          <el-form-item label="下次检测日期" prop="nextMaintenanceDate">
-            <el-date-picker
-              popper-class="my-date"
-              v-model="queryParams.nextMaintenanceDate"
-              type="date"
-              placeholder="请选择"
-              clearable
-              value-format="yyyy-MM-dd"
-              format="yyyy-MM-dd"
-              style="width: 240px"
-            />
-          </el-form-item>
-          <el-form-item label="特征项" prop="featureItem">
-            <el-input v-model="queryParams.featureItem" placeholder="请输入" clearable style="width: 240px" />
-          </el-form-item>
-          <el-form-item label="特征值" prop="featureValue">
-            <el-input v-model="queryParams.featureValue" placeholder="请输入" clearable style="width: 240px" />
-            <!-- <el-select v-model="queryParams.featureValue" placeholder="请选择" clearable style="width: 240px">
-              <el-option v-for="item in featureValueList" :key="item.value" :label="item.label" :value="item.value" />
-            </el-select> -->
-          </el-form-item>
-
-          <!-- 表单按钮 -->
-          <el-form-item>
-            <el-button icon="el-icon-refresh" @click="handleReset" class="btn">重置</el-button>
-            <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
-          </el-form-item>
-        </el-form>
-
-        <el-row :gutter="10" class="mb8">
-          <el-col :span="1.5">
-            <!-- <el-button class="btn" plain icon="el-icon-download" size="mini" @click="handleExport">导出数据</el-button> -->
-          </el-col>
-          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" />
-        </el-row>
+        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px">
+          <div class="title-tip">
+            <!-- <i class="el-icon-reading icon-tip" /> -->
+            <span>装备总览</span>
+          </div>
+          <div style="display: flex; justify-content: space-between; align-items: center">
+            <el-button type="primary" size="mini" @click="handleActive">图表分析</el-button>
+            <i class="el-icon-download icon-tip" style="margin-left: 10px; cursor: pointer" @click="handleExport" />
+          </div>
+        </div>
 
         <el-table
+          v-if="activeTab"
           v-loading="isLoading"
           :data="tableList"
-          stripe
           highlight-current-row
+          border
+          stripe
           style="width: 100%"
-          height="546"
-          class="table-container"
+          height="555"
         >
-          <el-table-column
-            type="index"
-            width="55"
-            label="序号"
-            align="center"
-            :index="(index) => (queryParams.pageNum - 1) * queryParams.pageSize + index + 1"
-          />
+          <el-table-column type="index" width="55" label="序号" align="center" />
           <el-table-column
             v-for="(column, index) in tableColumns"
             show-overflow-tooltip
             :key="index"
             :label="column.label"
             :prop="column.prop"
+            :sortable="column.sortable || false"
             align="center"
           >
-            <template v-slot="{ row }" v-if="column.prop === 'featureItem'">
-              <span>{{ getFeatureItem(row.propertyVoList) }}</span>
+            <template #header v-if="column.sortable">
+              <span class="custom-header">
+                {{ column.label }}
+                <i class="el-icon-sort" style="color: #fff" />
+              </span>
             </template>
-            <template v-slot="{ row }" v-else-if="column.prop === 'featureValue'">
-              <span>{{ getFeatureValue(row.propertyVoList) }}</span>
+            <!-- 表格列插槽：单独处理装备总数、工具总数 -->
+            <template #default="scope">
+              <!-- 装备总数：非0/非空变色 + 跳转 -->
+              <div v-if="column.prop === 'maNum'" class="table-active-color" style="cursor: pointer; user-select: none">
+                {{ scope.row.maNum }}
+              </div>
+              <div
+                v-else-if="column.prop === 'maCost'"
+                class="table-active-color"
+                style="cursor: pointer; user-select: none"
+              >
+                {{ scope.row.maCost }}
+              </div>
+              <!-- 其他列保持原样 -->
+              <div v-else>
+                {{ scope.row[column.prop] }}
+              </div>
             </template>
           </el-table-column>
-          <!-- 操作 -->
-          <!-- <el-table-column label="操作" align="center" width="130">
-            <template slot-scope="{ row }">
-              <el-button type="text" size="mini" @click="" style="color: #409eff">查看详情</el-button>
-            </template>
-          </el-table-column> -->
         </el-table>
-
-        <!-- 分页 -->
-        <pagination
-
-          :total="total"
-          :page.sync="queryParams.pageNum"
-          :limit.sync="queryParams.pageSize"
-          @pagination="getList"
-        />
+        <!-- 柱状图 -->
+        <div v-else ref="barRef" style="width: 100%; height: 550px; margin-top: 20px"></div>
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { getDeviceListAPI } from '@/api/EquipmentLedger'
-import { getAddressApi, getDeptApi, getMaTypeApi, getFirstLevelApi, getProListApi } from '@/api/wsScreen'
+import * as echarts from 'echarts'
+import { getDeviceByDept } from '@/api/basic/home'
 
 export default {
+  name: 'ProvincialCompany',
   data() {
     return {
-      isLoading: false,
       dialogVisible: false,
-      showSearch: true,
-      deviceSeries: [],
-      queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        deptName: '', // 装备范围
-        propertyUnit: '', // 地市公司
-        name: '', // 装备名称
-        deviceSeries: '', // 装备系列
-        code: '', // 装备编号
-        changeStatus: '', // 装备状态
-        onProject: '', // 所在项目
-        purchaseDate: '', // 采购日期
-        productionDate: '', // 出厂日期
-        maxServiceLifeYears: '', // 使用年限
-        propertyUnit: '', // 产权单位
-        brand: '', // 生产厂家
-        originalValue: '', // 资产原值
-        nextMaintenanceDate: '', // 下次检测日期
-        featureItem: '', // 特征项
-        featureValue: '', // 特征值
+      isLoading: false,
+      toolTotal: 60,
+      equipTotal: 50,
+      activeTab: true,
+      dataAll: {
+        maNum: 0,
+        maPercent: 0,
+        toolNum: 0,
+        toolPercent: 0,
+        totalSum: 0,
       },
-      deptNameList: [],
-      companyNameList: [],
-      deviceSeriesList: [],
-      changeStatusList: [
-        { label: '在库', value: 1 },
-        { label: '自用', value: 2 },
-        { label: '共享', value: 3 },
-        { label: '退役', value: 4 },
-        { label: '维修', value: 5 },
-      ],
-      proTypeList: [],
-      onProjectList: [],
-      workingHoursList: [
-        { label: '5年', value: 1 },
-        { label: '5-10年', value: 2 },
-        { label: '10年以上', value: 3 },
-      ],
-      companyNameList: [
-        { label: '单位1', value: 1 },
-        { label: '单位2', value: 2 },
-      ],
-      brandList: [
-        { label: '单位1', value: 1 },
-        { label: '单位2', value: 2 },
-      ],
-      buyPriceList: [
-        { label: '原值1', value: 1 },
-        { label: '原值2', value: 2 },
-      ],
-      featureValueList: [
-        { label: '特征1', value: 1 },
-        { label: '特征2', value: 2 },
-      ],
-
+      useData: {
+        availableNum: 0,
+        inNum: 0,
+        repairNum: 0,
+        scrapNum: 0,
+        shareNum: 0,
+      },
+      eventList: [],
+      timer: null,
+      speed: 60,
+      isHover: false,
       tableColumns: [
-        { label: '公司名称', prop: 'propertyUnit' },
-        { label: '产权单位', prop: 'propertyUnit' },
-        { label: '专业', prop: 'major' },
-        { label: '主工序', prop: 'mainProcess' },
-        { label: '子工序', prop: 'subProcess' },
-        { label: '装备大类', prop: 'mainCategory' },
-        { label: '装备小类', prop: 'subCategory' },
-        { label: '类型分支', prop: 'branch' },
-        { label: '装备名称', prop: 'name' },
-        { label: '规格型号', prop: 'specificationModel' },
-        { label: '装备编号', prop: 'code' },
-        { label: '计量单位', prop: 'unit' },
-        { label: '所在项目', prop: 'usingProject' },
-        { label: '使用到期时间', prop: 'expirationTime' },
-        { label: '装备原始编码', prop: 'originalCode' },
-        { label: '出厂日期', prop: 'productionDate' },
-        { label: '生产厂家', prop: 'manufacturer' },
-        { label: '资产原值', prop: 'originalValue' },
-        { label: '下次维保日期', prop: 'nextMaintenanceDate' },
-        { label: '最大使用年限 (年)', prop: 'maxServiceLifeYears' },
-        { label: '特征项', prop: 'featureItem' },
-        { label: '特征值', prop: 'featureValue' },
+        { label: '公司名称', prop: 'companyName' },
+        { label: '装备总数', prop: 'maNum', sortable: true },
+        { label: '线路装备数量', prop: 'lineNum' },
+        { label: '变电装备数量', prop: 'substationNum' },
+        { label: '电缆装备数量', prop: 'cableNum' },
+        { label: '装备总价值(万元)', prop: 'maCost', sortable: true },
       ],
       tableList: [],
-      total: 0,
     }
   },
-  created() {},
+  mounted() {},
+
   methods: {
     openDialog() {
       this.dialogVisible = true
       this.getList()
-      this.getDeptNameList()
-      this.getProTypeList()
-      this.getOnProjectList()
     },
     async getList() {
       try {
-        const res = await getDeviceListAPI(this.queryParams)
-        console.log('🚀 ~ getList ~ res:', res)
-        this.tableList = res.data?.rows || []
-        this.total = res.data?.total || 0
+        const res = await getDeviceByDept()
+        this.tableList = res.data
       } catch (error) {
-        console.log('🚀 ~ getList ~ error:', error)
+        console.log('🚀 ~ error:', error)
       }
     },
-    // 查询
-    handleQuery() {
-      this.queryParams.pageNum = 1
-      this.getList()
-    },
-    // 重置
-    handleReset() {
-      this.$refs.queryForm.resetFields()
-      this.queryParams.pageNum = 1
-      this.queryParams.pageSize = 10
-      this.getList()
-    },
-    // 拼接特征项
-    getFeatureItem(item) {
-      if (!item || item.length == 0) return ''
-      return item.map((item) => item.propertyName).join(',')
-    },
-    // 拼接特征值
-    getFeatureValue(item) {
-      if (!item || item.length == 0) return ''
-      return item.map((item) => item.propertyValue).join(',')
-    },
-    // 装备范围
-    async getDeptNameList() {
-      try {
-        const res = await getAddressApi()
-        console.log('🚀 ~ getDeptNameList ~ res:', res)
-        this.deptNameList = res.data || []
-      } catch (error) {
-        console.log('🚀 ~ getDeptNameList ~ error:', error)
+    handleActive() {
+      this.activeTab = !this.activeTab
+      if (!this.activeTab) {
+        this.$nextTick(() => {
+          this.initBarChart()
+        })
       }
     },
-    // 转换为树结构
-    convertToSubTree(list) {
-      const map = {}
-      const tree = []
-
-      // 构建节点映射
-      list.forEach((item) => {
-        map[item.value] = {
-          value: item.value.toString(),
-          label: item.label,
-        }
-      })
-
-      // 构建树形关系
-      list.forEach((item) => {
-        const current = map[item.value]
-        const parent = map[item.parentId]
-
-        if (parent) {
-          if (!parent.children) {
-            parent.children = []
-          }
-          parent.children.push(current)
-        } else {
-          tree.push(current)
-        }
-      })
-
-      return tree
-    },
-    changeDept(val) {
-      if (val) {
-        this.getCompanyNameList(val)
-      } else {
-        this.companyNameList = []
-        this.queryParams.propertyUnit = ''
-      }
-    },
-    // 地市公司
-    async getCompanyNameList(code) {
-      console.log('🚀 ~ getCompanyNameList ~ code:', code)
-      try {
-        const res = await getDeptApi({ code })
-        console.log('🚀 ~ getCompanyNameList ~ res:', res)
-        this.companyNameList = res.data || []
-      } catch (error) {
-        console.log('🚀 ~ getCompanyNameList ~ error:', error)
-      }
-    },
-    // 装备类目
-    async getDeviceSeriesList(firstLevelId) {
-      try {
-        const res = await getMaTypeApi({ firstLevelId })
-        console.log('🚀 ~ getMaTypeApi ~ res:', res)
-        this.deviceSeriesList = this.convertToSubTree(res.data) || []
-      } catch (error) {
-        console.log('🚀 ~ getMaTypeApi ~ error:', error)
-      }
-    },
-    changeDeviceSeries(val) {
-      console.log('🚀 ~ changeDeviceSeries ~ val:', val)
-      if (!val) {
-        this.queryParams.deviceSeries == ''
-        return
-      }
-      this.queryParams.deviceSeries = val[val.length - 1]
-    },
-    // 工程专业
-    async getProTypeList() {
-      try {
-        const res = await getFirstLevelApi()
-        this.proTypeList = res.data || []
-      } catch (error) {
-        console.log('🚀 ~ getProTypeList ~ error:', error)
-      }
-    },
-    changeProType(val) {
-      console.log('🚀 ~ changeProType ~ val:', val)
-      this.deviceSeries = []
-      if (val) {
-        this.getDeviceSeriesList(val)
-      } else {
-        this.deviceSeriesList = []
-        this.queryParams.deviceSeries = ''
-      }
-    },
-    // 所在项目
-    async getOnProjectList() {
-      try {
-        const res = await getProListApi()
-        this.onProjectList = res.data || []
-      } catch (error) {
-        console.log('🚀 ~ getOnProjectList ~ error:', error)
-      }
-    },
-    // 导出数据
     handleExport() {
-      // 提示
-      this.$message({
-        type: 'warning',
-        message: '导出功能开发中，敬请期待！',
-      })
-      try {
-        let fileName = `导出_${formatTime(new Date())}.xLsx`
-        let url = '/material/backstage/costPush/exportPushCheck'
-        const params = { ...this.queryParams }
-        console.log('🚀 ~ 导出 ~ params:', params)
-        // this.derive(url, params, fileName)
-        // this.download(url, params, fileName)
-      } catch (error) {
-        console.log('导出数据失败', error)
+      this.download('material-mall/index/export', {}, `装备对比_${new Date().getTime()}.xlsx`)
+    },
+    initBarChart() {
+      const barDom = this.$refs.barRef
+      const barChart = echarts.init(barDom)
+
+      const companyNames = this.tableList.map((item) => item.companyName)
+      const equipTotals = this.tableList.map((item) => item.maNum)
+      const toolTotals = this.tableList.map((item) => item.maCost)
+
+      // 双系列专用-固定刻度
+      const yAxisTicks = ['0', '200', '500', '1000', '10000', '100000', '200000+']
+      const yAxisValues = [0, 200, 500, 1000, 10000, 100000, 200000]
+
+      // 双系列数值映射（预计算映射后的数据）
+      const mapToStepHeight = (value) => {
+        let i = 0
+        while (i < yAxisValues.length - 1 && value > yAxisValues[i + 1]) i++
+        const rangeStart = yAxisValues[i]
+        const rangeEnd = yAxisValues[i + 1] || yAxisValues[i]
+        const ratio = (value - rangeStart) / (rangeEnd - rangeStart || 1)
+        return i + ratio
       }
+      const mappedEquipTotals = equipTotals.map(mapToStepHeight)
+      const mappedToolTotals = toolTotals.map(mapToStepHeight)
+
+      // ---------------------- 初始化图表 ----------------------
+      const initShowEquip = equipTotals.some((v) => v > 0)
+      const initShowTool = toolTotals.some((v) => v > 0)
+      const initShowBoth = initShowEquip && initShowTool
+
+      barChart.setOption(
+        {
+          tooltip: {
+            trigger: 'axis',
+            formatter: (params) => {
+              let res = `${params[0].name}<br/>`
+              params.forEach((p) => {
+                const val = p.seriesName === '装备总数' ? equipTotals[p.dataIndex] : toolTotals[p.dataIndex]
+                const unit = p.seriesName === '装备总数' ? '台' : '万元'
+                res += `${p.seriesName}: ${val}${unit}<br/>`
+              })
+              return res
+            },
+          },
+          // ✅ 永久双图例，永不消失
+          legend: {
+            top: 0,
+            right: 20,
+            data: ['装备总数', '总价值'],
+            selected: {
+              装备总数: initShowEquip,
+              总价值: initShowTool,
+            },
+          },
+          grid: { left: '3%', right: '3%', bottom: '3%', top: '15%', containLabel: true },
+          xAxis: {
+            type: 'category',
+            data: companyNames,
+            axisLabel: {
+              fontSize: 13,
+              interval: 0,
+              lineHeight: 16,
+              formatter: (name) => {
+                if (name.length <= 4) return name
+                let res = ''
+                for (let i = 0; i < Math.ceil(name.length / 4); i++) {
+                  res += name.substring(i * 4, (i + 1) * 4) + '\n'
+                }
+                return res
+              },
+            },
+          },
+          yAxis: initShowBoth
+            ? {
+                // 双系列-固定阶梯刻度
+                type: 'value',
+                name: '数量（台）',
+                nameTextStyle: { fontSize: 14 },
+                min: 0,
+                max: 6,
+                interval: 1,
+                axisLabel: { fontSize: 12, margin: 8, formatter: (idx) => yAxisTicks[Math.floor(idx)] },
+                splitLine: { lineStyle: { type: 'dashed', color: '#e0e0e0' } },
+              }
+            : {
+                // 单系列-原生线性轴
+                type: 'value',
+                name: '数量（台）',
+                nameTextStyle: { fontSize: 14 },
+              },
+          series: [
+            ...(initShowEquip
+              ? [
+                  {
+                    name: '装备总数',
+                    type: 'bar',
+                    barWidth: 20,
+                    barGap: '40%',
+                    barCategoryGap: '0%',
+                    itemStyle: {
+                      borderRadius: [50, 50, 0, 0],
+                      color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+                        { offset: 0, color: '#51ABF7' },
+                        { offset: 1, color: '#78C5FF' },
+                      ]),
+                    },
+                    data: initShowBoth ? mappedEquipTotals : equipTotals,
+                  },
+                ]
+              : []),
+            ...(initShowTool
+              ? [
+                  {
+                    name: '总价值',
+                    type: 'bar',
+                    barWidth: 20,
+                    barGap: '40%',
+                    barCategoryGap: '0%',
+                    itemStyle: {
+                      borderRadius: [50, 50, 0, 0],
+                      color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+                        { offset: 0, color: '#5EDDCA' },
+                        { offset: 1, color: '#32E1C6' },
+                      ]),
+                    },
+                    data: initShowBoth ? mappedToolTotals : toolTotals,
+                  },
+                ]
+              : []),
+          ],
+        },
+        true,
+      )
+
+      // ---------------------- 严格按你指定格式编写【核心修复Y轴不生效问题】 ----------------------
+      barChart.on('legendselectchanged', (params) => {
+        // 获取当前显示的系列
+        const selectedSeries = Object.keys(params.selected).filter((key) => params.selected[key])
+        // 判断是否同时显示两台系列
+        const showBothSeries = selectedSeries.length > 1
+
+        // ✅ 核心修复：单系列清空所有固定配置，强制线性轴生效
+        let newYAxisConfig
+        if (showBothSeries) {
+          // 双系列：固定阶梯刻度（完整配置）
+          newYAxisConfig = {
+            type: 'value',
+            name: '数量（台）',
+            nameTextStyle: { fontSize: 14 },
+            min: 0, // 固定最小值
+            max: 6, // 固定最大值
+            interval: 1, // 固定刻度间隔
+            axisTick: { show: true, alignWithLabel: true, length: 4 },
+            axisLabel: { fontSize: 12, margin: 8, formatter: (idx) => yAxisTicks[Math.floor(idx)] },
+            splitLine: { lineStyle: { type: 'dashed', color: '#e0e0e0' } },
+          }
+        } else {
+          // ✅ 单系列：彻底清空所有固定配置，强制原生线性轴【必生效】
+          newYAxisConfig = {
+            type: 'value',
+            name: '数量（台）',
+            nameTextStyle: { fontSize: 14 },
+            min: undefined, // 清空固定最小值
+            max: undefined, // 清空固定最大值
+            interval: undefined, // 清空固定间隔
+            axisLabel: {
+              // 清空自定义格式化，恢复原生数值显示
+              fontSize: 12,
+              margin: 8,
+              formatter: undefined,
+            },
+            splitLine: { lineStyle: { type: 'solid', color: '#e0e0e0' } },
+          }
+        }
+
+        // ✅ 关键：更新Y轴时添加 replaceMerge: true，强制覆盖旧配置（解决不生效核心）
+        barChart.setOption({ yAxis: newYAxisConfig }, { replaceMerge: ['yAxis'], silent: true })
+
+        // 更新系列数据
+        const newSeries = []
+        if (params.selected['装备总数']) {
+          newSeries.push({
+            name: '装备总数',
+            type: 'bar',
+            barWidth: 20,
+            barGap: '40%',
+            barCategoryGap: '0%',
+            itemStyle: {
+              borderRadius: [50, 50, 0, 0],
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+                { offset: 0, color: '#5470C6' },
+                { offset: 1, color: '#78A2FF' },
+              ]),
+            },
+            data: showBothSeries ? mappedEquipTotals : equipTotals,
+          })
+        }
+        if (params.selected['总价值']) {
+          newSeries.push({
+            name: '总价值',
+            type: 'bar',
+            barWidth: 20,
+            barGap: '40%',
+            barCategoryGap: '0%',
+            itemStyle: {
+              borderRadius: [50, 50, 0, 0],
+              color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+                { offset: 0, color: '#5EDDCA' },
+                { offset: 1, color: '#32E1C6' },
+              ]),
+            },
+            data: showBothSeries ? mappedToolTotals : toolTotals,
+          })
+        }
+        barChart.setOption({ series: newSeries })
+      })
     },
   },
 }
 </script>
 
 <style lang="scss" scoped>
-.dlg-box {
-  // position: absolute;
-  .close-btn {
-    width: 39px;
-    height: 39px;
-    position: absolute;
-    right: 0;
-    top: 0;
-    cursor: pointer;
-    // background-image: url('../../img/close.png');
-    // background-size: 100% 100%;
+.app-container {
+  background: #f2f2f2;
+}
+.top {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 20px;
+  margin-bottom: 10px;
+  .top-item {
+    width: 33%;
+    flex: 1;
   }
-  .dlg-title {
-    margin-top: -25px;
-    margin-bottom: 45px;
-    font-size: 21px;
-    text-align: center;
-    font-weight: 800;
+  .left-tip {
+    font-size: 13px;
+    background: #f5f5f5;
+    padding: 3px 10px;
+    border-radius: 5px;
+    color: #75787d;
   }
 }
+.card-box {
+  width: 100%;
+  border-radius: 15px;
+  height: 350px;
+}
+.card-box2 {
+  width: 100%;
+  border-radius: 15px;
+  min-height: 430px;
+}
+.title-tip {
+  font-weight: bold;
+  text-align: left;
+  font-size: 18px;
+  color: #333;
+}
+.icon-tip {
+  margin-right: 10px;
+  font-weight: 900;
+}
+::v-deep .card-box {
+  padding: 0 !important;
+}
+
+.content {
+  width: 100%;
+  margin-top: 20px;
+  display: flex;
+  gap: 20px;
+
+  .content-item {
+    flex: 1;
+    border-radius: 8px;
+    height: 90px;
+    /* background: #f3fbf8; */
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+
+    .line {
+      width: 4px;
+      height: 90px;
+      /* background: #79d1b8; */
+    }
+    .item-box {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      color: #75787d;
+      font-size: 13px;
+    }
+    .num {
+      margin-top: 10px;
+      font-size: 20px;
+      color: #333;
+      font-weight: 800;
+    }
+  }
+}
+
+.scroll-wrapper {
+  margin-top: 10px;
+  height: 300px;
+  overflow: hidden;
+  position: relative;
+}
+
+.scroll-list {
+  padding: 0;
+  margin: 0;
+  list-style: none;
+}
+.is-hover {
+  overflow: auto;
+}
+
+.scroll-list li {
+  padding: 8px 12px;
+  font-size: 14px;
+  transition: background 0.3s;
+}
+
+/* 隔行背景色 */
+.scroll-list li.odd {
+  background-color: #ebf8f3;
+}
+
+// 表格有效数值（非0/非空）的样式
+.table-active-color {
+  color: #2cbab2 !important; // 蓝色（可修改为你需要的颜色）
+  font-weight: 700 !important; // 加粗突出
+}
+
+// 鼠标悬浮时的过渡效果（可选）
+.table-active-color:hover {
+  color: #2cbab2 !important;
+  transition: color 0.2s ease;
+}
+/* 干掉原来的三角形 */
+::v-deep .caret-wrapper {
+  display: none;
+}
+
+::v-deep .el-table .el-table__header th {
+  background: linear-gradient(180deg, #00d2be 0%, #4eacff 100%) !important;
+  color: #fff !important;
+}
 </style>
diff --git a/src/views/rentStat/index.vue b/src/views/rentStat/index.vue
new file mode 100644
index 00000000..65e21eb7
--- /dev/null
+++ b/src/views/rentStat/index.vue
@@ -0,0 +1,16 @@
+<template>
+  <div>
+    <img src="@/assets/images/bgs/equ.jpg" style="width: 100%" alt="" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'RentStat',
+  data() {
+    return {}
+  },
+}
+</script>
+
+<style lang="scss" scoped></style>
diff --git a/src/views/system/proUseAnalysis/index.vue b/src/views/system/proUseAnalysis/index.vue
new file mode 100644
index 00000000..c67e7c68
--- /dev/null
+++ b/src/views/system/proUseAnalysis/index.vue
@@ -0,0 +1,30 @@
+<template>
+  <div>
+    <img v-if="showPro" src="@/assets/images/bgs/pro1.jpg" style="width: 100%" alt="" />
+    <img v-else src="@/assets/images/bgs/pro2.jpg" style="width: 100%" alt="" />
+    <img src="@/assets/images/bgs/switch.png" class="stitch" @click="showPro = !showPro" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'ProUseAnalysis',
+  data() {
+    return {
+      showPro: true,
+    }
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.stitch {
+  position: absolute;
+  top: 230px;
+  right: 40px;
+  width: 32px;
+  height: 32px;
+  cursor: pointer;
+  z-index: 1;
+}
+</style>