import { CComputedSetter } from "../_setters";
import snippets from "./snippets";
import loopData from "../_com-props/loopData";
import { getFlowEventConfig } from "../_com-props/flowEventConfig";
import { ConditionRenderService } from "../_utils/conditionRenderService";
import { t } from "../../src/locale";
import componentKey from "../_com-props/componentKey";
import componentName from "../_com-props/componentName";
export default {
  snippets: snippets,
  componentName: 'Image',
  title: t('image.title'),
  category: t('image.category'),
  group: t('image.group'),
  props: [loopData, componentKey, componentName,
  // {
  //   name: 'groupId',
  //   title: {
  //     label: t('image.groupId'),
  //     tip: t('image.groupIdTip'),
  //   },
  //   propType: "string",
  //   setter: CStringOnlySetter,
  // },
  // {
  //   name: 'groupIdDefault',
  //   title: {
  //     label: t('image.groupIdDefault'),
  //     tip: t('image.groupIdDefaultTip'),
  //   },
  //   setter: 'BoolSetter',
  //   condition: (target: any) => {
  //     return target.parent.getPropValue('groupId') !== undefined
  //   },
  // },
  {
    name: 'dictionaryKey',
    title: {
      label: t('typographyText.key_kbMeuiEtQtNa'),
      tip: t('typographyText.key_kbMeuiEtQtNb')
    },
    setter: 'DictionarySetter',
    props: {
      type: 'img'
    }
  }, {
    name: 'src',
    title: {
      label: t('image.src'),
      tip: t('image.srcTip')
    },
    propType: {
      type: 'string',
      isRequired: true
    }
  }, {
    name: 'updateSrc',
    title: {
      label: t('image.updateSrc'),
      tip: t('image.updateSrcTip')
    },
    setter: 'CUploadImageDefaultSetter',
    extraProps: {
      setValue: function setValue(target, value) {
        if (value !== undefined && value !== '') {
          target.parent.setPropValue('src', value);
        }
      }
    }
  }, {
    name: 'defaultValue',
    title: {
      label: t('image.defaultValue'),
      tip: t('image.defaultValueTip')
    },
    propType: 'string',
    defaultValue: '',
    setter: CComputedSetter,
    extraProps: {
      setValue: function setValue(target, value) {
        if (value !== undefined && value !== '') {
          var conditionRenderService = new ConditionRenderService();
          conditionRenderService.load(value.data);
          var exp = conditionRenderService.getConditionExpression();
          target.parent.setPropValue('src', exp);
        }
      }
    }
  }, {
    name: 'alt',
    title: {
      label: t('image.alt'),
      tip: t('image.altTip')
    },
    propType: 'string'
  }, {
    name: 'preview',
    title: {
      label: t('image.preview'),
      tip: t('image.previewTip')
    },
    defaultValue: true,
    propType: 'bool'
  }, {
    name: 'fallback',
    title: {
      label: t('image.fallback'),
      tip: t('image.fallbackTip')
    },
    propType: 'string'
  }, {
    name: 'updateFallback',
    title: {
      label: t('image.updateFallback'),
      tip: t('image.updateFallbackTip')
    },
    setter: 'CUploadImageDefaultSetter',
    extraProps: {
      setValue: function setValue(target, value) {
        if (value !== undefined && value !== '') {
          target.parent.setPropValue('fallback', value);
        }
      }
    }
  },
  // {
  //   name: 'width',
  //   title: { label: t('image.width'), tip: t('image.widthTip') },
  //   propType: 'number',
  //   setter: CStringOnlySetter,
  // },
  // {
  //   name: 'height',
  //   title: { label: t('image.height'), tip: t('image.heightTip') },
  //   propType: 'number',
  //   setter: CStringOnlySetter,
  // },
  getFlowEventConfig(), {
    title: t('image.buttonStatus'),
    display: 'block',
    type: 'group',
    items: [{
      name: 'hoverStyle',
      title: t('image.hoverStyle'),
      type: 'group',
      extraProps: {
        display: 'entry'
      },
      items: [{
        name: 'hoverStyle',
        title: {
          label: t('image.hoverStyle'),
          tip: t('image.hoverStyleTip')
        },
        setter: 'CStyleSetter',
        extraProps: {
          display: 'block'
        }
      }]
    }, {
      name: 'clickStyle',
      title: t('image.clickStyle'),
      type: 'group',
      extraProps: {
        display: 'entry'
      },
      items: [{
        name: 'clickStyle',
        title: {
          label: t('image.clickStyle'),
          tip: t('image.clickStyleTip')
        },
        setter: 'CStyleSetter',
        extraProps: {
          display: 'block'
        }
      }]
    }, {
      name: 'selectStyle',
      title: t('image.selectStyle'),
      type: 'group',
      extraProps: {
        display: 'entry'
      },
      items: [{
        name: 'selectStyle',
        title: {
          label: t('image.selectStyle'),
          tip: t('image.selectStyleTip')
        },
        setter: 'CStyleSetter',
        extraProps: {
          display: 'block'
        }
      }]
    }, {
      name: 'loadingStyle',
      title: t('button.loadingStyle'),
      type: 'group',
      extraProps: {
        display: 'entry'
      },
      items: [{
        name: 'loadingStyle',
        title: {
          label: t('button.loadingStyle'),
          tip: t('button.loadingStyleTip')
        },
        setter: 'CStyleSetter',
        extraProps: {
          display: 'block'
        }
      }]
    }, {
      name: 'errorStyle',
      title: t('button.errorStyle'),
      type: 'group',
      extraProps: {
        display: 'entry'
      },
      items: [{
        name: 'errorStyle',
        title: {
          label: t('button.errorStyle'),
          tip: t('button.errorStyleTip')
        },
        setter: 'CStyleSetter',
        extraProps: {
          display: 'block'
        }
      }]
    }]
  }],
  configure: {
    supports: {
      events: false,
      style: true,
      "loop": false,
      "condition": false
    }
  }
};