<template>
  <div id="add">
    <el-row>
      <el-col :span="24" class="main animate__animated animate__backInRight">
        <el-col :span="24" class="one">
          <component :is="partsSearch"></component>
        </el-col>
        <el-col :span="24" class="two">
          <component :is="CForm" :fields="infoFields" :rules="rules" :form="form" labelWidth="auto" @save="toSave">
            <template #is_use>
              <el-option v-for="i in isuseList" :key="i.model" :label="i.dict_label" :value="i.dict_value"></el-option>
            </template>
            <template #content>
              <component :is="WangEditor" v-model="form.content" url="/files/studioadmin/other/upload"></component>
            </template>
          </component>
        </el-col>
      </el-col>
    </el-row>
  </div>
</template>
<script setup lang="ts">
import partsSearch from '@common/src/components/frame/c-search.vue';
import CForm from '@common/src/components/frame/c-form.vue';
import WangEditor from '@common/src/components/frame/wang-editor.vue';
import store from '@/stores/counter';
import type { Ref } from 'vue';
import { ref, onMounted, reactive } from 'vue';
import type { FormRules } from 'element-plus';
import { ElMessage } from 'element-plus';
import { ContactofficeStore } from '@common/src/stores/studio/other/contactoffice'; // 列表 // 列表
import { DictDataStore } from '@common/src/stores/users/sysdictdata'; // 字典表
import type { IQueryResult } from '@/util/types.util';
const contactoffice = ContactofficeStore();
const sysdictdata = DictDataStore();
// 表单
let form: Ref<{ content: string }> = ref({ content: '' });
// 必填项
const rules = reactive<FormRules>({
  is_use: [{ required: true, message: '请选择是否启用', trigger: 'change' }],
  content: [{ required: true, message: '请输入信息内容', trigger: 'blur' }],
});
// 表单
let infoFields: Ref<any[]> = ref([
  { label: '是否启用', model: 'is_use', type: 'select' },
  { label: '信息内容', model: 'content', custom: true },
]);
let isuseList: Ref<any[]> = ref([]);

let user = store.state.user as { _id: string; role_type: string };
onMounted(async () => {
  await searchOther();
  await search();
});
const search = async () => {
  const res: IQueryResult = await contactoffice.query();
  form.value = res.data[0] as { content: string };
};
// 提交
const toSave = async (data: { _id: string; user_id: string }) => {
  data.user_id = user._id;
  let res: IQueryResult;
  if (data._id) res = await contactoffice.update(data);
  else res = await contactoffice.create(data);
  if (res.errcode == 0) ElMessage({ type: 'success', message: '维护信息成功' });
  else ElMessage({ type: 'warning', message: `${res.errmsg}` });
};
// 查询其他信息
const searchOther = async () => {
  // 字典表---审核状态
  const p1: IQueryResult = await sysdictdata.query({ dict_type: 'sys_yes_no' });
  isuseList.value = p1.data as [];
};
</script>

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