riku
2024-08-14 b4033c002e21c1376d68be61622da56182a962e9
components/form/index.js
@@ -1,4 +1,9 @@
import { cascaderNote } from './form-util.js';
Component({
  options: {
    multipleSlots: true, // 在组件定义时的选项中启用多slot支持
  },
  properties: {
    /**
     * 表单输入框采用T-design框架下的Input组件
@@ -10,7 +15,7 @@
     * value: 真实值,
     * status: 输入框状态。可选项:success/warning/error,
     * tips: 输入框下方提示文本,会根据不同的 status 呈现不同的样式,
     * inputType: 输入类型 (text: 输入框;switch:切换按钮; picker: 下拉框选项; cascader: 级联选择),
     * inputType: 输入类型 (text: 输入框; switch: 切换按钮; picker: 下拉框选项; cascader: 级联选择),
     * options: 当输入类型为picker或cascader时,提供可选项,
     * cascaderTitles: 当输入类型为cascader时,提供每个选项的标题,
     */
@@ -20,6 +25,14 @@
      observer(v) {
        this.setData({ formArray: v });
      },
    },
    submitText: {
      type: String,
      value: '保存',
    },
    cancelText: {
      type: String,
      value: '取消',
    },
  },
@@ -40,9 +53,6 @@
    onSwitchChange(e) {
      const { index } = e.currentTarget.dataset;
      const { value } = e.detail;
      // const { formArray } = this.data;
      // formArray[index].value = value;
      // this.setData({ formArray });
      this.setData({
        [`formArray[${index}].value`]: value,
      });
@@ -57,10 +67,9 @@
      const { label, value } = e.detail;
      this.setData({
        [`formArray[${index}].visible`]: false,
        [`formArray[${index}].value`]: {
          label: label[0],
          value: value[0],
        },
        [`formArray[${index}]._value`]: value,
        [`formArray[${index}]._label`]: label[0],
        [`formArray[${index}].value`]: value[0],
      });
    },
    onPickerCancel(e) {
@@ -75,9 +84,18 @@
      this.setData({ [`formArray[${index}].visible`]: true });
    },
    onCascaderChange(e) {
      const { index } = e.currentTarget.dataset;
      const { selectedOptions, value } = e.detail;
      console.log(selectedOptions);
      console.log(value);
      const note = cascaderNote(selectedOptions);
      const v = selectedOptions.map(v => {
        return v.value;
      });
      this.setData({
        [`formArray[${index}].visible`]: false,
        [`formArray[${index}]._value`]: value,
        [`formArray[${index}].note`]: note,
        [`formArray[${index}].value`]: v,
      });
    },
    // 保存
@@ -85,7 +103,11 @@
      const formObj = {};
      this.data.formArray.forEach(e => {
        if (e.inputType == 'picker') {
          formObj[e.name] = e.value.value;
          formObj[e.name] = e.value;
        } else if (e.inputType == 'cascader') {
          e.referItems.forEach((r, i) => {
            formObj[r] = e.value[i];
          });
        } else {
          formObj[e.name] = e.value;
        }
@@ -100,7 +122,7 @@
    _note(v) {
      let note = '';
      v.forEach(o => {
        if (note != o.label && o.value > 0) {
        if (note != o.label) {
          if (note != '') {
            note += '/';
          }