<template>
  <div>
    <div class="space-x-4 bg-white p-4 mb-4">
      <div class="mb-4">企业微信客服设置</div>
      <el-form label-width="100px">
        <el-form-item label="链接" required>
          <el-input
            v-model.trim="form.corpServiceUrl"
            class="w-[400px]"
            placeholder="请输入企业微信客服链接"
          ></el-input>
        </el-form-item>
        <el-form-item label="企业ID" required>
          <el-input
            v-model.trim="form.corpId"
            class="w-[400px]"
            placeholder="请输入企业微信企业ID"
          ></el-input>
        </el-form-item>
        <el-form-item label="说明">
          <el-input
            v-model.trim="form.corpInstruction"
            class="w-[400px]"
            placeholder="输入说明信息，该说明将展示给用户看"
          ></el-input>
        </el-form-item>
      </el-form>

    </div>
    <div class="space-x-4 bg-white p-4">
      <div class="mb-4">客服电话设置</div>
      <el-form label-width="100px">
        <el-form-item label="电话" required>
          <el-input
            v-model.trim="form.serviceMobile"
            class="w-[400px]"
            placeholder="输入客服电话"
          ></el-input>
        </el-form-item>
        <el-form-item label="说明">
          <el-input
            v-model.trim="form.serviceInstruction"
            class="w-[400px]"
            placeholder="输入说明信息，该说明将展示给用户看"
          ></el-input>
        </el-form-item>
      </el-form>

    </div>
    <el-button type="primary" class="mt-4" @click="onSave">保存</el-button>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { request } from "@/utils";
import { ElMessage } from "element-plus";


const form = ref({
  corpId: '',
  corpServiceUrl: '',
  corpInstruction: '',
  serviceMobile: '',
  serviceInstruction: '',
})

const getFormValue = async () => {
  const { data } = await request.post("/mechanism/mechanismSetting/get", {
    keys: Object.keys(form.value)
  });
  data.list.map(v => {
    form.value[v.key] = v.value;
  });
};
getFormValue()
const onSave = async () => {

  await request.post("/mechanism/mechanismSetting/update", {
    settings: Object.keys(form.value).map(k => {
      return {
        key: k,
        value: form.value[k]
      }
    })
  });
  ElMessage.success('保存成功');
};
</script>

<style lang="scss" scoped></style>
