import type { TopLayoutType } from 'lib/type/TopLayout'
import { ElMessage } from 'element-plus'
import { indexStore } from 'lib/stores'
import login from 'src/api/login'
import clipboard from 'clipboard'
import 'src/layout/TopLayout.scss'
import TableLayout from 'lib/layout/TableLayout.vue'
import message from 'lib/utils/message'
import type { Form, FormData } from 'lib/type/TableData'
import { formatConfig } from 'src/tools'

// const TableLayout: any = utils.deepClone(tl)
const store = indexStore()
const data: TopLayoutType = {
  userButtons: [
    // {
    //   name: '修改配置',
    //   type: 'success',
    //   icon: 'EditPen',
    //   onClick(self) {
    //     self.methods?.getConfig(self)
    //     ;(self.bean as any).configForm.show = 'form'
    //   }
    //   // getHide() {
    //   //   return store.$state.kwargs.role != 1
    //   // }
    // },
    // {
    //   name: '用户信息',
    //   type: 'success',
    //   icon: 'User',
    //   onClick(self) {
    //     ;(self.bean as any).userInfoDialogShow = true
    //   }
    // },
    // {
    //   name: '修改密码',
    //   type: 'warning',
    //   icon: 'Key',
    //   onClick(self) {
    //     ;(self.bean as any).resetPasswordDialogShow = true
    //   }
    // }
  ],
  bean: {
    userInfoDialogShow: false,
    resetPasswordDialogShow: false,
    resetPasswordInput: '',
    resetPasswordInputOld: '',
    resetPasswordInputTwo: '',
    configForm: {
      hideButton: true,
      show: false,
      data: [],
      async subFun(self, data) {
        // console.log(data)
        for (const key in data){
          if (typeof data[key] === "object" && Array.isArray(data[key])){
            data[key] = data[key].join(",")
          }
        }
        return login.editorConfig(data)
      }
    } as Form
  },
  methods: {
    handleEditorConfigSubmit(self: TopLayoutType) {
      login.editorConfig((self.bean as any).editorConfigInfo).then((res: any) => {
        if (res.code == 0) {
          ElMessage.success('配置修改成功')
        } else {
          ElMessage.success('配置修改失败')
        }
        self.methods?.updateConfig(self)
      })
    },
    handleResetPasswordSubmit(self: TopLayoutType) {
      if ((self.bean as any).resetPasswordInputOld === '') {
        ElMessage.error('旧密码不能为空')
        return
      }
      if ((self.bean as any).resetPasswordInput === '') {
        ElMessage.error('密码不能为空')
        return
      }
      if ((self.bean as any).resetPasswordInput !== (self.bean as any).resetPasswordInputTwo) {
        ElMessage.error('两次输入的密码不一致')
        return
      }
      login
        .resetPassWord({
          old_password: (self.bean as any).resetPasswordInputOld,
          password: (self.bean as any).resetPasswordInput
        })
        .then((res: any) => {
          if (res.code === 0) {
            ElMessage.success('密码修改成功')
            setTimeout(() => {
              store.logout()
            }, 1000)
          } else {
            ElMessage.error(res.message)
          }
        })
    },
    copy(text: string) {
      clipboard.copy(text)
      message.success('复制成功')
    },
    async getConfig(self: TopLayoutType) {
      const res = await login.getConfig()
      let formData: FormData[] = res.data
      formData = formatConfig(formData)
      ;(self.bean as any).configForm.data = formData
    }
  },
  launchTask: [
    // async (self) => {
    //   const res = await login.getHomeData({})
    //   ;(self.bean as any).homeData = res.data
    // }
  ],
  addNods: [
    (self) => {
      return (
        <el-dialog width="500" append-to-body vModel={(self.bean as any).userInfoDialogShow}>
          <el-form label-width="100">
            <el-form-item label="名称：">
              <div>{store.$state.kwargs.realname}</div>
            </el-form-item>
            <el-form-item label="角色：">
              <div>{store.$state.kwargs.role_name}</div>
            </el-form-item>
            <el-form-item label="级别：">
              <div>{store.$state.kwargs.level_name}</div>
            </el-form-item>
            <el-form-item label="上级名称：">
              <div>{store.$state.kwargs.parent_info.realname}</div>
            </el-form-item>
            {/* <el-form-item label="上级角色：">
              <div>{store.$state.kwargs.parent_info.role_name}</div>
            </el-form-item>
            <el-form-item label="上级级别：">
              <div>{store.$state.kwargs.parent_info.level_name}</div>
            </el-form-item> */}
            {/*<el-form-item label="分享二维码：">*/}
            {/*  <img style={{*/}
            {/*    width:"256px",*/}
            {/*    height:"256px"*/}
            {/*  }} src={'data:image/png;base64,' + self.bean?.homeData.qrcode} />*/}
            {/*</el-form-item>*/}
            {/*<el-form-item label="分享链接：">*/}
            {/*  <div class="flex-row" style={{*/}
            {/*    alignItems:"center",*/}
            {/*    columnGap:"10px"*/}
            {/*  }}>*/}
            {/*    <span>{self.bean?.homeData.url}</span>*/}
            {/*    <el-button*/}
            {/*      type="primary"*/}
            {/*      size="small"*/}
            {/*      onClick={() => {*/}
            {/*        self.methods?.copy(self.bean?.homeData.url)*/}
            {/*      }}*/}
            {/*    >*/}
            {/*      复制*/}
            {/*    </el-button>*/}
            {/*  </div>*/}
            {/*</el-form-item>*/}
          </el-form>
        </el-dialog>
      )
    },
    (self) => {
      return (
        <el-dialog width="500" append-to-body vModel={(self.bean as any).resetPasswordDialogShow}>
          <el-form label-width="80">
            <el-form-item label="旧密码">
              <el-input
                type="password"
                vModel={(self.bean as any).resetPasswordInputOld}
              ></el-input>
            </el-form-item>
            <el-form-item label="新密码">
              <el-input type="password" vModel={(self.bean as any).resetPasswordInput}></el-input>
            </el-form-item>
            <el-form-item label="再次输入">
              <el-input
                type="password"
                vModel={(self.bean as any).resetPasswordInputTwo}
              ></el-input>
            </el-form-item>
            <el-form-item>
              <el-button
                onClick={() => {
                  ;(self.bean as any).resetPasswordDialogShow = false
                }}
              >
                取消
              </el-button>
              <el-button
                type="primary"
                onClick={() => {
                  ;(self.methods as any).handleResetPasswordSubmit(self)
                }}
              >
                确定
              </el-button>
            </el-form-item>
          </el-form>
        </el-dialog>
      )
    },
    (self) => {
      let element: any = <></>
      if (self.bean && TableLayout.methods) {
        element = TableLayout.methods.createForm.call(
          {
            ...TableLayout.methods,
            ...self.this_,
            fetchData: () => {}
          },
          self.bean.configForm,
          {
            id: 'form'
          }
        )
      }
      return element
    }
  ]
}
export default data