<template>
  <view class="page-wrapper bgF2 global-wrapper">
    <JHeaderTitle title="编辑商户信息" bgColor="#f2f2f2" />
    <JMainCard wrapPd="0 30rpx" pd="0">
      <JInput
        v-model:value="mchInfo.mchName"
        name="用户名称"
        place="请输入商户名称"
        :rules="{ name: 'mchName', rule: 'REG_NotNUll' }"
        :isBorder="true"
      ></JInput>
      <JInput
        v-model:value="mchInfo.mchShortName"
        name="商户简称"
        place="请输入商户简称"
        :rules="{ name: 'mchShortName', rule: 'REG_NotNUll' }"
        :isBorder="true"
      ></JInput>
    </JMainCard>
    <JMainCard wrapPd="30rpx" pd="0">
      <JInput
        v-model:value="mchInfo.contactName"
        name="联系人姓名"
        place="请输入联系人姓名"
        :rules="{ name: 'contactName', rule: 'REG_NotNUll' }"
        :isBorder="true"
      ></JInput>
      <JInput v-model:value="mchInfo.contactEmail" name="联系人邮箱" place="请输入联系人邮箱" :isBorder="true"></JInput>
    </JMainCard>
    <JMainCard wrapPd="0 30rpx" pd="0">
      <JInput v-model:value="mchInfo.remark" name="备注" place="请输入备注" :isBorder="true"></JInput>
    </JMainCard>

    <JButton pd="30rpx" @HandleTouch="saveMch" pdTop="30rpx">保存</JButton>
  </view>
</template>

<script setup>
import { ref, reactive, nextTick } from "vue"
import { onShow, onLoad } from "@dcloudio/uni-app"
import JHeaderTitle from "@/components/newComponents/JHeaderTitle/JHeaderTitle"
import JMainCard from "@/components/newComponents/JMainCard/JMainCard"
import JInput from "@/components/newComponents/JInput/JInput"
import JButton from "@/components/newComponents/JButton/JButton"
import { $editMer, $findMer } from "@/http/apiManager.js"
import { validateArray } from "@/hooks/rules" //校验函数

onLoad((options) => {
  if (options.mchNo) return getInfo(options.mchNo)
})
const mchInfo = ref({})
const getInfo = (val) => {
  $findMer(val).then(({ bizData }) => {
    mchInfo.value = bizData
  })
}
const saveMch = () => {
  if (validateArray(mchInfo.value)) {
    $editMer(mchInfo.value.mchNo, mchInfo.value).then((res) => {
      uni.showToast({
        title: "保存成功",
        icon: "success",
      })
      uni.navigateBack()
    })
  }
}
</script>

<style lang="scss" scoped>
.page-wrapper {
  .place-text {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-size: 33rpx;
    color: #a6a6a6;
    image {
      width: 40rpx;
      height: 40rpx;
      transform: translateX(20rpx);
    }
  }
  .selected-text {
    color: #000;
  }
}
.team-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  image {
    width: 40rpx;
    height: 40rpx;
  }
  view {
    display: flex;
    align-items: center;
    image {
      width: 93rpx;
      height: 93rpx;
      margin-right: 15rpx;
    }
    view {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      font-size: 33rpx;
      font-weight: 700;
      text {
        margin-top: 10rpx;
        font-size: 25rpx;
        font-weight: 500;
        color: #8c8c8c;
      }
    }
  }
}
</style>
