<template>
  <!-- 面包屑 -->
  <el-breadcrumb>
    <el-breadcrumb-item>${functionName}</el-breadcrumb-item>
    <el-breadcrumb-item to="/${className}'">${functionName}</el-breadcrumb-item>
  </el-breadcrumb>
  <el-form ref="formRef" :model="formData" :rules="rules">
    <el-row>
      
      ${col}

    </el-row>
    <el-row>
      <el-button type="primary" class="sus_button" @click="save(formRef)">
        保存
      </el-button>
    </el-row>
  </el-form>
</template>
<script setup>
import { ref, reactive } from "vue";
import { get${className} , edit${className} } from "~/service/${businessName}";
import { useLoginStore } from "~/store";

const store = useLoginStore();
const headers = {
  Accept: "application/json",
  ...store.headers,
};

let formData = ref({});
${mapParm}


const uoloadData = ref({
    dirName: "${className}"
})

//验证规则
const rules = reactive({
  ${rules}
});

const labelWidth = 200;
const formRef = ref();

//获取
const getContent = async () => {
  const { code, data } = await get${className}();
  if (code == 0) {
    formData.value = data;

    ${mapOpen}
  }
};

${mapOpenFun}

//保存
const save = async (formEl) => {
  if (!formEl) return;
  formEl.validate(async (valid) => {
    if (!valid) {
      return;
    }

    ${mapFun}

    const { code } = await edit${className}(formData.value);
  });
};

</script>
<style lang="scss" scoped>
.sus_button {
  width: 300px;
  height: 50px;
  margin: 20px auto;
}
.upLoadEl{
  :deep(.el-upload-list__item){
    height: 200px;
    width: 300px;
  }
  :deep(.el-upload-list__item-thumbnail){
      object-fit: contain;
    }
}
</style>
  