排版及对接

src/api/tenantManage/tenantUnit.js

@@ -0,0 +1,47 @@
+import request from '@/utils/request'
+
+//停电计划-查询
+export function getTenantData(params) {
+    return request({
+        url: '/tenantConfig/getTenantData',
+        method: 'POST',
+        data: params,
+    })
+}
+
+//停电计划-注销
+export function plannedOutageDel(params) {
+    return request({
+        url: '/wcBlackoutPlan/plannedOutageDel',
+        method: 'GET',
+        params,
+    })
+}
+
+//停电计划-新增
+export function plannedOutageAdd(params) {
+    return request({
+        url: '/wcBlackoutPlan/plannedOutageAdd',
+        method: 'POST',
+        data: params,
+    })
+}
+
+//停电计划-修改
+export function plannedOutageUpdate(params) {
+    return request({
+        url: '/wcBlackoutPlan/plannedOutageUpdate',
+        method: 'POST',
+        data: params,
+    })
+}
+
+
+//停电计划-导出
+export function outagePlanListExport(params) {
+    return request({
+        url: 'wcBlackoutPlan/outagePlanListExport',
+        method: 'GET',
+        params,
+    })
+}

src/views/tenantManage/tenantUnit/dialogComponent.vue

@@ -1,168 +1,143 @@
 <template>
   <el-dialog
     :title="dialogTitle"
-    v-model="dialogVisible"
-    width="640px"
-    @close="closeDialog()"
-    @open="open"
+    v-model="showDialog"
+    width="900px"
+    @open="open()"
+    @close="closeDialog(0)"
   >
     <el-form
       ref="formInfo"
       :model="form"
-      class="demo-form-inline userManageDialog"
-      label-width="100px"
+      class="demo-form-inline"
+      label-width="150px"
       :rules="rules"
     >
-      <el-form-item label="用户名：" prop="nickName">
-        <el-input
-          v-model="form.nickName"
-          :disabled="dialogTitle === '查看'"
-        ></el-input>
-      </el-form-item>
-      <el-form-item label="账号：" prop="userName">
-        <el-input
-          v-model="form.userName"
-          :disabled="dialogTitle === '查看'"
-        ></el-input>
-      </el-form-item>
-      <el-form-item label="性别：" prop="sex">
-        <el-radio-group v-model="form.sex" :disabled="dialogTitle === '查看'">
-          <el-radio label="1" value="1">男</el-radio>
-          <el-radio label="2" value="2">女</el-radio>
-        </el-radio-group>
-      </el-form-item>
-
-      <el-form-item label="手机号码：" prop="phonenumber">
-        <el-input
-          v-model="form.phonenumber"
-          :disabled="dialogTitle === '查看'"
-        ></el-input>
-      </el-form-item>
-      <el-form-item label="密码" prop="password" v-if="dialogTitle == '新增'">
-        <el-input
-          v-model="form.password"
-          :disabled="dialogTitle === '查看'"
-        ></el-input>
-      </el-form-item>
-
-      <!-- <el-form-item
-        label="创建时间："
-        prop="createTime"
-        style="margin-top: 0px"
-      >
-        <el-date-picker
-          v-model="form.createTime"
-          width="100%"
-          type="datetime"
-          placeholder="选择日期时间"
-          :disabled="dialogTitle === '查看'"
-        ></el-date-picker>
-      </el-form-item> -->
+      <el-row>
+        <el-col :span="12" :gutter="20">
+          <el-form-item label="租户名称:" prop="tenantName">
+            <el-input v-model="form.tenantName"></el-input>
+          </el-form-item>
+          <el-form-item label="负责人:" prop="tenantManager">
+            <el-input v-model="form.tenantManager"></el-input>
+          </el-form-item>
+          <el-form-item label="有效期限:" prop="tenantTerm">
+            <!-- <el-input v-model="form.tenantTerm"></el-input> -->
+            <el-radio-group
+              v-model="form.tenantTerm"
+            >
+              <el-radio label="1" value="1">永久有效</el-radio><br>
+              <el-radio label="2" value="2">
+                <el-date-picker v-model="value1" type="date" placeholder="请选择日期" />
+              </el-radio>
+            </el-radio-group>
+          </el-form-item>
 
-      <el-form-item label="角色名称：" prop="roleId">
-        <!-- <el-input v-model="form.roleName"></el-input> -->
-        <el-select
-          v-model="form.roleId"
-          placeholder="请选择"
-          clearable
-          :disabled="dialogTitle === '查看'"
-        >
-          <el-option
-            v-for="(item, index) in roleSelectData"
-            :key="index"
-            :label="item.roleName"
-            :value="item.roleId"
-          ></el-option>
-        </el-select>
-      </el-form-item>
+          <el-form-item label="地理位置:" prop="geoPosition">
+            <el-input v-model="form.geoPosition"></el-input>
+          </el-form-item>
 
-      <el-form-item label="所属站点：" prop="siteId">
-         <el-select
-              v-model="form.siteId"
+          <!-- <el-form-item label="开始/结束停电时间:" prop="time">
+            <el-date-picker
+              style="width: 330px"
+              v-model="form.time"
+              type="datetimerange"
+              :disabledDate="pickerEndDate"
+              start-placeholder="Start Date"
+              end-placeholder="End Date"
+              :disabled="form.type === 2 || form.type === 3"
+            ></el-date-picker>
+          </el-form-item> -->
+        </el-col>
+        <el-col :span="12" :gutter="20">
+          <el-form-item label="租户类型:" prop="tenantType">
+            <el-select
+              v-model="form.tenantType"
               placeholder="请选择"
-              clearable
-               multiple
-              filterable
-              collapse-tags
-               @change="linkChange()"
-              
+              :disabled="dialogTitle === '编辑'"
             >
-              <el-option
-                v-for="site in store.state.siteList"
-                :key="site"
-                :label="site.siteName"
-                :value="site.id"
-                
-              ></el-option>
+              <el-option label="试用租户" :value="0"></el-option>
+              <el-option label="正式租户" :value="1"></el-option>
             </el-select>
-      </el-form-item>
+          </el-form-item>
+          <el-form-item label="负责人手机号:" prop="phoneNumber">
+            <el-input v-model="form.phoneNumber"></el-input>
+          </el-form-item>
+          <el-form-item label="系统平台:" prop="systemName">
+            <el-input v-model="form.systemName"></el-input>
+          </el-form-item>
+          <!-- <el-form-item label="系统平台:" prop="systemName">
+            <el-select
+              v-model="form.systemName"
+              placeholder="请选择"
+            >
+              <el-option label="计划检修停电" :value="1"></el-option>
+              <el-option label="计划施工停电" :value="2"></el-option>
+              <el-option label="客户申请停电" :value="3"></el-option>
+            </el-select>
+          </el-form-item> -->
+          <el-form-item label="邮箱地址:" prop="email">
+            <el-input v-model="form.email"></el-input>
+          </el-form-item>
+          <el-form-item label="联系地址:" prop="address">
+            <el-input v-model="form.address"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
 
+      <el-form-item label="">
+        <div
+          style="width: 670px; height: 130px; background: rgba(0, 0, 0, 0.2)"
+        >
+          地图
+        </div>
+      </el-form-item>
+      <el-form-item label="备注:" prop="tenantTerm">
+        <el-input
+          v-model="remark"
+          :rows="2"
+          type="textarea"
+          placeholder="请输入..."
+          style="width: 670px"
+        />
+      </el-form-item>
 
       <br />
       <br />
       <br />
       <div style="text-align: right">
         <el-button @click="closeDialog(0)">取消</el-button>
-        <el-button
-          type="primary"
-          @click="submitForm('formInfo')"
-          :disabled="isDisable"
-          v-if="dialogTitle !== '查看'"
-        >
-          确定
-        </el-button>
+        <el-button type="primary" @click="submitForm()">保存</el-button>
       </div>
     </el-form>
   </el-dialog>
 </template>
-
 <script>
-import { defineComponent, ref, onMounted, watchEffect,watch } from 'vue'
-import * as api from '@/api/systemManage/userManage.js'
-import { ElMessage } from 'element-plus'
-import { parseTime, validatorPhone } from '@/utils'
 import { useStore } from 'vuex'
-
+import { defineComponent, ref, watchEffect } from 'vue'
+import * as api from '@/api/planOutage/index'
+import { ElMessage } from 'element-plus'
+import { validatorPhone } from '@/utils'
 export default defineComponent({
   name: 'DialogComponent',
   emits: ['closeDialog'],
   props: {
-    flag: Boolean,
+    show_Dialog: Boolean,
     dialogTitle: String,
-    itemInfo: Object,
+    itemInfo: {
+      type: Object,
+      default: function () {
+        return {}
+      },
+    },
   },
-  setup(props, context) {
-    context
+  setup(props, { emit }) {
     const store = useStore()
-    const dialogVisible = ref(false)
-    const formInfo = ref(null)
-    const isDisable = ref(false)
-
+    const beginTime = ref('')
+    const showDialog = ref(false)
     const form = ref([])
-    const roleSelectData = ref([])
-
-    // open(): Dialog弹窗打开之前做的事
-    const open = () => {
-    
-      form.value = props.itemInfo.value
-       console.log('form.value')
-       console.log(form.value)
-      console.log(form.value.siteId)
-    }
-
-  
-
-    // 关闭弹框
-    const closeDialog = () => {
-      resetForm()
-      context.emit('closeDialog', false)
-      dialogVisible.value = false
-    }
-
-    watchEffect((fn, options) => {
-      fn, options
-      dialogVisible.value = props.flag
-    })
+    const formInfo = ref(null)
+    const value1 = ref('')
 
     const roleValid = (rule, value, callback) => {
       rule
@@ -173,36 +148,34 @@ export default defineComponent({
       }
     }
 
-    // 保存-修改操作
+    // 保存操作
     const submitForm = () => {
-      form.value.createTime = parseTime(new Date())
-
       formInfo.value.validate((valid) => {
         if (valid) {
-          isDisable.value = true
-           setTimeout(() => {
-                  isDisable.value = false //点击一次时隔两秒后才能再次点击
-                }, 2000)
-          form.value.roleIds = [form.value.roleId] //roleIds 传给后台
+          var timeType = typeof form.value.time[0]
+          if (timeType == 'object') {
+            store.commit('TimeAll_function', form.value.time)
+            const time = store.state.Time_Data
+            form.value.startTime = time[0]
+            form.value.endTime = time[1]
+          } else {
+            form.value.startTime = form.value.time[0]
+            form.value.startTime = form.value.time[1]
+          }
           if (props.dialogTitle === '新增') {
-            api.userAdd(form.value).then((requset) => {
+            api.plannedOutageAdd(form.value).then((requset) => {
               if (requset.status === 'SUCCESS') {
                 ElMessage.success({
                   message: '新增成功',
                   type: 'success',
                 })
-                setTimeout(() => {
-                  isDisable.value = false //点击一次时隔两秒后才能再次点击
-                }, 2000)
-
                 closeDialog()
               } else {
-                alert(requset.msg)
-                // ElMessage.error(requset.msg)
+                ElMessage.error(requset.msg)
               }
             })
           } else {
-            api.userUpdate(form.value).then((requset) => {
+            api.plannedOutageUpdate(form.value).then((requset) => {
               if (requset.status === 'SUCCESS') {
                 ElMessage.success({
                   message: '修改成功',
@@ -221,97 +194,131 @@ export default defineComponent({
       })
     }
 
-    //角色下拉请求
-    function optionselect() {
-      api.optionselect().then((requset) => {
-        if (requset.status === 'SUCCESS') {
-     
-          roleSelectData.value = requset.data
-        } else {
-          ElMessage.error(requset.msg)
-        }
-      })
+    const open = () => {
+      form.value = props.itemInfo
+    }
+
+    // 关闭弹框
+    const closeDialog = (flag) => {
+      resetForm()
+      showDialog.value = false
+      emit('closeDialog', flag)
     }
 
     function resetForm() {
       formInfo.value.resetFields()
-      
-      
-     
     }
-    function linkChange(){
 
+    watchEffect((fn, options) => {
+      fn, options
+      showDialog.value = props.show_Dialog
+    })
 
-    }
+    //禁止选择以前的时间
+    const pickerEndDate = (time) => {
+      const timeRange = 1 * 24 * 60 * 60 * 1000
 
-     //监听变化
-    watch(
-      () => props.siteIdArr,
-      (newVal) => {
-        alert(1)
-        newVal
-       
-      }
-    )
+      return time.getTime() <= Date.now() - timeRange * 1
+    }
+    /**
+     * 手机号校验
+     */
+    // var validatorPhone = function (rule, value, callback) {
+    //   if (value === '') {
+    //     callback(new Error('手机号不能为空'))
+    //   } else if (!/^1\d{10}$/.test(value)) {
+    //     callback(new Error('手机号格式错误'))
+    //   } else {
+    //     callback()
+    //   }
+    // }
+    return {
+      pickerEndDate,
+      roleValid,
+      submitForm,
+      closeDialog,
+      open,
 
-    onMounted(() => {
-      optionselect()
-    })
+      value1,
 
-    return {
       store,
-      linkChange,
-      closeDialog,
-      dialogVisible,
-      roleValid,
-      formInfo,
+      beginTime,
+      showDialog,
+
+      checked: true,
       form,
-      roleSelectData,
-      open,
-      submitForm,
-      resetForm,
-      isDisable,
+      formInfo,
+      options: [
+        {
+          value: '选项1',
+          label: '站点一',
+        },
+        {
+          value: '选项2',
+          label: '站点二',
+        },
+        {
+          value: '选项3',
+          label: '站点三',
+        },
+        {
+          value: '选项4',
+          label: '站点四',
+        },
+        {
+          value: '选项5',
+          label: '站点五',
+        },
+      ],
+
       rules: {
-       
-        nickName: [
-          { required: true, message: '请输入用户名', trigger: 'blur' },
-          {
-            min: 2,
+        tenantName: [
+          // required  是否为必填项， trigger:表单验证的触发时机，失去焦点进行验证
+          { required: true, message: '请输入租户名称', trigger: 'blur' },
+        ],
+        tenantManager: [
+          { required: true, message: '请输入租户负责人', trigger: 'blur' },
+        ],
+        tenantTerm: [
+          { required: true, message: '请选择有效期限', trigger: 'change' },
+        ],
+        geoPosition: [
+          { required: true, message: '请选输入地理位置', trigger: 'blur' },
+        ],
 
-            message: '用户名长度至少2个字符',
-            trigger: 'blur',
-          },
+        tenantType: [
+          { required: true, message: '请输入租户类型', trigger: 'blur' },
         ],
-        userName: [
-          { required: true, message: '请输入账号', trigger: 'blur' },
+        phoneNumber: [
           {
-            max: 10,
-            message: '账号最多输入 10 个字符',
+            required: true,
+            message: '请输入负责人手机号码',
             trigger: 'blur',
           },
-        ],
-        sex: [{ required: true, message: '请选择性别', trigger: 'change' }],
-        phonenumber: [
-          { required: true, message: '请输入手机号码', trigger: 'blur' },
           {
             validator: validatorPhone,
             message: '输入的电话号码不正确',
             trigger: 'blur',
           },
         ],
-        createTime: [
-          { required: true, message: '请输入创建时间', trigger: 'blur' },
+        systemName: [
+          { required: true, message: '请选择系统平台', trigger: 'blur' },
         ],
-        roleId: [
-          { required: true, message: '请选择角色名称', trigger: 'blur' },
+        email: [
+          { required: true, message: '请输入邮箱地址', trigger: 'blur' },
+          {
+            min: 1,
+            max: 10,
+            message: '长度在 1 到 10 个字符',
+            trigger: 'blur',
+          },
         ],
-         siteId:  [{ required: true, message: '请选择站点', trigger: 'blur' }],
-        password: [
-          { required: true, message: '请输入密码', trigger: 'blur' },
+        address: [
+          { required: true, message: '请输入联系地址', trigger: 'blur' },
           {
-            min: 3,
-            max: 6,
-            message: '长度在 3 到 6 个字符',
+            min: 1,
+            max: 10,
+            message: '长度在 1 到 10 个字符',
             trigger: 'blur',
           },
         ],
@@ -323,9 +330,25 @@ export default defineComponent({
  
 <style scoped lang="scss">
 .el-input,
-.el-select {
+.el-select,
+.el-date-editor.el-input,
+.el-date-editor.el-input__inner {
   width: 240px;
 }
+
+.el-form-item {
+  margin: 0 0 20px !important;
+}
+// label样式
+.el-form-item__label {
+  width: 120px !important;
+}
+.el-form-item__content {
+  margin-left: 100px;
+}
+.demo-form-inline .el-form-item:not(.user-layout .el-form-item) {
+  // margin: 0 auto 20px 55px;
+}
 </style>
-<style lang="scss">
+<style>
 </style>

src/views/tenantManage/tenantUnit/index.vue

@@ -4,36 +4,70 @@
     <div class="filter-container mb-10">
       <div class="left">
         <div>
-          <span class="" style="margin-right: 30px">租户单位配置待排版111</span>
-          <el-button :disabled="store.state.authorities.indexOf('新增')==-1" icon="el-icon-plus" type="success" @click="addItem()">
+          <a class="" style="margin-right: 30px">租户单位配置列表</a>
+          <el-button icon="el-icon-plus" type="success" @click="addItem()" :disabled="store.state.authorities.indexOf('新增')==-1">
             新增
           </el-button>
         </div>
-        <div style="margin-top: 20px">
+
+        
+      </div>
+
+      <div class="right">
+        <el-button type="primary">全部导出</el-button>
+
+        <el-button type="primary"  @click="DataReportExport()" :disabled="store.state.authorities.indexOf('导出')==-1">导出</el-button>
+      </div>
+    </div>
+
+    <div class="filter-container mb-10">
+      <div style="margin-top: 20px">
           <div class="filter-item">
-            账号：
+            租户名称：
             <el-input
-              v-model="userName"
+              v-model="tenantName"
               placeholder="请输入内容"
-              style="width: 180px"
+              style="width: 150px"
                :disabled="store.state.authorities.indexOf('查询')==-1"
             ></el-input>
           </div>
-
           <div class="filter-item">
-            账号状态:
+            负责人：
+            <el-input
+              v-model="tenantManager"
+              placeholder="请输入内容"
+              style="width: 150px"
+               :disabled="store.state.authorities.indexOf('查询')==-1"
+            ></el-input>
+          </div>
+           <div class="filter-item">
+            客户类型:
             <el-select
-              v-model="status"
+              v-model="tenantType"
               placeholder="请选择"
               style="width: 150px"
               clearable
-               :disabled="store.state.authorities.indexOf('查询')==-1"
+              :disabled="store.state.authorities.indexOf('查询')==-1"
             >
-              <el-option label="正常" value="0"></el-option>
-              <el-option label="停用" value="1"></el-option>
+              <el-option label="试用租户" :value="0"></el-option>
+              <el-option label="正式租户" :value="1"></el-option>
             </el-select>
           </div>
-
+           <div class="filter-item">
+            状态:
+            <el-select
+              v-model="status"
+              placeholder="请选择"
+              style="width: 200px"
+              clearable
+              :disabled="store.state.authorities.indexOf('查询')==-1"
+            >
+              <el-option label="正常" :value="0"></el-option>
+              <el-option label="停用" :value="1"></el-option>
+            </el-select>
+          </div>
+          
+      
           <div class="filter-item planOutage">
             选择时间范围：
             <el-date-picker
@@ -43,63 +77,109 @@
               start-placeholder="开始日期"
               end-placeholder="结束日期"
               style="width: auto"
-               :disabled="store.state.authorities.indexOf('查询')==-1"
+              :disabled="store.state.authorities.indexOf('查询')==-1"
             ></el-date-picker>
           </div>
+         
           <el-button
-          :disabled="store.state.authorities.indexOf('查询')==-1"
             type="primary"
             icon="el-icon-search"
+            @click="Select()"
             class="search-button"
-            @click="list()"
+            :disabled="store.state.authorities.indexOf('查询')==-1"
           >
             查询
           </el-button>
         </div>
-      </div>
 
-      <!-- <div class="right">
-        <el-button type="primary">导出</el-button>
-      </div> -->
     </div>
+
+    
     <!-- 筛选end -->
 
     <!-- 表格start -->
-    <el-table :data="tableData" border stripe :header-cell-style="headClass">
-      <!-- <el-table-column prop="xh" label="序号" width="70">
-      </el-table-column> -->
-      <el-table-column prop="nickName" label="用户名"></el-table-column>
-      <el-table-column prop="userName" label="账号"></el-table-column>
-      <el-table-column prop="sex" label="性别" width="100">
-        <template #default="scope">
-          <span>{{ scope.row.sex == 1 ? '男' : '女' }}</span>
+    <el-table
+      :data="tableData"
+      border
+      stripe
+      :header-cell-style="headClass"
+      :cell-style="cellStyle"
+    >
+      <el-table-column type="index" label="序号" width="50px"></el-table-column>
+      <el-table-column
+        prop="tenantName"
+        label="租户名称"
+          min-width="140px"
+      ></el-table-column>
+      <el-table-column
+        prop="tenantManager"
+        label="负责人"
+        min-width="100px"
+      ></el-table-column>
+      <el-table-column
+        prop="phoneNumber"
+        label="负责人手机号"
+        min-width="125px"
+      ></el-table-column>
+      <el-table-column
+        prop="tenantType"
+        label="客户类型"
+        min-width="80px"
+      >
+      <template #default="scope">
+          <span>
+            {{
+              scope.row.tenantType === '0'
+                ? '使用租户': '正式租户'
+            }}
+          </span>
         </template>
       </el-table-column>
-      <el-table-column prop="phonenumber" label="手机号码" min-width="120"></el-table-column>
-      <el-table-column prop="createTime" label="创建时间" min-width="160"></el-table-column>
-      <!-- <el-table-column
-        prop="roles.roleName"
-        label="角色名称"
-       
-      ></el-table-column> -->
-      <el-table-column fixed="right" label="操作" width="180">
+      <el-table-column prop="geoPosition" label="地理位置"  min-width="160px"></el-table-column>
+      <el-table-column prop="status" label="状态" width="">
         <template #default="scope">
-          <el-button
-            @click="checkItem(scope.row)"
-            type="text"
-            size="small"
-            class="delete-text"
+          <span
+            :style="{
+              color:
+                scope.row.status == '0'
+                  ? '#8DCF6E':'#FF747B'
+            }"
           >
-            查看
-          </el-button>
+            {{
+              scope.row.status === '0'
+                ? '正常': '停用'
+            }}
+          </span>
+        </template>
+      </el-table-column>
+
+      <el-table-column prop="systemName" label="系统平台"  min-width="100px"></el-table-column>
+            <el-table-column prop="tenantTerm" label="到期时间"  min-width="110px"></el-table-column>
+      <el-table-column fixed="right" label="操作" width="80">
+        <template #default="scope">
           <el-button
-          :disabled="store.state.authorities.indexOf('修改')==-1"
             type="text"
             size="small"
             @click.prevent="editRow(scope.row)"
+            :disabled="store.state.authorities.indexOf('修改')==-1"
           >
             编辑
           </el-button>
+          <!-- <el-popconfirm
+            confirm-button-text="是"
+            cancel-button-text="否"
+            icon="el-icon-info"
+            icon-color="red"
+            title="确定删除?"
+            @confirm="handleDelete(scope.row)"
+            @cancel="cancelEvent"
+          >
+            <template #reference>
+              <el-button type="text" size="small" class="delete-text" :disabled="store.state.authorities.indexOf('删除')==-1">
+                删除
+              </el-button>
+            </template>
+          </el-popconfirm> -->
         </template>
       </el-table-column>
     </el-table>
@@ -108,26 +188,25 @@
     <!-- 分页start -->
     <div class="paginationBlock">
       <el-pagination
-        v-model:currentPage="currentPage"
-        :page-sizes="[15, 20, 25, 30]"
-        :page-size="pageSize"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="total"
-        @size-change="handleSizeChange"
-        @current-change="handleCurrentChange"
-        background
-      ></el-pagination>
+          v-model:currentPage="page"
+          :page-sizes="[15, 20, 25, 30]"
+          :page-size="pageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          background
+        ></el-pagination>
     </div>
 
     <!-- 分页end -->
 
     <!--弹框组件开始-----------------------start-->
     <dialog-component
-      :dialogTitle="dialogTitle"
-      :itemInfo="tableItem"
+      :dialog-title="dialogTitle"
+      :item-info="tableItem"
       @closeDialog="closeDialog"
-      :flag="showDialog"
-      v-if="tableItem"
+      :show_Dialog="showDialog"
     ></dialog-component>
     <!--弹框组件开始-----------------------end-->
   </div>
@@ -135,186 +214,240 @@
 
 <script>
 import { useStore } from 'vuex'
-import { defineComponent, ref, reactive, onMounted } from 'vue'
-import * as api from '@/api/systemManage/userManage.js'
-import { ElMessage } from 'element-plus'
-
+import { defineComponent, onMounted, ref } from 'vue'
 import DialogComponent from './dialogComponent'
+import * as api from '@/api/tenantManage/tenantUnit.js'
+import { ElMessage } from 'element-plus'
 
 export default defineComponent({
+  name: 'VariableList',
+
   components: { DialogComponent },
   setup() {
     const store = useStore()
-    const total = ref(0)
-    const pageSize = ref(10)
-    const currentPage = ref(1)
-
-    const dateTime = ref('')
 
-    const userName = ref('')
-    const phone = ref('')
-    const status = ref('')
-    const role = ref('')
-    const currentPage4 = ref(4)
+    const tableItem = ref()
     const dialogTitle = ref('')
     const showDialog = ref(false)
-    const tableData = ref([])
-    const siteIdArr=ref([])
 
-    // // 表头样式设置
-    const headClass = () => {
-      return 'background:#FAFAFA;'
-    }
+    const tableData = ref()
+    const currentPage = ref(1)
+    const pageSize = ref(15)
+    const total = ref(0)
 
-    const handleSizeChange = (val) => {
-      pageSize.value = val
-      list()
-    }
-    const handleCurrentChange = (val) => {
-      currentPage.value = val
-      list()
-    }
+    const status=ref('')
+    const tenantType=ref('')
+    const tenantName=ref('')
+    const tenantManager=ref('')
+    // const status=ref('')
 
-    //用户列表
-    function list() {
-      store.commit('TimeAll_function', dateTime.value)
-      const time = store.state.Time_Data
-      api
-        .list({
-          pageSize: pageSize.value,
-          pageNum: currentPage.value,
-          status: status.value,
-          userName: userName.value,
-          beginTime: time[0],
-          endTime: time[1],
-          // platformAreaName: platformAreaName.value,
-        })
-        .then((requset) => {
-          if (requset.status === 'SUCCESS') {
-            tableData.value = requset.data.rows
-            total.value = requset.data.total
-          } else {
-            ElMessage.error(requset.msg)
-          }
-        })
-    }
+    // const dateTime = ref([
+    //   new Date(2021, 8, 10, 10, 10),
+    //   new Date(2021, 10, 11, 10, 10),
+    // ])
+     const dateTime = ref('')
+    const select = ref(1)
+
+    const tabPosition = ref('one')
+    const input = ref('')
+    const region = ref()
 
-    const tableItem = reactive([])
     // 添加操作
     const addItem = () => {
       tableItem.value = {
-        nickName: '',
-        userName: '',
-        sex: '1',
-        phonenumber: '',
-        createTime: '',
-        roleName: '',
-        password: '',
+        siteId: '',
+        time: ['', ''],
+        startTime: '',
+        endTime: '',
+        phone: '',
+        contacts: '',
+        planType: '',
+        type: '',
       }
       dialogTitle.value = '新增'
       showDialog.value = true
     }
-
-    // 查看
-    const checkItem = (row) => {
-      siteIdArr.value=[]
+    // 编辑操作
+    const editRow = (row) => {
       console.log(row)
-      api.authRole({}, row.userId).then((requset) => {
-        if (requset.status === 'SUCCESS') {
-          tableItem.value.roleId= requset.data.user.roles[0].roleId
-          var newArray= requset.data.userSite
-           newArray.forEach(function(item){
-             siteIdArr.value.push(item.siteId)
+      tableItem.value = {
+        id: row.id,
+        siteId: row.siteId,
+        time: [row.startTime, row.endTime],
+        startTime: row.startTime,
+        endTime: row.endTime,
+        phone: row.phone,
+        contacts: row.contacts,
+        planType: row.planType,
+        type: row.type,
+      }
+      dialogTitle.value = '编辑'
+      showDialog.value = true
+    }
 
-           })
-           tableItem.value.siteId= siteIdArr.value
+    // 关闭操作
+    const closeDialog = (flag) => {
+      if (flag) {
+        // 重新刷新表格内容
+        this.fetchData()
+      }
+      showDialog.value = false
+      Select()
+    }
+
+    //删除 是否删除  ---- 是
+    const handleDelete = (row) => {
+      api.plannedOutageDel({ id: row.id }).then((requset) => {
+        if (requset.status === 'SUCCESS') {
+          ElMessage.success({
+            message: '删除成功',
+            type: 'success',
+          })
+          Select()
         } else {
           ElMessage.error(requset.msg)
         }
       })
-      tableItem.value = row
-      dialogTitle.value = '查看'
-      showDialog.value = true
+    }
+    //是否删除  ---- 否
+    const cancelEvent = () => {
+      console.log('cancel!')
     }
 
-    // 编辑操作
-    const editRow = (row) => {
-      siteIdArr.value=[]
-      console.log(row)
-      api.authRole({}, row.userId).then((requset) => {
-        if (requset.status === 'SUCCESS') {
-          tableItem.value.roleId= requset.data.user.roles[0].roleId
+    //查询设备列表
+    function Select() {
+      store.commit('TimeAll_function', dateTime.value)
+      const time = store.state.Time_Data
+      api
+        .getTenantData({
+          size: pageSize.value,
+          page: currentPage.value,
+          startTime: time[0]?time[0]:'',
+          endTime: time[1]?time[1]:'',
+          status:status.value,
+          tenantType: tenantType.value,
+          tenantName:tenantName.value,
+          tenantManager:tenantManager.value
+          
+        })
+        .then((requset) => {
+          if (requset.status === 'SUCCESS') {
+            tableData.value = requset.data.records.map((val) => {
+              store.commit('getTimestampAll', val.startTime)
+              val.startTime = store.state.timeProcessing
+              store.commit('getTimestampAll', val.endTime)
+              val.endTime = store.state.timeProcessing
+              store.commit('getTimestampAll', val.createTime)
+              val.createTime = store.state.timeProcessing
+            })
+            tableData.value = requset.data.records
+            total.value = requset.data.total
+     
+          } else {
+            ElMessage.error(requset.msg)
+          }
+        })
+    }
 
-           var newArray= requset.data.userSite
-           newArray.forEach(function(item){
-             siteIdArr.value.push(item.siteId)
+    onMounted(() => {
+      Select()
+    })
 
-           })
-           tableItem.value.siteId= siteIdArr.value
-            
-        } else {
-          ElMessage.error(requset.msg)
-        }
+    const handleSizeChange = (val) => {
+      pageSize.value = val
+      Select()
+    }
+    const handleCurrentChange = (val) => {
+      currentPage.value = val
+      Select()
+    }
+    // 表头样式设置
+    const goVariableList = () => {
+      // 跳转至订单列表页面传参
+      this.$router.push({
+        path: '../siteManage/variableList/index.vue',
       })
+      // this.$router.push({ name:'variableList'})
+    }
+    const headClass = () => {
+      return 'background:#FAFAFA;'
+    }
+    //处理状态状态值变色
+  
 
-
-      // tableItem.value = row
-      tableItem.value={
-        nickName:row.nickName,
-        userName:row.userName,
-        sex:row.sex,
-        phonenumber:row.phonenumber,
-        password:row.password,
-        createTime:row.createTime,
-        roleId:row.roleId,
-        userId:row.userId
+     const cellStyle = ({ row, column, rowIndex, columnIndex }) => {
+      row, column, rowIndex
+      // console.log(row, column, rowIndex)
+    
+      if (columnIndex) {
+        // return `text-align:left;cursor:pointer;`
+      } else {
+        return ''
       }
-
-      dialogTitle.value = '编辑'
-      showDialog.value = true
     }
 
-    // 关闭操作
-    const closeDialog = () => {
-      showDialog.value = false
-      
-      list()
+     //导出
+    const DataReportExport = () => {
+      store.commit('TimeAll_function', dateTime.value)
+      const time = store.state.Time_Data
+      api
+        .outagePlanListExport({
+           type: region.value,
+          startTime: time[0]?time[0]:'',
+          endTime: time[1]?time[1]:'',
+        })
+        .then((requset) => {
+          if (requset.status === 'SUCCESS') {
+            window.location.href = window.PLATFROM_CONFIG.fileUrl + requset.data
+            ElMessage.success({
+              message: '导出成功',
+              type: 'success',
+            })
+          } else {
+            ElMessage.error(requset.msg)
+          }
+        })
     }
+    return {
+      cellStyle,
+      headClass,
+      goVariableList,
+     
+      handleDelete,
+      cancelEvent,
+      closeDialog,
+      editRow,
+      addItem,
+      Select,
 
-    onMounted(() => {
-      list()
-    })
+      store,
 
-    return {
-      userName,
-      phone,
-      status,
-      role,
-      tableItem,
-      currentPage4,
-      dialogTitle,
-      showDialog,
-      tableData,
       total,
       pageSize,
       currentPage,
+       handleSizeChange,
+      handleCurrentChange,
 
+      tenantType,
+      tableData,
+      tenantName,
+      tenantManager,
+      status,
+
+      showDialog,
+      tabPosition,
+      select,
       dateTime,
-      store,
-      siteIdArr,
-      list,
-      handleSizeChange,
-      handleCurrentChange,
-      headClass,
-      checkItem,
-      addItem,
-      editRow,
-      closeDialog,
+      tableItem,
+      dialogTitle,
+      input,
+      region,
+
+      DataReportExport
     }
   },
 })
 </script>
 
-
 <style lang="scss" scoped>
 </style>