import { getVModelHtml, formItemWrapper, colWrapper } from './common/htmlWrapper'

// 创建“el-input-number”
function createInputNumberHtml(formJson, inputNumber, parent) {
  const vModel = getVModelHtml(formJson, inputNumber, parent)
  const placeholder = inputNumber.placeholder ? `placeholder="${inputNumber.placeholder}"` : ''
  const width = inputNumber.style && inputNumber.style.width ? ':style="{width: \'100%\'}"' : ''
  const disabled = inputNumber.disabled ? ':disabled=\'true\'' : ''
  const controlsPosition = inputNumber['controls-position'] ? `controls-position=${inputNumber['controls-position']}` : ''
  const min = inputNumber.min ? `:min='${inputNumber.min}'` : ''
  const max = inputNumber.max ? `:max='${inputNumber.max}'` : ''
  const step = inputNumber.step ? `:step='${inputNumber.step}'` : ''
  const stepStrictly = inputNumber['step-strictly'] ? 'step-strictly' : ''
  const precision = inputNumber.precision ? `:precision='${inputNumber.precision}'` : ''

  return `<el-input-number ${vModel} ${placeholder} ${step} ${stepStrictly} ${precision} ${controlsPosition} ${min} ${max} ${disabled} ${width}></el-input-number>`
}

/**
 * 获取“计数器”HTML
 * @param formJson 表单结构
 * @param inputNumber “计数器”组件
 * @param parent 父组件（dialog, table...）
 * @param isSomeSpanUnequal24 是否有的组件“span”不等于“24”
 * @returns {string} “计数器”HTML
 */
export default function getInputNumberHtml(formJson, inputNumber, parent, isSomeSpanUnequal24) {
  // 创建“el-input-number”
  const inputNumberHtml = createInputNumberHtml(formJson, inputNumber, parent)

  // 用“el-form-item”包裹“el-input-number”
  let formItemHtml = formItemWrapper(formJson, inputNumber, inputNumberHtml)

  // span不为24的用“el-col”包裹“el-form-item”
  if (isSomeSpanUnequal24) {
    formItemHtml = colWrapper(inputNumber, formItemHtml)
  }

  return formItemHtml
}