import TableOperaionComponent from "@/components/noTemplateComponents/operationComponent";
import TableTextComponent from "@/components/noTemplateComponents/detailComponent";
import StatusComponent from "@/components/noTemplateComponents/statusComponent";
import { timeFilter, dictFilter } from "@/utils/filters";

export default function () {
  const tableProps = [
    // { type: 'index', label: '序号' },
    // { prop: "createTime", label: "添加时间", filter: timeFilter },
    { prop: "name", label: "物料名称" },
    { prop: "code", label: "物料编码" },
    { prop: "typeDictValue", label: "类别", filter: dictFilter("material_category") }, // subcomponent: {/** TODO: create a new component for this option */} },
    { prop: "type", label: "物料类型" },
    { prop: "enName", label: "英文名称" },
    { prop: "enAb", label: "英文缩写" },
    { prop: "density", label: "堆积密度" },
    // { prop: "description", label: "详情", subcomponent: TableTextComponent },
    { prop: "description", label: "原料描述", },
    { prop: "remark", label: "中文描述" },
    /** TODO: parentId 是用来前端重构成树形结构的... */
    {
      prop: "operations",
      name: "操作",
      fixed: "right",
      width: 180,
      subcomponent: TableOperaionComponent,
      options: [{ name: "add-sub", permission: "pms:material:save" }, "edit", { name: "delete", permission: "pms:material:save" },],
    },
  ];

  const headFormFields = [
    {
      label: "物料名称/编码",
      prop: "key",
      input: true,
      default: { value: "" },
      bind: { placeholder: "请输入物料名称或编码" },
    },
    {
      button: {
        type: "primary",
        name: "查询",
      },
    },
    {
      button: {
        type: "primary",
        name: "新增",
        permission: "",
      },
      bind: {
        plain: true,
      },
    },
  ];

  /**
   * dialog config 有两个版本，一个适用于 DialogWithMenu 组件，另一个适用于 DialogJustForm 组件
   * 适用于 DialogWithMenu 组件的配置示例详见 blenderStep/config.js
   * 此为后者的配置:
   */
  const dictList = JSON.parse(localStorage.getItem("dictList"));
  const dialogConfigs = {
    menu: [
      { name: "物料信息", key: "info" },
      { name: "物料属性信息", key: "attr", onlyEditMode: true },
      // { name: "添加子类", key: "add-sub", onlyEditMode: true },
    ],
    form: {
      rows: [
        [
          {
            input: true,
            label: "物料名称",
            prop: "name",
            rules: { required: true, message: "not empty", trigger: "blur" },
            elparams: { placeholder: "请输入物料名称" },
          },
          {
            input: true,
            label: "物料编码",
            prop: "code",
            rules: { required: true, message: "not empty", trigger: "blur" },
            elparams: { placeholder: "请输入物料编码" },
          },
          { input: true, label: "堆积密度(g/cm3)", prop: "density", elparams: { placeholder: "堆积密度" } },

        ],
        [
          {
            cascader: true,
            label: "父级物料",
            prop: "parentId",
            // TODO: 待解决：DialogWithMenu 中设置default只在初始化的时候有效，一旦清空过就无效了
            // default: '0',
            // rules: { required: true, message: "not empty", trigger: "blur" },
            options: [{ id: '0', name: '无' }], // 手动注入额外选项，用到的场景不多...
            fetchData: () => this.$http.get('/pms/material/page', { params: { page: 1, limit: 999, key: '' } }),
            elparams: { placeholder: "请选择父级物料", filterable: true, clearable: true },
            // fetchTreeData: () => {
            //   // TODO：前提是工厂里总的设备类型数不会超过 999
            //   return this.$http.get('/pms/material/tree', {
            //     params: { rootId: '0' }
            //   })
            // },
            // elparams: { placeholder: "请选择父级物料", 'show-all-levels': false, props: { checkStrictly: true } },
          },
          {
            select: true,
            label: "物料类型",
            prop: "typeId",
            rules: { required: true, message: "not empty", trigger: "blur" },
            options: [],
            fetchData: () => this.$http.get('/pms/materialType/page', { params: { page: 1, limit: 999 } }),
            elparams: { placeholder: "请输入物料类型" },
            // autoDisabled: true, // 有某个条件触发后，自动变成 disabled 状态
          },
          {
            select: true,
            label: "物料类别",
            prop: "typeDictValue",
            options: dictList["material_category"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
            elparams: { placeholder: "物料类别" },
            // autoDisabled: true
          },

          // {
          //   input: true,
          //   label: "设备类型",
          //   prop: "eqTypeId",
          //   rules: { required: true, message: "not empty", trigger: "blur" },
          //   elparams: { placeholder: "请输入设备类型" },
          // },
        ],
        [

          {
            select: true,
            label: "单位",
            prop: "unitDictValue",
            options: dictList["unit"].map((u) => ({ label: u.dictLabel, value: u.dictValue })),
            elparams: { placeholder: "单位" },
          },
          {
            input: true,
            label: "英文名称",
            prop: "enName",
            elparams: { placeholder: "请输入英文名称" },
          },
          {
            input: true,
            label: "缩写",
            prop: "enAb",
            elparams: { placeholder: "请输入缩写" },
          },

        ],
        [
          { input: true, label: "原料描述", prop: "description", elparams: { placeholder: "原料描述" } },
        ],
        [{ input: true, label: "中文描述", prop: "remark", elparams: { placeholder: "备注" } }],
      ],
      operations: [
        { name: "add", label: "保存", type: "primary", permission: "pms:material:save", showOnEdit: false },
        { name: "update", label: "更新", type: "primary", permission: "pms:material:save", showOnEdit: true },
        { name: "reset", label: "重置", type: "warning", showAlways: true },
        // { name: 'cancel', label: '取消', showAlways: true },
      ],
    },
    table: {
      // extraParams: ['stepId'],
      extraParams: "materialId",
      props: [
        { prop: "createTime", label: "添加时间", filter: timeFilter, isEditField: true },
        { prop: "name", label: "属性名", isEditField: true },
        { prop: "value", label: "属性值", isEditField: true },
        {
          prop: "operations",
          name: "操作",
          fixed: "right",
          width: 120,
          subcomponent: TableOperaionComponent,
          options: [
            { name: "edit", permission: "pms:materialArrt:save" },
            { name: "delete", permission: "pms:materialArrt:save" },
          ],
        },
      ],
      data: [
        // TOOD 暂时用不到，但获取可以考虑把拉取接口数据的函数迁移到此文件（没有太大必要）
      ],
    },

    subDialog: {
      extraParam: "materialId",
      forceAttachCode: true,
      rows: [
        [
          { input: true, label: "属性名", prop: "name", elparams: { placeholder: "请输入属性名" } }
        ],
        [
          { input: true, label: "属性值", prop: "value", elparams: { placeholder: "请输入属性值" } }
        ],
        [
          { input: true, label: "备注", prop: "remark", elparams: { placeholder: "请输入备注" } },
        ]
      ],
      operations: [
        { name: "add", label: "保存", type: "primary", permission: "pms:materialArrt:save", showOnEdit: false },
        { name: "update", label: "更新", type: "primary", permission: "pms:materialArrt:update", showOnEdit: true },
        //  { name: 'reset', label: '重置', type: 'warning', showAlways: true },
        // { name: 'cancel', label: '取消', showAlways: true },
      ],
    },
  };

  return {
    dialogConfigs,
    tableConfig: {
      table: null, // 此处可省略，el-table 上的配置项
      column: tableProps, // el-column-item 上的配置项
    },
    headFormConfigs: {
      rules: null, // 名称是由 BaseSearchForm.vue 组件固定的
      fields: headFormFields, // 名称是由 BaseSearchForm.vue 组件固定的
    },
    urls: {
      base: "/pms/material",
      page: "/pms/material/page",
      tree: "/pms/material/tree",
      subase: "/pms/materialArrt",
      subpage: "/pms/materialArrt/page",
      // more...
    },
  };
}