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 class="form-item" label="文件" name="infoFiles">
          <s-uploader v-model="state.model.infoFiles" fileMediatype="pdf" limit="10" mode="list" />
        </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();
      }
    },
  });
};
const getUserInfoAiAxios = async (id) => {
  const { data } = await UserInfoAiApi.getUserInfoAi(id);
  state.model = data;
};
onLoad(async (options) => {
  getUserInfoAiAxios(options.id);
});
</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>