app/pages/member/UserInfoAiEdit.vue

<!-- 用户信息的新增/编辑 -->
<template>
  <s-layout :title="state.model.id ? '编辑地址' : '新增用户信息'">
    <uni-forms
      ref="userinfoaiFormRef"
      v-model="state.model"
      :labelStyle="{ fontWeight: 'bold' }"
      :rules="rules"
      border
      labelAlign="left"
      labelWidth="160"
      validateTrigger="bind"
    >
      <view class="bg-white form-box ss-p-x-30">
        <uni-forms-item class="form-item" label="用户编号" name="userId">
          <uni-easyinput
            v-model="state.model.userId"
            :inputBorder="false"
            placeholder="请填写用户编号"
            placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal"
          />
        </uni-forms-item>
        <uni-forms-item
          :formItemStyle="{ alignItems: 'flex-start' }"
          :labelStyle="{ lineHeight: '5em' }"
          class="textarea-item"
          label="提取有效信息"
          name="textInformation"
        >
          <uni-easyinput
            v-model="state.model.textInformation"
            :inputBorder="false"
            clearable
            placeholder="请输入提取有效信息"
            placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal"
            type="textarea"
          />
        </uni-forms-item>

        <uni-forms-item
          :formItemStyle="{ alignItems: 'flex-start' }"
          :labelStyle="{ lineHeight: '5em' }"
          class="textarea-item"
          label="补充信息"
          name="additionalInfo"
        >
          <uni-easyinput
            v-model="state.model.additionalInfo"
            :inputBorder="false"
            clearable
            placeholder="请输入补充信息"
            placeholderStyle="color:#BBBBBB;font-size:30rpx;font-weight:400;line-height:normal"
            type="textarea"
          />
        </uni-forms-item>
      </view>
    </uni-forms>
    <su-fixed :index="10" :noFixed="false" :opacity="false" bg="" bottom placeholder>
      <view class="footer-box ss-flex-col ss-row-between ss-p-20">
        <view class="ss-m-b-20">
          <button class="ss-reset-button save-btn ui-Shadow-Main" @tap="onSave">保存</button>
        </view>
        <button v-if="state.model.id" class="ss-reset-button cancel-btn" @tap="onDelete">
          删除
        </button>
      </view>
    </su-fixed>
  </s-layout>
</template>

<script setup>
  import { reactive, ref, unref } from 'vue';
  import sheep from '@/sheep';
  import { onLoad } from '@dcloudio/uni-app';
  import UserInfoAiApi from '@/sheep/api/member/UserInfoAi';

  const userinfoaiFormRef = ref(null);
  const state = reactive({
    showRegion: false,
    model: {
      name: '',
      mobile: '',
      detailUserInfoAi: '',
      defaultStatus: false,
      areaName: '',
    },
    rules: {},
  });

  const rules = {
    userId: {
      rules: [
        {
          required: true,
          errorMessage: '请输入用户编号',
        },
      ],
    },
  };

  // 保存用户信息
  const onSave = async () => {
    // 参数校验
    const validate = await unref(userinfoaiFormRef)
      .validate()
      .catch((error) => {
        console.log('error: ', error);
      });
    if (!validate) {
      return;
    }

    // 提交请求
    const formData = {
      ...state.model,
    };
    const { code } =
      state.model.id > 0
        ? await UserInfoAiApi.updateUserInfoAi(formData)
        : await UserInfoAiApi.createUserInfoAi(formData);
    if (code === 0) {
      sheep.$router.back();
    }
  };

  // 删除用户信息
  const onDelete = () => {
    uni.showModal({
      title: '提示',
      content: '确认删除此用户信息吗？',
      success: async function (res) {
        if (!res.confirm) {
          return;
        }
        const { code } = await UserInfoAiApi.deleteUserInfoAi(state.model.id);
        if (code === 0) {
          sheep.$router.back();
        }
      },
    });
  };

  onLoad(async (options) => {});
</script>

<style lang="scss" scoped>
  :deep() {
    .uni-forms-item__label .label-text {
      font-size: 28rpx !important;
      color: #333333 !important;
      line-height: normal !important;
    }

    .uni-easyinput__content-input {
      font-size: 28rpx !important;
      color: #333333 !important;
      line-height: normal !important;
      padding-left: 0 !important;
    }

    .uni-easyinput__content-textarea {
      font-size: 28rpx !important;
      color: #333333 !important;
      line-height: normal !important;
      margin-top: 8rpx !important;
    }

    .uni-icons {
      font-size: 40rpx !important;
    }

    .is-textarea-icon {
      margin-top: 22rpx;
    }

    .is-disabled {
      color: #333333;
    }
  }

  .default-box {
    width: 100%;
    box-sizing: border-box;
    height: 100rpx;

    .default-box-title {
      font-size: 28rpx;
      color: #333333;
      line-height: normal;
    }
  }

  .footer-box {
    .save-btn {
      width: 710rpx;
      height: 80rpx;
      border-radius: 40rpx;
      background: linear-gradient(90deg, var(--ui-BG-Main), var(--ui-BG-Main-gradient));
      color: $white;
    }

    .cancel-btn {
      width: 710rpx;
      height: 80rpx;
      border-radius: 40rpx;
      background: var(--ui-BG);
    }
  }
</style>