<template>
  <my-dialog v-model:show="show" title="修改信息" @cancel="cancel" @submit="submit">
    <template #content>
      <div class="w-full">
        <n-form v-if="data" label-placement="left" label-width="100">
          <n-form-item label="模板类型">
            <n-select
              v-model:value="data.templateCode"
              :options="printTypeList"
              placeholder="请选择模板类型"
              @update:value="(val, item: any) => {
              data.templateName = item.label;
              console.log('data.templateName ==? ', data.templateName);
            }"
            ></n-select>
          </n-form-item>
          <!-- <n-form-item label="模板名称">
            <n-input v-model:value="data.templateName" placeholder="请输入模板名称"></n-input>
          </n-form-item> -->
          <n-form-item label="所属客户">
            <n-select
              v-model:value="data.clientId"
              :options="clientOptions"
              placeholder="请选择客户"
              @change="selectClient"
            ></n-select>
          </n-form-item>
          <n-form-item label="所属用户">
            <n-input v-model:value="data.userNickName" placeholder="请输入客户"></n-input>
          </n-form-item>
          <n-form-item label="默认打印机">
            <n-input v-model:value="data.defaultPrinterName" placeholder="请输入客户"></n-input>
          </n-form-item>
        </n-form>
      </div>
    </template>
  </my-dialog>
</template>

<script setup lang="tsx">
import { watch, ref } from 'vue';
import { getPrintTemplateInfo, updatePrintTemplate } from '@/service/api/md/printTemplate';
// const { proxy } = getCurrentInstance() as any;
// const { print_template_type } = proxy.useDict('print_template_type');
const show = defineModel('show', { type: Boolean, default: false });
function cancel() {
  show.value = false;
}
interface Emits {
  (e: 'init'): void;
  /** 点击协议 */
}
const emit = defineEmits<Emits>();
const props = withDefaults(
  defineProps<{
    id: string | number;
    clientOptions: any[];
    printTypeList: any[];
  }>(),
  {
    id: '',
    clientOptions: () => [],
    printTypeList: () => []
  }
);
const data = ref<any>(null);
function selectClient(_val, item) {
  console.log(item);
  if (!data.value) return;
  data.value.clientId = item.id;
  data.value.clientCode = item.clientCode;
  data.value.clientName = item.clientName;
}
function submit() {
  console.log('data.value ==> ', data.value);
  updatePrintTemplate(data.value).then(res => {
    console.log(res);
    if (res.code === 200) {
      window.$message?.success('修改成功');
      emit('init');
      cancel();
    }
  });
}
watch(
  () => props.id,
  () => {
    console.log(props.id);
    getPrintTemplateInfo(props.id).then(res => {
      data.value = res.data;
    });
  }
);
</script>

<style scoped></style>
