<template>
  <div class="cont">
    <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
      <el-tab-pane label="运营商平台" name="first">
        <div style="padding: 10px; height: calc(100% - 52px); overflow: auto">
          <el-table :data="tableData" border stripe style="width: 100%" height="calc(100% )">
            <el-table-column type="index" width="60" label="序号" align="center" />
            <el-table-column prop="name" label="平台名称" align="center" />
            <el-table-column prop="company" label="公司" align="center" />
            <el-table-column prop="city" label="城市" align="center" />
            <el-table-column prop="district" label="区县" align="center" />
            <el-table-column prop="ip" label="IP" align="center" />
            <el-table-column prop="platKey" label="平台公钥" align="center" />
            <el-table-column prop="ipcSystem" label="视频系统" align="center" />
            <!-- <el-table-column prop="lineState" label="在线状态" align="center" /> -->
            <el-table-column align="center" label="在线状态" width="90">
              <template #default="scope">
                <span v-if="scope.row.lineState == 'online'">在线</span>
                <span v-if="scope.row.lineState == 'offline'">离线</span>
              </template>
            </el-table-column>
            <el-table-column prop="useState" label="启用状态" align="center" />
            <el-table-column prop="user1Name" label="联系人" align="center" />
            <el-table-column prop="user1Phone" label="电话" align="center" />
            <el-table-column align="center" label="详情" width="90">
              <template #default="scope">
                <a-button type="link" @click="fileinfo1(scope.row)">查看</a-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </el-tab-pane>
      <el-tab-pane label="报警单位" name="second1">
        <div style="padding: 10px">
          <span style="color: rgba(0, 0, 0, 0.4392156863); margin-right: 10px">区域:</span>
          <!-- value: 'title', -->
          <a-tree-select
            v-model:value="form11.area"
            style="width: 200px"
            :dropdown-style="{maxHeight: '400px', overflow: 'auto'}"
            placeholder="请选择"
            allow-clear
            :tree-data="treedata"
            :labelInValue="false"
            :field-names="{
              children: 'children',
              value: 'code',
              label: 'title'
            }"
            tree-node-filter-prop="title"
          >
            <template #suffixIcon>
              <SmileOutlined />
            </template>
          </a-tree-select>
          <span style="color: rgba(0, 0, 0, 0.4392156863); margin-left: 10px; margin-right: 5px">业类型:</span>
          <el-select v-model="form11.yys" placeholder="请选择" style="width: 200px">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
          </el-select>
          <a-button type="primary" style="margin-left: 10px" @click="lodingbaojingdanwei">查询</a-button>
        </div>
        <div style="padding: 10px; height: calc(100% - 85px); overflow: auto">
          <el-table :data="tableData8" border style="width: 100%" height="650">
            <el-table-column type="index" width="60" label="序号" align="center" :index="indexMethod1" />
            <!-- <el-table-column prop="pointld" label="编号" align="center" /> -->
            <el-table-column prop="pointName" label="名字" align="center" />
            <el-table-column prop="pointAddress" label="地址" align="center" />
            <el-table-column prop="setupTime" label="安装时间" align="center" />
            <el-table-column prop="userName" label="联系人1" align="center" />
            <el-table-column prop="userPhone" label="联系人1电话" align="center" />
            <el-table-column prop="user2Name" label="联系人2" align="center" />
            <el-table-column prop="user2Phone" label="联系人2电话" align="center" />
            <el-table-column prop="user3Name" label="联系人3" align="center" />
            <el-table-column prop="user3Phone" label="联系人3电话" align="center" />
            <el-table-column prop="city" label="城市" align="center" />
            <el-table-column prop="district" label="区县" align="center" />
            <el-table-column prop="town" label="街道" align="center" />
            <el-table-column prop="stationld" label="单位代码" align="center" />
            <el-table-column prop="platKey" label="运营商代码" align="center" />
            <el-table-column align="center" label="详情" width="90">
              <template #default="scope">
                <a-button type="link" @click="fileinfo2(scope.row)">查看</a-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </el-tab-pane>
      <el-tab-pane label="安保点位" name="second">
        <div style="padding: 10px">
          <span style="color: rgba(0, 0, 0, 0.4392156863); margin-right: 10px">区域:</span>
          <a-tree-select
            v-model:value="form3.area"
            style="width: 200px"
            :dropdown-style="{maxHeight: '400px', overflow: 'auto'}"
            placeholder="请选择"
            allow-clear
            :tree-data="treedata"
            :labelInValue="false"
            :field-names="{
              children: 'children',
              value: 'title',
              label: 'title'
            }"
            tree-node-filter-prop="title"
          >
            <template #suffixIcon>
              <SmileOutlined />
            </template>
          </a-tree-select>
          <span style="color: rgba(0, 0, 0, 0.4392156863); margin-left: 10px; margin-right: 5px">运营商:</span>
          <el-select v-model="form3.yys" placeholder="请选择" style="width: 200px">
            <el-option v-for="item in tableData" :key="item.platKey" :label="item.name" :value="item.platKey"> </el-option>
          </el-select>
          <a-button type="primary" style="margin-left: 10px" @click="lodinganbao">查询</a-button>
        </div>
        <div style="padding: 10px; height: calc(100% - 85px); overflow: auto">
          <el-table :data="tableData2" border style="width: 100%" height="650">
            <el-table-column type="index" width="60" label="序号" align="center" :index="indexMethod1" />
            <el-table-column prop="pointld" label="编号" align="center" />
            <el-table-column prop="pointName" label="名字" align="center" />
            <el-table-column prop="pointAddress" label="地址" align="center" />
            <el-table-column prop="setupTime" label="安装时间" align="center" />
            <el-table-column prop="userName" label="联系人1" align="center" />
            <el-table-column prop="userPhone" label="联系人1电话" align="center" />
            <el-table-column prop="user2Name" label="联系人2" align="center" />
            <el-table-column prop="user2Phone" label="联系人2电话" align="center" />
            <el-table-column prop="user3Name" label="联系人3" align="center" />
            <el-table-column prop="user3Phone" label="联系人3电话" align="center" />
            <el-table-column prop="city" label="城市" align="center" />
            <el-table-column prop="district" label="区县" align="center" />
            <el-table-column prop="town" label="街道" align="center" />
            <el-table-column prop="stationld" label="单位代码" align="center" />
            <el-table-column prop="platKey" label="运营商代码" align="center" />
            <el-table-column align="center" label="详情" width="90">
              <template #default="scope">
                <a-button type="link" @click="fileinfo3(scope.row)">查看</a-button>
              </template>
            </el-table-column>
          </el-table>
          <el-pagination style="position: absolute; right: 60px" @current-change="handleCurrentChange1" :page-size="15" layout="total, prev, pager, next" :total="total1"> </el-pagination>
        </div>
      </el-tab-pane>
      <el-tab-pane label="报警点位" name="third">
        <div style="padding: 10px">
          <span style="color: rgba(0, 0, 0, 0.4392156863); margin-right: 10px">区域:</span>
          <a-tree-select
            @change="onSelectChange"
            v-model:value="form4.city"
            style="width: 200px"
            :dropdown-style="{maxHeight: '400px', overflow: 'auto'}"
            placeholder="请选择"
            allow-clear
            :tree-data="treedata"
            :labelInValue="false"
            :field-names="{
              children: 'children',
              value: 'title',
              label: 'title'
            }"
            tree-node-filter-prop="title"
          >
            <template #suffixIcon>
              <SmileOutlined />
            </template>
          </a-tree-select>
          <span style="color: rgba(0, 0, 0, 0.4392156863); margin-left: 10px; margin-right: 5px">运营商:</span>
          <el-select v-model="form3.yys" placeholder="请选择" style="width: 200px">
            <el-option v-for="item in tableData" :key="item.platKey" :label="item.name" :value="item.platKey"> </el-option>
          </el-select>
          <a-button type="primary" style="margin-left: 10px" @click="lodingbaojing">查询</a-button>
        </div>
        <div style="padding: 10px">
          <el-table :data="tableData3" border style="width: 100%" height="650">
            <el-table-column type="index" width="60" label="序号" align="center" :index="indexMethod" />
            <el-table-column prop="pointld" label="编号" align="center" />
            <el-table-column prop="pointName" label="名字" align="center" />
            <el-table-column prop="pointAddress" label="地址" align="center" />
            <el-table-column prop="setupTime" label="安装时间" align="center" />
            <el-table-column prop="userName" label="联系人1" align="center" />
            <el-table-column prop="userPhone" label="联系人1电话" align="center" />
            <el-table-column prop="user2Name" label="联系人2" align="center" />
            <el-table-column prop="user2Phone" label="联系人2电话" align="center" />
            <el-table-column prop="user3Name" label="联系人3" align="center" />
            <el-table-column prop="user3Phone" label="联系人3电话" align="center" />
            <el-table-column prop="city" label="城市" align="center" />
            <el-table-column prop="district" label="区县" align="center" />
            <el-table-column prop="town" label="街道" align="center" />
            <el-table-column prop="stationld" label="单位代码" align="center" />
            <el-table-column prop="platKey" label="运营商代码" align="center" />
            <el-table-column align="center" label="详情" width="90">
              <template #default="scope">
                <a-button type="link" @click="fileinfo4(scope.row)">查看</a-button>
              </template>
            </el-table-column>
          </el-table>
          <el-pagination style="position: absolute; right: 60px" @current-change="handleCurrentChange2" :page-size="15" layout="total, prev, pager, next" :total="total2"> </el-pagination>
        </div>
      </el-tab-pane>
      <el-tab-pane label="报警复核" name="thirds">
        <div style="padding: 10px">
          <span style="color: rgba(0, 0, 0, 0.4392156863); margin-right: 10px">区域:</span>
          <a-tree-select
            v-model:value="form6.area"
            style="width: 200px"
            :dropdown-style="{maxHeight: '400px', overflow: 'auto'}"
            placeholder="请选择"
            allow-clear
            :tree-data="treedata"
            :labelInValue="false"
            :field-names="{
              children: 'children',
              value: 'title',
              label: 'title'
            }"
            tree-node-filter-prop="title"
          >
            <template #suffixIcon>
              <SmileOutlined />
            </template>
          </a-tree-select>
          <span style="color: rgba(0, 0, 0, 0.4392156863); margin-left: 10px; margin-right: 5px">运营商:</span>
          <el-select v-model="form6.yys" placeholder="请选择" style="width: 200px">
            <el-option v-for="item in tableData" :key="item.platKey" :label="item.name" :value="item.platKey"> </el-option>
          </el-select>
          <a-button type="primary" style="margin-left: 10px" @click="lodingfuhe">查询</a-button>
        </div>
        <div style="padding: 10px">
          <el-table :data="tableData4" border style="width: 100%" height="650">
            <el-table-column type="index" width="60" label="序号" align="center" :index="indexMethod2" />
            <el-table-column prop="pointld" label="编号" align="center" />
            <el-table-column prop="pointName" label="名字" align="center" />
            <el-table-column prop="pointAddress" label="地址" align="center" />
            <el-table-column prop="setupTime" label="安装时间" align="center" />
            <el-table-column prop="userName" label="联系人1" align="center" />
            <el-table-column prop="userPhone" label="联系人1电话" align="center" />
            <el-table-column prop="user2Name" label="联系人2" align="center" />
            <el-table-column prop="user2Phone" label="联系人2电话" align="center" />
            <el-table-column prop="user3Name" label="联系人3" align="center" />
            <el-table-column prop="user3Phone" label="联系人3电话" align="center" />
            <el-table-column prop="city" label="城市" align="center" />
            <el-table-column prop="district" label="区县" align="center" />
            <el-table-column prop="town" label="街道" align="center" />
            <el-table-column prop="stationld" label="单位代码" align="center" />
            <el-table-column prop="platKey" label="运营商代码" align="center" />
            <el-table-column align="center" label="详情" width="90">
              <template #default="scope">
                <a-button type="link" @click="fileinfo5(scope.row)">查看</a-button>
              </template>
            </el-table-column>
          </el-table>
          <el-pagination style="position: absolute; right: 60px" @current-change="handleCurrentChange3" :page-size="15" layout="total, prev, pager, next" :total="total3"> </el-pagination>
        </div>
      </el-tab-pane>
    </el-tabs>

    <el-dialog title="运营详情" v-model="dialogVisible1" width="800" :before-close="handleClose">
      <div class="uploadBtn" style="text-align: right; margin-right: 10px; margin-bottom: 5px">
        <el-button
          ><el-icon> <Printer /> </el-icon>导出</el-button
        >
      </div>
      <el-descriptions title="" border direction="" :column="2">
        <el-descriptions-item label="平台名称">{{ showrow1data.name }}</el-descriptions-item>
        <el-descriptions-item label="公司">{{ showrow1data.company }}</el-descriptions-item>
        <el-descriptions-item label="城市">{{ showrow1data.city }}</el-descriptions-item>
        <el-descriptions-item label="区县">{{ showrow1data.district }}</el-descriptions-item>
        <el-descriptions-item label="IP">{{ showrow1data.ip }}</el-descriptions-item>
        <el-descriptions-item label="平台公钥">{{ showrow1data.platKey }}</el-descriptions-item>
        <el-descriptions-item label="视频系统">{{ showrow1data.ipcSystem }}</el-descriptions-item>
        <el-descriptions-item label="在线状态">{{ showrow1data.lineState }}</el-descriptions-item>
        <el-descriptions-item label="启用状态">{{ showrow1data.useState }}</el-descriptions-item>
        <el-descriptions-item label="联系人">{{ showrow1data.userName1 }}</el-descriptions-item>
        <el-descriptions-item label="电话">{{ showrow1data.userPhone2 }}</el-descriptions-item>
      </el-descriptions>
    </el-dialog>

    <el-dialog :title="titlew" v-model="dialogVisible2" width="800" :before-close="handleClose">
      <div class="uploadBtn" style="text-align: right; margin-right: 10px; margin-bottom: 5px">
        <el-button
          ><el-icon> <Printer /> </el-icon>导出</el-button
        >
      </div>
      <el-descriptions title="" border direction="" :column="2">
        <el-descriptions-item label="名字">{{ showrow2data.title }}</el-descriptions-item>
        <el-descriptions-item label="地址">{{ showrow2data.pointAddress }}</el-descriptions-item>
        <el-descriptions-item label="创建时间">{{ showrow2data.createTime }}</el-descriptions-item>
        <el-descriptions-item label="安装时间">{{ showrow2data.setupTime }}</el-descriptions-item>
        <el-descriptions-item label="城市">{{ showrow2data.city }}</el-descriptions-item>
        <el-descriptions-item label="区县">{{ showrow2data.district }}</el-descriptions-item>
        <el-descriptions-item label="街道">{{ showrow2data.town }}</el-descriptions-item>
        <el-descriptions-item label="运营商代码">{{ showrow2data.platKey }}</el-descriptions-item>
        <el-descriptions-item label="设备类型">{{ showrow2data.sensorType }}</el-descriptions-item>
        <el-descriptions-item label="在线状态">
          <template #default="scope">
            <span v-if="showrow2data.lineState == false">离线</span>
            <span v-else>在线</span>
          </template>
        </el-descriptions-item>
        <el-descriptions-item label="点位ID">{{ showrow2data.pointId }}</el-descriptions-item>
        <el-descriptions-item label="点位名称">{{ showrow2data.pointName }}</el-descriptions-item>
        <el-descriptions-item label="联系人">{{ showrow2data.user2Name }}</el-descriptions-item>
        <el-descriptions-item label="联系人电话">{{ showrow2data.user2Phone }}</el-descriptions-item>
      </el-descriptions>
    </el-dialog>

    <!-- <el-dialog v-model="dialogVisible" title="详情" width="40%" :before-close="handleClose">
      <div style="width: 100%; display: flex">
        <div style="flex: 1" id="map">1</div>
        <div style="flex: 1; margin-left: 10px">
          <p>
            <span>学校名称:</span><span style="margin-left: 30px">{{ infoData.alarmSource }}</span>
          </p>
          <p style="margin-top: 20px">
            <span>设备名称:</span><span style="margin-left: 30px">{{ infoData.subAddress }}</span>
          </p>
          <p style="margin-top: 20px">
            <span>地址:</span><span style="margin-left: 30px">{{ infoData.address }}</span>
          </p>
          <p style="margin-top: 20px">
            <span>时间:</span><span style="margin-left: 30px">{{ infoData.timestamp }}</span>
          </p>
          <p style="margin-top: 20px">
            <span>联系人:</span><span style="margin-left: 30px">{{ infoData.user1Name + '/' + infoData.user1Phone }}</span>
          </p>
          <p style="margin-top: 20px">
            <span>联系人2:</span><span style="margin-left: 30px">{{ infoData.user2Name + '/' + infoData.user2Phone }}</span>
          </p>
          <p style="margin-top: 20px">
            <span>联系人3:</span><span style="margin-left: 30px">{{ infoData.user3Name + '/' + infoData.user3Phone }}</span>
          </p>
        </div>
      </div>
    </el-dialog> -->
  </div>
</template>

<script lang="ts" setup>
import {SmileOutlined} from '@ant-design/icons-vue'
import {ref, reactive, onMounted} from 'vue'
import api from '@/axios'
import type {TabsPaneContext} from 'element-plus'
// import {ElMessage} from 'element-plus'
let city = JSON.parse(localStorage.getItem('user-stores'))['userInfo']['levelvalue']
onMounted(() => {
  // seachA();
  seach({})
  seach2(city, '')
  seach3(city, '')
  seach4(city, '')
  gettreedata()
  getbaojdw(city, '')
})
//报警单位
let form11 = reactive<any>({area: '', yys: []})
//报警点位
interface formType {
  city: any
  area: any
  yys: any
}
let form4 = reactive<formType>({
  area: '',
  yys: [],
  city: ''
})
//安保查询
let form3 = reactive<any>({area: '', yys: []})
const lodingbaojing = () => {
  seach3(form3.area.value, form3.yys)
}
const lodinganbao = () => {
  seach2(form3.area.value, form3.yys)
}
const options = ref([
  {
    value: '001',
    label: '党政机关'
  },
  {
    value: '006',
    label: '经融机构'
  },
  {
    value: '002',
    label: '医疗单位'
  },
  {
    value: '004',
    label: '中小学'
  },
  {
    value: '009',
    label: '其他'
  }
])
//详情1
const dialogVisible1 = ref(false)
const showrow1data = ref()
const fileinfo1 = (a: any) => {
  showrow1data.value = a
  dialogVisible1.value = true
}
//详情2
const titlew = ref()
const dialogVisible2 = ref(false)
const showrow2data = ref()
const fileinfo2 = (a: any) => {
  titlew.value = '报警单位'
  showrow2data.value = a
  dialogVisible2.value = true
}
const fileinfo3 = (a: any) => {
  titlew.value = '安保点位'
  showrow2data.value = a
  dialogVisible2.value = true
}
const fileinfo4 = (a: any) => {
  titlew.value = '报警点位'
  showrow2data.value = a
  dialogVisible2.value = true
}
const fileinfo5 = (a: any) => {
  titlew.value = '报警复合'
  showrow2data.value = a
  dialogVisible2.value = true
}
const activeName = ref('first')
//获取过滤树
const treedata = ref()
const gettreedata = () => {
  api
    .post('/common/client/user/org/tree', {
      name: localStorage.getItem('loginname')
    })
    .then((res) => {
      console.log('过滤树', res)
      if (res.code == 0) {
        treedata.value = res.data
      }
    })
}
const lodingbaojingdanwei = () => {
  console.log(form11)
  getbaojdw(form11.area, form11.yys)
}
const tableData8 = ref<any>([])
const getbaojdw = (city: any, a: any) => {
  console.log('🚀 ~ getbaojdw ~ city: any, a: any:', city, a)

  api
    .post('/multialarm/client/station/getlist', {
      code: city,
      city: city == '湖南省' ? null : city,
      industry: a,
      accountName: localStorage.getItem('loginname')
    })
    .then((res1) => {
      tableData8.value = res1.data
      // loading.value = false;
    })
}

const handleClick = (tab: TabsPaneContext, event: Event) => {
  // console.log(tab, event)
}

//查询1
const tableData = ref<any>([])
const seach = (obj: any) => {
  api.post('/multialarm/client/platform/getlist', obj).then((res) => {
    console.log('警情管理', res)
    if (res.code == 0) {
      tableData.value = res.data
    }
  })
}
//查询安保点位
const tableData2 = ref<any>([])
const total1 = ref()
const change1 = (value: any, label: any, extra: any) => {
  console.log('change1', extra, extra['allCheckedNodes'][0]['pos'])
  let obj = {}
  if (extra.allCheckedNodes[0]['pos'] == '0-0') {
    obj = {
      city: extra.triggerValue
    }
  }
  seach2(obj)
}

const seach2 = (city: any, platKey?: any) => {
  api
    .post('/multialarm/mdev/count', {
      city: city == '湖南省' ? null : city,
      platKey: platKey
    })
    .then((res: any) => {
      console.log('安保点位数量', res)
      if (res.code == 0) {
        total1.value = res.data.count
      }
    })
  api
    .post('/multialarm/mdev/getlist', {
      pagesize: 15,
      pageindex: 0,
      city: city == '湖南省' ? null : city,
      platKey: platKey
    })
    .then((res) => {
      console.log('安保点位', res)
      if (res.code == 0) {
        tableData2.value = res.data
      }
    })
}
const pageNum1 = ref(1)
const handleCurrentChange1 = (data: any) => {
  console.log('data', data)
  pageNum1.value = data
  api
    .post('/multialarm/mdev/getlist', {
      pagesize: 1000,
      pageindex: data - 1,
      city: '长沙市'
    })
    .then((res) => {
      console.log('安保点位', res)
      if (res.code == 0) {
        tableData2.value = res.data
      }
    })
}
const indexMethod1 = (index: number) => {
  return (pageNum1.value - 1) * 15 + index + 1
}
//查询报警点位
const tableData3 = ref<any>([])
const total2 = ref()
const seach3 = (city: any, platKey: any) => {
  api
    .post('/multialarm/client/alarm_point/count', {
      city: city == '湖南省' ? null : city,
      platKey: platKey
    })
    .then((res: any) => {
      if (res.code == 0) {
        total2.value = res.data.count
      }
    })
  api
    .post('/multialarm/client/alarm_point/getlist', {
      pagesize: 15,
      pageindex: 0,
      city: city == '湖南省' ? null : city,
      platKey: platKey
    })
    .then((res) => {
      if (res.code == 0) {
        tableData3.value = res.data
      }
    })
}
const pageNum2 = ref(1)
const handleCurrentChange2 = (data: any) => {
  // console.log('data', data)
  pageNum2.value = data
  api
    .post('/multialarm/client/alarm_point/getlist', {
      pagesize: 15,
      pageindex: data - 1,
      city: form3.area == '湖南省' ? null : form3.area,
      platKey: form3.yys
    })
    .then((res) => {
      if (res.code == 0) {
        tableData3.value = res.data
      }
    })
}
const indexMethod = (index: number) => {
  return (pageNum2.value - 1) * 15 + index + 1
}
//查询视频点位
const tableData4 = ref<any>([])
const total3 = ref()
const seach4 = (city: any, platKey: any) => {
  api
    .post('/multialarm/client/ipc/count', {
      city: city == '湖南省' ? null : city,
      platKey: platKey
    })
    .then((res: any) => {
      if (res.code == 0) {
        total3.value = res.data.count
      }
    })
  api
    .post('/multialarm/client/ipc/getlist', {
      pagesize: 15,
      pageindex: 0,
      city: city == '湖南省' ? null : city,
      platKey: platKey
    })
    .then((res) => {
      if (res.code == 0) {
        tableData4.value = res.data
      }
    })
}
let form6 = reactive<any>({area: '', yys: []})
const lodingfuhe = () => {
  seach4(form6.area.value, form6.yys)
}
const pageNum3 = ref(1)
const handleCurrentChange3 = (data: any) => {
  pageNum3.value = data
  api
    .post('/multialarm/client/ipc/getlist', {
      pagesize: 15,
      pageindex: data - 1,
      city: form6.area == '湖南省' ? null : form6.area,
      platKey: form6.yys
    })
    .then((res) => {
      if (res.code == 0) {
        tableData4.value = res.data
      }
    })
}
const indexMethod2 = (index: number) => {
  return (pageNum3.value - 1) * 15 + index + 1
}
const handleClose = function () {
  dialogVisible1.value = false
  dialogVisible2.value = false
}

const onSelectChange = function (value: any, label: any, extra: any) {
  console.log('🚀 ~ onSelectChange ~ value:any, label:any, extra:any:', value, label, extra, form4.city)
}
</script>

<style scoped lang="scss">
// :deep(.el-descriptions) {
// 	width: 98%;
// 	margin: 10px auto;
// 	text-align: center;
// 	border: 1px solid #1F9BD9;

// 	--el-descriptions-table-border: {
// 		1px solid #1F9BD9
// 	};
// 	--el-descriptions-item-bordered-label-background: {
// 		transparent
// 	};
// }

// :deep(.el-descriptions__body) {
// 	background: transparent;
// }

// :deep(.el-descriptions__label) {
// 	width: 130px;
// 	color: rgb(12, 214, 254);
// 	background: transparent;
// }

// :deep(.el-descriptions__content.el-descriptions__cell.is-bordered-content) {
// 	color: #fff;
// }

// :deep(.el-descriptions__body .el-descriptions__table.is-bordered .el-descriptions__cell) {
// 	border: 1px solid #1F9BD9;
// }

// :deep(.el-dialog__body) {
// 	padding: 10px;
// 	color: #fff;
// }

.uploadBtn .el-button {
  background-color: transparent;
  border-color: #1f9bd9;
  color: #1f9bd9;
}

.uploadBtn .el-button i {
  font-size: 16px;
  margin-right: 3px;
}

.uploadBtn .el-button:hover {
  color: rgb(12, 214, 254);
  border: 1px solid rgb(12, 214, 254);
}

.cont {
  width: 100%;
  height: 100%;
  background-color: #fff;
  // background:rgba(9, 45, 84, 1)
}

.demo-tabs > .el-tabs__content {
  padding: 32px;
  color: #6b778c;
  font-size: 32px;
  font-weight: 600;
}

// :deep(.el-dialog__body) {
// 	padding: 10px;
// 	color: #fff;
// }

// :deep(.el-dialog) {
// 	--el-dialog-bg-color: #071D4D;
// 	border: 3px solid #387dbf;
// }

// :deep(.el-table thead.is-group th.el-table__cell) {
// 	// background: #5D99D5;
// }

// :deep(.el-dialog__header) {
// 	padding: 13px;
// 	border-bottom: 1px solid #3374b4 !important;
// 	margin-right: 0px;
// }

// :deep(.el-dialog__title) {
// 	color: #067bc1 !important;
// 	font-weight: 500;
// }

// :deep(.el-dialog__headerbtn .el-dialog__close) {
// 	color: #fff;
// 	font-weight: 500;
// 	font-size: 18px;
// }

:deep(.el-tabs__nav-wrap::after) {
  background-color: #d9d9d95e;
  height: 4px;
}

:deep(.el-tabs__item) {
  color: #00000070;
  font-weight: 700;
}

:deep(.el-tabs) {
  --el-tabs-header-height: 50px;
}

:deep(.el-tabs__item.is-active) {
  color: #000;
}

:deep(.el-tabs__active-bar) {
  height: 4px;
  background-color: #000;
}

:deep(.el-tabs__nav-wrap) {
  padding-left: 23px;
}

:deep(.el-input__wrapper) {
  background-color: transparent;
  // box-shadow: 0 0 0 1px #1F9BD9;
}

:deep(.el-input__inner) {
  // color: #fff;
}

:deep(.el-input__prefix) {
  color: #fff;
}

:deep(.el-button) {
  background-color: transparent;
  border-color: #0cd6fe;
  color: #000;
}

// :deep(.el-table) {
// 	--el-table-border-color: #1677ff40;
// }

// :deep(.el-table th.el-table__cell) {
// 	// background-color: #5C9AD5;
// }

// :deep(.el-table thead) {
// 	// color: #fff;
// }

// :deep(.el-table tr) {
// 	// background-color: #fff;
// }

// :deep(.el-table__body tr.current-row > td) {
// 	// background: #2cabff !important;
// }

// :deep(.el-table--enable-row-hover .el-table__body tr:hover>td) {
// 	// background-color:  #13306A !important;
// }

// :deep(.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell) {
// 	// background: #D1DEEE !important;
// }

// :deep(.el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell) {
// 	// background-color: transparent;
// }

// :deep(.el-table .el-table__cell) {
// 	padding: 6px 0px;
// }

// :deep(.el-table th.el-table__cell) {
// 	background-color: #F5F7FA;
// }
:deep(.el-date-editor .el-range-input) {
  color: #fff;
}
:deep(.el-tabs) {
  height: 100%;
}

:deep(.el-tabs__content) {
  height: calc(100% - 53px);
}

:deep(.el-tab-pane) {
  height: 100%;
}

::-webkit-scrollbar {
  background-color: #071d4d;
}
</style>
