<template>
  <HomeHead class="top"></HomeHead>
  <div class="flex w-full h-full">
    <AppBlock class="w-full p30px text-#000">
      <div class="font-600 flex items-center">
        <!-- <img src="./images/logo.svg" class="h56px mr21px" /> -->
        <div class="text-36px text-#000">差别化云空间</div>
      </div>

      <el-tabs
        type="card"
        v-model="activeName"
        class="menu_styl h50px mt30px text-20px"
        @tab-click="handleClick"
      >
        <el-tab-pane name="first" class="menu_styl">
          <template #label>
            <span class="custom-tabs-label">
              <span class="text-20px my40px">顶部列表</span>
            </span>
          </template>
          <div class="p30px cont relative w100% h800px overflow-y-auto mb-80px">
            <div
              v-for="item in dataC"
              class="my20px bg-#f5f5f5 rounded-15px items-center flex w-full min-h200px"
            >
              <img :src="item.url" class="max-w250px max-h350px min-w250px" />
              <span class="ml40px text-20px min-w845px max-w845px">
                <span>标&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;题： {{ item.title }}</span
                ><br /><br /><br />
                <span
                  >相关文件：
                  <span v-if="item.fileList?.[0]">{{ item.fileList[0].name }}</span></span
                >
              </span>

              <div class="w200px ml30px">
                <el-button size="small" type="primary" @click="handleEditC(item)">编辑</el-button>
                <el-button size="small" type="danger" @click="handleDeleteC(item)">删除</el-button>
              </div>
            </div>

            <div class="my20px fixed bottom-25px left-20% z-2000 h50px w-full">
              <el-button type="primary" @click="handleEditC({})">新增列表内容</el-button>
              <el-button type="primary" @click="getUser(1)"> 查看范围</el-button>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane name="niandu" class="menu_styl">
          <template #label>
            <span class="custom-tabs-label">
              <span class="text-20px">大标题1</span>
            </span>
          </template>
          <div class="p30px cont relative w100% h800px overflow-y-auto">
            <div v-for="item in dataA" class="my20px bg-#f5f5f5 rounded-15px flex w-full">
              <div>
                <img :src="item.url" class="max-w180px max-h350px min-w180px" />
              </div>
              <div class="min-w600px mt50px text-18px">
                <span class="ml40px text-20px">底部大标题： {{ item.titles }}</span>
                <br /><br />
                <br /><br />

                <span class="ml40px text-20px mt40px"
                  >标&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;题：
                  {{ item.title }}</span
                >
                <br /><br />
                <br /><br />

                <span class="ml40px text-20px mt40px"
                  >位&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;置：
                  {{ item.indexId === '1' ? '左边内容' : '右边内容' }}</span
                >
              </div>
              <div class="max-w100px min-w100px mt120px">
                <span class="text-18px">文件列表:</span>
              </div>
              <div class="max-w250px min-w250px mt25px flex items-center">
                <span v-if="item.fileList" v-for="i in item.fileList"
                  ><span class="mt5px">{{ i.name }}</span
                  ><br /><br
                /></span>
              </div>

              <div class="w160px ml30px mt120px">
                <el-button size="small" type="primary" @click="handleEditA(item)">编辑</el-button>
                <el-button size="small" type="danger" @click="handleDeleteA(item)">删除</el-button>
              </div>
            </div>

            <!-- <el-button type="primary" @click="handleEditA(editA)" class="my20px fixed bottom-30px left-20% z-2000">新增年度内容</el-button> -->
            <div class="my20px fixed bottom-25px left-20% z-2000 h50px w-full">
              <el-button type="primary" @click="handleEditA({})">新增列表内容</el-button>
              <el-button type="primary" @click="getUser(2)" @CloseThis="CloseThiss">
                查看范围</el-button
              >
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane name="second" class="menu_styl">
          <template #label>
            <span class="custom-tabs-label">
              <span class="text-20px">大标题2</span>
            </span>
          </template>
          <div class="p30px cont relative w100% h800px overflow-y-auto">
            <div v-for="item in dataB" class="my20px bg-#f5f5f5 rounded-15px flex w-full">
              <div>
                <img :src="item.url" class="max-w180px max-h350px min-w180px" />
              </div>
              <div class="min-w600px mt50px">
                <span class="ml40px text-20px">底部大标题： {{ item.titles }}</span>
                <br /><br />
                <br /><br />

                <span class="ml40px text-20px mt40px"
                  >标&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;题：
                  {{ item.title }}</span
                >
                <br /><br />
                <br /><br />

                <span class="ml40px text-20px mt40px"
                  >位&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;置：
                  {{ item.indexId === '1' ? '左边内容' : '右边内容' }}</span
                >
              </div>
              <div class="max-w100px min-w100px mt120px">
                <span class="text-20px">文件列表:</span>
              </div>
              <div class="max-w250px min-w250px mt20px flex items-center">
                <span v-if="item.fileList" v-for="i in item.fileList"
                  ><span class="mt5px">{{ i.name }}</span
                  ><br /><br
                /></span>
              </div>

              <div class="w120px ml30px mt120px">
                <el-button size="small" type="primary" @click="handleEditB(item)">编辑</el-button>
                <el-button size="small" type="danger" @click="handleDeleteB(item)">删除</el-button>
              </div>
            </div>

            <div class="my20px fixed bottom-25px left-20% z-2000 h50px w-full">
              <el-button type="primary" @click="handleEditB({})">新增列表内容</el-button>
              <el-button type="primary" @click="getUser(3)"> 查看范围</el-button>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane name="fourth" class="menu_styl">
          <template #label>
            <span class="custom-tabs-label">
              <span class="text-20px">研究方向</span>
            </span>
          </template>
          <div class="p30px cont relative w100% h800px overflow-y-auto">
            <Modify></Modify>

            <!-- <el-button type="primary" @click="handleEditC(editC)" class="my20px absolute bottom-0px left-0px">新增列表内容</el-button> -->
          </div>
        </el-tab-pane>
        <el-tab-pane name="pro" class="menu_styl">
          <template #label>
            <span class="custom-tabs-label">
              <span class="text-20px">PRO成员</span>
            </span>
          </template>

          <ModifyPor />
        </el-tab-pane>
        <el-tab-pane name="list" class="menu_styl">
          <template #label>
            <span class="custom-tabs-label">
              <span class="text-20px">解决方案列表</span>
            </span>
          </template>
          <ModifyList />
        </el-tab-pane>
      </el-tabs>
    </AppBlock>
  </div>
  <n-modal v-model:show="shomkC">
    <div class="bg-#FFF p30px">
      <el-form :model="editC" label-width="120px" :inline="true">
        <el-form-item label="标题">
          <el-input v-model="editC.title" />
        </el-form-item>
        <br />
        <!-- <el-form-item label="所属类型">
          <n-select class="min-w220px" size="large" v-if="options" v-model:value="editC.catId" :options="options"   label-field="cateName"  value-field="id" />

        </el-form-item> -->
        <br />
        <el-form-item label="图片">
          <el-upload
            v-model:file-list="editC.files"
            :headers="header"
            action="/test-api/common/upload"
            list-type="picture-card"
            :on-success="handlePreview"
            :on-remove="handleRemove"
            :before-upload="onUpload"
            :limit="1"
          >
            <el-icon>
              <Plus />
            </el-icon>
          </el-upload>

          <el-dialog v-model="dialogVisible">
            <img w-full :src="dialogImageUrl" alt="Preview Image" />
          </el-dialog>
        </el-form-item>
        <br />
        <el-form-item label="文件" v-if="editC.fileList">
          <el-upload
            v-model:file-list="editC.fileList"
            class="upload-demo"
            :headers="header"
            action="/test-api/common/upload"
            :limit="1"
          >
            <el-button type="primary">选择文件</el-button>
          </el-upload>
        </el-form-item>
        <br />
        <el-form-item label="是否置顶">
          <el-switch
            v-model="editC.isTop"
            active-text="置顶"
            inactive-text="不置顶"
            :inactive-value="0"
            :active-value="1"
          ></el-switch>
        </el-form-item>
        <br />
        <el-form-item label="是否定时发送">
          <el-switch
            v-model="editC.isPublish"
            active-text="是"
            inactive-text="否"
            :inactive-value="0"
            :active-value="1"
            @change="(val) => (editC.publishTime = val ? pickerOptions.day : '')"
          ></el-switch>
        </el-form-item>
        <br />
        <el-form-item label="发布时间" v-if="editC.isPublish == 1">
          <el-date-picker
            v-model="editC.publishTime"
            align="right"
            type="date"
            placeholder="选择日期"
            :disabledDate="pickerOptions.disabledDate"
            :shortcuts="pickerOptions.shortcuts"
            :value-format="pickerOptions.valueFormat"
          >
          </el-date-picker>
        </el-form-item>
      </el-form>
      <hr class="mb15px border-#f1f1f1" />
      <el-form-item>
        <el-button type="primary" @click="onSubmitC(editC)">确认</el-button>
      </el-form-item>
    </div>
  </n-modal>

  <n-modal v-model:show="shomkB">
    <div class="bg-#FFF p30px">
      <el-form :model="editC" label-width="120px" :inline="true">
        <el-form-item label="名字">
          <el-input v-model="fuckList.title" />
        </el-form-item>
        <br />
        <el-form-item label="照片">
          <el-upload
            v-model:file-list="fuckList.files"
            :headers="header"
            action="/test-api/common/upload"
            list-type="picture-card"
            :on-success="handlePreviews"
            :on-remove="handleRemove"
            :on-error="handErro"
            :on-exceed="handOnExceed"
            :limit="1"
          >
            <el-icon>
              <Plus />
            </el-icon>
          </el-upload>
          <br />
          <el-dialog v-model="dialogVisible">
            <img w-full :src="dialogImageUrl" alt="Preview Image" />
          </el-dialog>
        </el-form-item>
        <br />
        <el-form-item label="职位">
          <el-input v-model="fuckList.time" />
        </el-form-item>
        <br />
        <el-form-item label="研究方向">
          <el-input v-model="fuckList.dowhat" />
        </el-form-item>

        <br />
        <el-form-item label="文件">
          <el-upload
            v-model:file-list="fuckList.fileList"
            class="upload-demo"
            :before-upload="beforeUpload"
            :headers="header"
            action="/test-api/common/upload"
          >
            <el-button type="primary">选择文件</el-button>
          </el-upload>
        </el-form-item>
      </el-form>
      <hr class="mb15px border-#f1f1f1" />
      <el-form-item>
        <el-button type="primary" @click="onSubmits(fuckList)">确认</el-button>
      </el-form-item>
    </div>
  </n-modal>

  <n-modal v-model:show="shomkA">
    <div class="bg-#FFF p30px">
      <el-form :model="editA" label-width="120px" :inline="true">
        <el-form-item label="底部大标题">
          <el-input v-model="editA.titles" />
        </el-form-item>
        <br />
        <el-form-item label="标题">
          <el-input v-model="editA.title" />
        </el-form-item>
        <br />
        <!-- <el-form-item label="编辑模块">
          <el-radio-group v-model="editA.indexId" class="ml-4">
            <el-radio label="1" size="large">左侧内容</el-radio>
            <el-radio label="2" size="large">解决方案创造</el-radio>
            <el-radio label="2" size="large">右侧内容</el-radio>
          </el-radio-group>
        </el-form-item>
        <br> -->
        <el-form-item label="封面图">
          <el-upload
            v-model:file-list="editA.files"
            :headers="header"
            action="/test-api/common/upload"
            list-type="picture-card"
            :on-success="handlePreview1"
            :on-remove="handleRemove"
            :on-error="handErro"
            :on-exceed="handOnExceed"
            :limit="1"
          >
            <el-icon>
              <Plus />
            </el-icon>
          </el-upload>
          <br />
          <el-dialog v-model="dialogVisible">
            <img w-full :src="dialogImageUrl" alt="Preview Image" />
          </el-dialog>
        </el-form-item>
        <br />
        <el-form-item label="文件">
          <el-upload
            v-model:file-list="editA.fileList"
            class="upload-demo"
            :headers="header"
            action="/test-api/common/upload"
            :on-change="handleChange"
          >
            <el-button type="primary">选择文件</el-button>
          </el-upload>
        </el-form-item>
        <br />
        <el-form-item label="是否置顶">
          <el-switch
            v-model="editA.isTop"
            active-text="置顶"
            inactive-text="不置顶"
            :inactive-value="0"
            :active-value="1"
          ></el-switch>
        </el-form-item>
        <br />
        <el-form-item label="是否定时发送">
          <el-switch
            v-model="editA.isPublish"
            active-text="是"
            inactive-text="否"
            :inactive-value="0"
            :active-value="1"
            @change="(val) => (editA.publishTime = val ? pickerOptions.day : '')"
          ></el-switch>
        </el-form-item>
        <br />
        <el-form-item label="发布时间" v-if="editA.isPublish == 1">
          <el-date-picker
            v-model="editA.publishTime"
            align="right"
            type="date"
            placeholder="选择日期"
            :disabledDate="pickerOptions.disabledDate"
            :shortcuts="pickerOptions.shortcuts"
            :value-format="pickerOptions.valueFormat"
          >
          </el-date-picker>
        </el-form-item>
      </el-form>
      <hr class="mb15px border-#f1f1f1" />
      <el-form-item class="">
        <el-button type="primary" class="w88px justify-center" @click="onSubmitA(editA)"
          >确认</el-button
        >
      </el-form-item>
    </div>
  </n-modal>
  <n-modal v-model:show="shomkD">
    <div class="bg-#FFF p30px">
      <el-form :model="editB" label-width="120px" :inline="true">
        <el-form-item label="底部大标题标题">
          <el-input v-model="editB.titles" />
        </el-form-item>
        <br />
        <el-form-item label="标题">
          <el-input v-model="editB.title" />
        </el-form-item>
        <br />
        <el-form-item label="封面图">
          <el-upload
            v-model:file-list="editB.files"
            :headers="header"
            action="/test-api/common/upload"
            list-type="picture-card"
            :on-success="handlePreview2"
            :on-remove="handleRemove"
            :on-exceed="handOnExceed"
            :limit="1"
          >
            <el-icon>
              <Plus />
            </el-icon>
          </el-upload>
          <br />
          <el-dialog v-model="dialogVisible">
            <img w-full :src="dialogImageUrl" alt="Preview Image" />
          </el-dialog>
        </el-form-item>
        <br />
        <el-form-item label="文件">
          <el-upload
            v-model:file-list="editB.fileList"
            class="upload-demo"
            :headers="header"
            action="/test-api/common/upload"
            :on-change="handleChange"
          >
            <el-button type="primary">选择文件</el-button>
          </el-upload>
        </el-form-item>
        <br />
        <el-form-item label="是否置顶">
          <el-switch
            v-model="editB.isTop"
            active-text="置顶"
            inactive-text="不置顶"
            :inactive-value="0"
            :active-value="1"
          ></el-switch>
        </el-form-item>
        <br />
        <el-form-item label="是否定时发送">
          <el-switch
            v-model="editB.isPublish"
            active-text="是"
            inactive-text="否"
            :inactive-value="0"
            :active-value="1"
            @change="(val) => (editB.publishTime = val ? pickerOptions.day : '')"
          ></el-switch>
        </el-form-item>
        <br />
        <el-form-item label="发布时间" v-if="editB.isPublish == 1">
          <el-date-picker
            v-model="editB.publishTime"
            align="right"
            type="date"
            placeholder="选择日期"
            :disabledDate="pickerOptions.disabledDate"
            :shortcuts="pickerOptions.shortcuts"
            :value-format="pickerOptions.valueFormat"
          >
          </el-date-picker>
        </el-form-item>
      </el-form>
      <hr class="mb15px border-#f1f1f1" />
      <el-form-item>
        <el-button type="primary" @click="onSubmitB(editB)">确认</el-button>
      </el-form-item>
    </div>
  </n-modal>
  <n-modal v-model:show="showModal">
    <UserList :userDataList="setUserList" @clickChild="handleChild" @CloseThis="CloseThiss" />
  </n-modal>
</template>

<script setup lang="ts">
import AppBlock from '@/components/AppBlock.vue'
import { useMessage, NModal, NSelect, NSpace } from 'naive-ui'
import HomeHead from '@/views/home/components/HomeHead.vue'
import { Plus } from '@element-plus/icons-vue'
import type { UploadProps, UploadUserFile } from 'element-plus'
import { useUserStore } from '@/stores/modules/user'
import { getLabActList, getLabCsrActList, addLab, getCateList } from '@/api/daikin/base'
import Modify from './modifys.vue'
import ModifyPor from './modify.vue'
import ModifyList from './component/modify.vue'
import UserList from '@/views/home/intelligence/process/UserPages.vue'
const ids = ref('')
const { push } = useRouter()
import { pickerOptions } from '@/utils/date'

const store = useUserStore()
const message = useMessage()
const header = { token: store.user.token }
const dialogImageUrl = ref('')
const dialogVisible = ref(false)

const dataA = ref([])
const dataB = ref([])
const dataC = ref([])
const dataD = ref([])
const dataE = ref([])
const options = ref([])

const editC = ref()
const editD = ref()
const editA = ref()
const editB = ref()

const shomkA = ref(false)
const shomkB = ref(false)
const shomkC = ref(false)
const shomkD = ref(false)

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

const activeName = ref('first')

/**"memberContentIsSelect": 1, //成员是否有权限 1是 2否
 * "bannerContentIsSelect": 2, //banner是否有权限 1是 2否
 * "leftContentIsSelect": 1, //左大是否有权限 1是 2否
 * "rightContentIsSelect": 1, //右大是否有权限 1是 2否
 * "actTopIsSelect": 2, //基础研究方向 第一条分类 是否有权限 1是 2否
  "actMidIsSelect": 2, //基础研究方向 第二条分类 是否有权限 1是 2否
  "actDownIsSelect": 2 //基础研究方向 第三条分类 是否有权限 1是 2否
 */
const memberUserLists = ref()
const leftUserLists = ref()
const rightUserLists = ref()
const bannerUserLists = ref()
const bannerContentUserLists = ref()
const leftContentUserLists = ref()
const rightContentUserLists = ref()
onMounted(async () => {
  getData()
})

async function getData() {
  // const { data: datas } = await getLabCsrActList()
  const { data } = await getLabActList()
  const {
    id,
    memberContent,
    bannerContent,
    leftContent,
    rightContent,
    leftUserList,
    rightUserList,
    memberUserList,
    bannerUserList,
    bannerContentUserList,
    leftContentUserList,
    rightContentUserList
  } = data

  // const { data: dataBot } = await getCateList({ indexId: 1 })
  memberUserLists.value = memberUserList
  leftUserLists.value = leftUserList
  rightUserLists.value = rightUserList
  bannerUserLists.value = bannerUserList
  bannerContentUserLists.value = bannerContentUserList
  leftContentUserLists.value = leftContentUserList
  rightContentUserLists.value = rightContentUserList
  // options.value = dataBot
  ids.value = id
  // console.log(dataBot,options.value)
  if (leftContent && leftContent.length > 0) {
    dataA.value = leftContent.map((obj: any, indx: number) => ({
      ...obj,
      id: indx + 1
    }))
  }

  //   dataB.value = B
  if (rightContent && rightContent.length > 0) {
    dataB.value = rightContent.map((obj: any, indx: number) => ({
      ...obj,
      id: indx + 1
    }))
  }

  // dataC.value = bannerContent
  // dataD.value = D
  if (bannerContent && bannerContent.length > 0) {
    dataC.value = bannerContent.map((obj: any, indx: number) => ({
      ...obj,
      id: indx + 1
    }))
  }
  if (memberContent) {
    dataD.value = memberContent
  }
  userList.value = data.userIdList
  // console.log(  fuckList.value)
}

async function modify(
  objA: any,
  objB: any,
  objC: any,
  objD: any,
  objE: any,
  objF: any,
  objG: any,
  objH: any
) {
  const leftContent = unref(objA)
  const rightContent = unref(objB)
  const bannerContent = unref(objC)
  const memberContent = unref(objD)
  const bannerUserList = unref(objE)
  const leftUserList = unref(objF)
  const rightUserList = unref(objG)
  const memberUserList = unref(objH)
  const id = ids.value

  // if(!userList.value){
  //   message.info("请选择通知范围")
  //   return
  // }
  const userIdList = userList.value
  console.log(bannerContent)
  const { code, msg } = await addLab({
    id,
    bannerUserList,
    leftUserList,
    rightUserList,
    memberUserList,
    memberContent,
    bannerContent,
    rightContent,
    leftContent
  })
  if (code === 200) {
    message.success('修改成功')
  } else message.warning(msg)
  // window.location.reload();
  getData()
}

// async function onSubmitD(row: { id: number; url: any; title: string; time: string; files: never[]; fileList: never[] }) {
//   console.log(swiperList.value, row.id)
//   swiperList.value.map(obj => {
//     obj.id === row.id ? { ...obj, ...row } : obj

//     // console.log(i.id)
//   })
//   const existingIds = swiperList.value.map(obj => obj.id);
//   if (!existingIds.includes(row.id)) {
//     if (row.id === '') {
//       row.id = Math.floor(Math.random() * 100)
//     }
//     if (!row.catId) {
//       message.error("所属类型必选！")
//       return
//     }
//     swiperList.value.push(row);
//   }
//   shomkB.value = false
//   console.log(swiperList.value)

// }

async function onSubmitA(row: { id: string | number; indexId: any }) {
  dataA.value.map((obj) => {
    obj.id === row.id ? { ...obj, ...row } : obj

    // console.log(i.id)
  })
  const existingIds = dataA.value.map((obj) => obj.id)
  if (!existingIds.includes(row.id)) {
    if (row.id === '') {
      row.id = Math.floor(Math.random() * 100)
    }
    if (!row.indexId) {
      message.error('所属类型必选！')
      return
    }
    dataA.value.push(row)
  }
  shomkA.value = false
  modify(
    dataA.value,
    dataB.value,
    dataC.value,
    dataD.value,
    bannerUserLists.value,
    leftUserLists.value,
    rightUserLists.value,
    memberUserLists.value
  )
}

async function onSubmitB(row: {
  id: number
  url: any
  title: string
  time: string
  files: never[]
  fileList: never[]
  isTop?: any
  isPublish?: any
  publishTime?: any
}) {
  // console.log(dataB.value, row.id)
  dataB.value.map((obj) => {
    obj.id === row.id ? { ...obj, ...row } : obj

    // console.log(i.id)
  })
  const existingIds = dataB.value.map((obj) => obj.id)
  if (!existingIds.includes(row.id)) {
    if (row.id === '') {
      row.id = Math.floor(Math.random() * 100)
    }
    dataB.value.push(row)
  }
  shomkD.value = false
  modify(
    dataA.value,
    dataB.value,
    dataC.value,
    dataD.value,
    bannerUserLists.value,
    leftUserLists.value,
    rightUserLists.value,
    memberUserLists.value
  )
}

async function onSubmitC(row: any) {
  // console.log(row)
  dataC.value.map((obj) => {
    obj.id === row.id ? { ...obj, ...row } : obj

    // console.log(i.id)
  })
  const existingIds = dataC.value.map((obj) => obj.id)
  if (!existingIds.includes(row.id)) {
    if (row.id === '') {
      row.id = Math.floor(Math.random() * 100)
    }
    // if(!row.catId){
    //   message.error("所属类型必选！")
    //   return
    // }
    dataC.value.push(row)
  }
  shomkC.value = false
  modify(
    dataA.value,
    dataB.value,
    dataC.value,
    dataD.value,
    bannerUserLists.value,
    leftUserLists.value,
    rightUserLists.value,
    memberUserLists.value
  )
  // console.log(dataC.value)
}

const handleEditC = (row: any) => {
  // console.log(row)
  if (row && row.url) {
    // console.log(row.files.length)
    if (row.files.length <= 0) {
      row.files.push({ url: row.url })
    } else {
      row.files.map((i) => {
        i.url = i.response.url
      })
    }
  } else {
    editC.value = {
      id: '',
      url: '',
      title: '',
      time: '',
      createTime: date,
      files: [],
      fileList: []
    }
  }
  shomkC.value = true
  if (!row) return
  editC.value = row

  console.log(editC.value)
}
const date = new Date()
const handleEditA = (row: any) => {
  // console.log(row)
  if (row && row.url) {
    row.updateTime = new Date()
    // console.log(row.files.length)
    if (row.files.length <= 0) {
      row.files.push({ url: row.url })
    } else {
      row.files.map((i) => {
        i.url = i.response.url
      })
    }
  } else {
    editA.value = {
      id: '',
      url: '',
      title: '',
      titles: '',
      createTime: new Date(),
      indexId: '1',
      files: [],
      fileList: []
    }
  }
  shomkA.value = true
  if (!row) return
  editA.value = row

  // console.log(editA.value)
}

const handleEditB = (row: any) => {
  // console.log(row)
  if (row && row.url) {
    row.updateTime = new Date()
    // console.log(row.files.length)
    if (row.files.length <= 0) {
      row.files.push({ url: row.url })
    } else {
      row.files.map((i) => {
        i.url = i.response.url
      })
    }
  } else {
    editB.value = {
      id: '',
      url: '',
      titles: '',
      createTime: new Date(),
      title: '',
      time: '',
      files: [],
      fileList: [],
      show: false
    }
  }
  shomkD.value = true
  if (!row) return
  editB.value = row

  // console.log(editB.value)
}

const handleDeleteA = (row: any) => {
  // console.log(dataA.value, row)
  dataA.value = dataA.value.filter((item) => item.id !== row.id)
  modify(
    dataA.value,
    dataB.value,
    dataC.value,
    dataD.value,
    bannerUserLists.value,
    leftUserLists.value,
    rightUserLists.value,
    memberUserLists.value
  )
}
const handleDeleteB = (row: any) => {
  // console.log(dataB.value, row)
  dataB.value = dataB.value.filter((item) => item.id !== row.id)
}
const handleDeleteC = (row: any) => {
  dataC.value = dataC.value.filter((item) => item.id !== row.id)
  modify(
    dataA.value,
    dataB.value,
    dataC.value,
    dataD.value,
    bannerUserLists.value,
    leftUserLists.value,
    rightUserLists.value,
    memberUserLists.value
  )
}

const handleRemove: UploadProps['onRemove'] = (uploadFile: any, uploadFiles: any) => {
  // console.log(uploadFile, uploadFiles)
}
const handOnExceed: UploadProps['onExceed'] = (uploadFile: any, uploadFiles: any) => {
  message.warning('最多只能上传一张图片！')
}
const handlePreview: UploadProps['onSuccess'] = (uploadFile: any) => {
  // console.log(uploadFile.url)

  if (uploadFile.code === 200) {
    editC.value.url = uploadFile.url
  } else {
    message.warning(uploadFile.msg)
    return
  }
}

const handlePreview1: UploadProps['onSuccess'] = (uploadFile: any) => {
  // console.log("++++++++++++++++++++++++++++")
  // console.log(uploadFile,editA.value)
  if (uploadFile.code === 200) {
    editA.value.url = uploadFile.url
  } else {
    message.warning(uploadFile.msg)
    return
  }
}
const handlePreview2: UploadProps['onSuccess'] = (uploadFile: any) => {
  // console.log("++++++++++++++++++++++++++++")
  if (uploadFile.code === 200) {
    editB.value.url = uploadFile.url
  } else {
    message.warning(uploadFile.msg)
    return
  }
}
const beforeUpload = (file: { type: string }) => {
  // Validate the file type before uploading
  const isPDF = file.type === 'application/pdf'
  if (!isPDF) {
    message.error('仅支持PDF文件上传')
  }
  return isPDF
}
const onUpload: UploadProps['onUpload'] = (uploadFile: any) => {
  // console.log("++++++++++++++++++++++++++++")
  // message.warning(uploadFile)
  // dataB.value.url = uploadFile.url
}
const userList = ref()
const showModal = ref(false)
const flg = ref()
const setUserList = ref()
const getUser = (id: any) => {
  showModal.value = !showModal.value
  flg.value = id
  if (id === 1) {
    setUserList.value = bannerContentUserLists.value
  } else if (id === 2) {
    setUserList.value = leftContentUserLists.value
  } else if (id === 3) {
    setUserList.value = rightContentUserLists.value
  }
}
// 获取子组件传过来的值
const handleChild = (data: any) => {
  const { showModal: show, multipleSelection } = data
  showModal.value = unref(Boolean(show))
  // userList.value = multipleSelection
  let userIdList: any[] = []
  multipleSelection.value.forEach((i: { userId: any }) => {
    // console.log(dataList.value)
    userIdList.push(i.userId)
  })

  if (flg.value === 1) {
    bannerUserLists.value = userIdList
  } else if (flg.value === 2) {
    leftUserLists.value = userIdList
  } else if (flg.value === 3) {
    rightUserLists.value = userIdList
  }
  modify(
    dataA.value,
    dataB.value,
    dataC.value,
    dataD.value,
    bannerUserLists.value,
    leftUserLists.value,
    rightUserLists.value,
    memberUserLists.value
  )
}
const CloseThiss = (data: boolean) => {
  showModal.value = data
}
</script>

<style lang="less">
.el-form-item__content {
  justify-content: center;
}

::-webkit-scrollbar {
  width: 1px;
}
.demo-tabs > .el-tabs__content {
  padding: 32px;
  color: #6b778c;
  font-size: 32px;
  font-weight: 600;
}
.cont {
  img {
    background-color: antiquewhite;
  }
}

.custom-tabs-label {
  padding: 30px;
}

.top {
  position: absolute;
  right: 30px;
  top: -92px;
}
</style>
