import type { BasicColumn } from '@/components/Table';
import { h } from 'vue';
import connectedIcon from '@/assets/images/table/camera-netConnect.png';
import unConnectedIcon from '@/assets/images/table/camera-netUnconnect.png';
import { ElTag } from 'element-plus';

export const queryTypeSelect = [
  {
    value: 'cameraIp',
    label: 'IP地址',
  },
  {
    value: 'name',
    label: '设备ID',
  },
];

export const protocalTypeSelect = [
  {
    value: 'haikang',
    label: '海康',
  },
  {
    value: 'dahua',
    label: '大华',
  },
  {
    value: 'anxus',
    label: '安迅士',
  },
  {
    value: 'huawei',
    label: '华为',
  },
];

export const cameraAddType = [
  {
    value: 'ip',
    label: 'IP/域名',
  },
  {
    value: 'ipRange',
    label: 'IP段',
  },
];

type CameraAddFormItem = {
  label: string;
  prop: string;
  placeholder: string;
  type: 'input' | 'select' | 'tree-select';
  option?: { value: any; label: any }[];
  required: boolean;
  rule?: any[];
  labelWidth?: string;
  disabled?: boolean;
};

export const cameraIPAddForm: CameraAddFormItem[] = [
  {
    label: '名称：',
    prop: 'name',
    placeholder: '请输入名称',
    type: 'input',
    required: true,
    rule: [{ required: true, message: '请输入名称', trigger: 'blur' }],
  },
  {
    label: 'IP地址：',
    prop: 'cameraIp',
    placeholder: '请输入IP地址',
    type: 'input',
    required: true,
    rule: [{ required: true, message: '请输入IP地址', trigger: 'blur' }],
  },
  {
    label: '端口：',
    prop: 'cameraPort',
    placeholder: '请输入端口号',
    type: 'input',
    required: true,
    rule: [{ required: true, message: '请输入端口号', trigger: 'blur' }],
  },
  {
    label: '协议类型：',
    prop: 'cameraType',
    placeholder: '请输入协议类型',
    type: 'select',
    required: true,
    option: protocalTypeSelect,
    rule: [{ required: true, message: '请输入协议类型', trigger: 'blur' }],
  },
  {
    label: '用户名：',
    prop: 'username',
    placeholder: '请输入用户名',
    type: 'input',
    required: true,
    rule: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
  },
  {
    label: '场景：',
    prop: 'workspaceCode',
    placeholder: '请输入场景名称',
    type: 'tree-select',
    required: true,
    rule: [{ required: true, message: '请输入场景名称', trigger: 'blur' }],
  },
  {
    label: '密码：',
    prop: 'password',
    placeholder: '请输入用户名密码',
    type: 'input',
    required: true,
    rule: [{ required: true, message: '请输入用户名密码', trigger: 'blur' }],
  },
  {
    label: '工位负责人：',
    prop: 'principal',
    placeholder: '请输入工位负责人',
    type: 'input',
    required: false,
  },
  {
    label: '设备ID号：',
    prop: 'code',
    placeholder: '自定义ID，不能重复',
    type: 'input',
    required: true,
    rule: [{ required: true, message: '请输入设备ID号', trigger: 'blur' }],
  },
  {
    label: '备注：',
    prop: 'remark',
    placeholder: '请输入备注',
    type: 'input',
    required: false,
  },
];

export const cameraRangeAddForm: CameraAddFormItem[] = [
  {
    label: '启用IP地址：',
    prop: 'startIp',
    placeholder: '请输入启用IP地址',
    type: 'input',
    labelWidth: '96px',
    required: true,
    rule: [{ required: true, message: '请输入启用IP地址', trigger: 'blur' }],
  },
  {
    label: '协议类型：',
    prop: 'cameraType',
    placeholder: '请输入协议类型',
    type: 'select',
    required: true,
    option: protocalTypeSelect,
    rule: [{ required: true, message: '请输入协议类型', trigger: 'blur' }],
  },
  {
    label: '用户名：',
    prop: 'user',
    placeholder: '请输入用户名',
    type: 'input',
    labelWidth: '60px',
    required: false,
    rule: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
  },
  {
    label: '结束IP地址：',
    prop: 'endIp',
    placeholder: '请输入结束IP地址',
    type: 'input',
    labelWidth: '96px',
    required: true,
    rule: [{ required: true, message: '请输入结束IP地址', trigger: 'blur' }],
  },
  {
    label: '端口：',
    prop: 'port',
    placeholder: '请输入端口号',
    type: 'input',
    required: false,
    rule: [{ required: true, message: '请输入端口号', trigger: 'blur' }],
  },
  {
    label: '密码：',
    prop: 'password',
    placeholder: '请输入用户名密码',
    type: 'input',
    labelWidth: '60px',
    required: false,
    rule: [{ required: true, message: '请输入用户名密码', trigger: 'blur' }],
  },
];

type CameraShareFormItem = {
  label?: string;
  prop: string;
  placeholder?: string;
  type?: 'input' | 'select' | 'tree-select' | 'radio';
  option?: { value: any; label: any }[];
  required?: boolean;
  rule?: any[];
  labelWidth?: string;
};

export const authorityTypeSelect = [
  {
    value: 'look',
    label: '仅可查看',
  },
  {
    value: 'operate',
    label: '可远程控制',
  },
];

export const timeTypeSelect = [
  {
    value: 'Indefinite',
    label: '无限期',
  },
  {
    value: 'definite',
    label: '有限期',
  },
];

export const cameraShareForm: CameraShareFormItem[] = [
  {
    label: '企业账号：',
    prop: 'account',
    placeholder: '请输入企业账号',
    type: 'input',
    required: true,
    rule: [{ required: true, message: '请输入企业账号', trigger: 'blur' }],
  },
  {
    label: '权限设置：',
    prop: 'authority',
    //placeholder: '请输入IP地址',
    type: 'radio',
    required: true,
    option: authorityTypeSelect,
    rule: [{ required: true, message: '', trigger: 'blur' }],
  },
  {
    label: '企业名称：',
    prop: 'name',
    placeholder: '请输入企业名称',
    type: 'input',
    required: true,
    rule: [{ required: true, message: '请输入企业名称', trigger: 'blur' }],
  },
  {
    label: '分享时间：',
    prop: 'time',
    //placeholder: '请输入协议类型',
    type: 'select',
    required: true,
    option: timeTypeSelect,
    rule: [{ required: true, message: '', trigger: 'blur' }],
  },
  {
    label: '备注：',
    prop: 'notes',
    placeholder: '请输入备注',
    type: 'input',
    required: false,
    rule: [{ required: true, message: '请输入备注', trigger: 'blur' }],
  },
  {
    label: '分享企业：',
    prop: 'shareList',
    // placeholder: '请输入场景名称',
    // type: 'tree-select',
    required: true,
    rule: [{ required: true, message: '', trigger: 'blur' }],
  },
];

export const rules = {
  account: [{ required: true, message: '请输入企业账号', trigger: 'blur' }],
  authority: [{ required: true, message: '', trigger: 'change' }],
  name: [{ required: true, message: '请输入企业名称', trigger: 'change' }],
  time: [{ required: true, message: '', trigger: 'change' }],
  shareList: [{ required: true, message: '', trigger: 'blur' }],
};

export const columns: BasicColumn[] = [
  {
    label: '联网状态',
    prop: 'networkingState',
    render(record) {
      return h(
        'img',
        {
          src: record.row.networkingState === 0 ? connectedIcon : unConnectedIcon,
          style:
            'width: 20px; height: 20px; object-fit: fill; display: inline-block; line-height: 20px; vertical-align: middle;',
        },
        {},
      );
    },
    minWidth: 120,
    align: 'center',
    sortable: 'custom',
  },
  {
    label: '名称',
    prop: 'name',
    minWidth: 200,
  },
  {
    label: '账号',
    prop: 'account',
    minWidth: 200,
  },
  {
    label: '联网状态',
    prop: 'networkingState',
    render(record) {
      const updateNetworkingState = (row) => {
        if (row.networkingState === 0) {
          row.networkingState = 1;
        } else {
          row.networkingState = 0;
        }
      };
      return h(
        ElTag,
        { onClick: () => updateNetworkingState(record.row), style: 'cursor: pointer;' },
        {
          default: () => {
            return record.row.networkingState === 0 ? '连接' : '断开连接';
          },
        },
      );
    },
    minWidth: 120,
  },
];

export const sharedCaremaType = [
  {
    value: 'incomplete',
    label: '待添加',
  },
  {
    value: 'complete',
    label: '已添加',
  },
];

export const cameraSharedForm: CameraAddFormItem[] = [
  {
    label: '名称：',
    prop: 'name',
    placeholder: '请输入名称',
    type: 'input',
    required: true,
    disabled: false,
    rule: [{ required: true, message: '请输入名称', trigger: 'blur' }],
  },
  {
    label: 'IP地址：',
    prop: 'cameraIp',
    placeholder: '请输入IP地址',
    type: 'input',
    required: true,
    disabled: true,
    rule: [{ required: true, message: '请输入IP地址', trigger: 'blur' }],
  },
  {
    label: '端口：',
    prop: 'cameraPort',
    placeholder: '请输入端口号',
    type: 'input',
    required: true,
    disabled: true,
    rule: [{ required: true, message: '请输入端口号', trigger: 'blur' }],
  },
  {
    label: '协议类型：',
    prop: 'cameraType',
    placeholder: '请输入协议类型',
    type: 'input',
    required: true,
    disabled: true,
    rule: [{ required: true, message: '请输入协议类型', trigger: 'blur' }],
  },
  {
    label: '用户名：',
    prop: 'username',
    placeholder: '请输入用户名',
    type: 'input',
    required: true,
    disabled: true,
    rule: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
  },
  {
    label: '场景：',
    prop: 'workshopName',
    placeholder: '请输入场景名称',
    type: 'input',
    required: true,
    disabled: false,
    rule: [{ required: true, message: '请输入场景名称', trigger: 'blur' }],
  },
  {
    label: '密码：',
    prop: 'password',
    placeholder: '请输入用户名密码',
    type: 'input',
    required: true,
    disabled: true,
    rule: [{ required: true, message: '请输入用户名密码', trigger: 'blur' }],
  },
  {
    label: '企业账号：',
    prop: 'companyAccount',
    placeholder: '请输入企业账号',
    type: 'input',
    disabled: true,
    required: false,
  },
  {
    label: '设备ID号：',
    prop: 'code',
    placeholder: '自定义ID，不能重复',
    type: 'input',
    required: true,
    disabled: false,
    rule: [{ required: true, message: '请输入设备ID号', trigger: 'blur' }],
  },
  {
    label: '企业名称：',
    prop: 'companyName',
    placeholder: '请输入企业名称',
    type: 'input',
    disabled: true,
    required: false,
  },
];

export interface CameraSharedItem {
  cameraIp: string; //ip地址
  cameraType: string; //协议类型
  cameraPort: string; //端口地址
  companyAccount: number; //企业账号
  companyName: string; //企业名称
  code: string; //设备ID
  workshopName: string; //车间场景
  workspaceName: string; //工位场景
  shareState: string; //是否添加
  password?: string; //密码
  username?: string; //用户名
}