新增添加表单页面

 /*
  * @Date: 2022-06-17 14:54:29
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-11-17 10:41:39
+ * @LastEditTime: 2022-11-17 14:42:30
  * @FilePath: /data-table/src/api/form.js
  * @Description: 表单接口
  */
 import { fn, fetch } from '@/api/fn';
 
 const Api = {
+  FORM_ADD: '/srv/?a=add_form',
   FORM_QUERY: '/srv/?a=query_form',
 }
+
+/**
+ * @description: 新增表单
+ * @param: client_id 主体客户id
+ * @param: name 表单名称
+ * @param: note 表单描述
+ */
+export const addFormAPI = (params) => fn(fetch.post(Api.FORM_ADD, params));
+
 /**
  * @description: 查询表单
  * @param: client_id 主体客户id

+/*
+ * @Date: 2022-11-17 14:46:43
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-11-17 14:47:46
+ * @FilePath: /data-table/src/router/routes/modules/setForm/index.js
+ * @Description: 文件描述
+ */
+const index = [{
+  path: '/addForm',
+  name: '首页',
+  component: () => import('@/views/setForm/addForm.vue'),
+  meta: {
+    title: '新增表单',
+    name: 'addFormPage'
+  },
+  children: []
+}]
+
+export default index;

+<!--
+ * @Date: 2022-11-17 14:38:04
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-11-17 15:42:23
+ * @FilePath: /data-table/src/views/setForm/addForm.vue
+ * @Description: 添加表单
+-->
+<template>
+  <div class="add-form">
+    <van-nav-bar title="添加表单" />
+    <van-form @submit="onSubmit" style="margin-top: 1rem">
+      <van-cell-group inset>
+        <van-field
+          v-model="client"
+          name="client"
+          is-link
+          readonly
+          label="主体客户"
+          placeholder="主体客户"
+          @click="showPicker = true"
+          required
+          :rules="[{ required: true, message: '请填写主体客户' }]"
+        />
+        <van-field
+          v-model="name"
+          name="name"
+          label="表单名称"
+          placeholder="表单名称"
+          required
+          :rules="[{ required: true, message: '请填写表单名称' }]"
+        />
+        <van-field v-model="note" name="note" label="表单描述" placeholder="表单描述" />
+      </van-cell-group>
+      <div style="margin: 16px">
+        <van-button round block type="primary" native-type="submit">确认</van-button>
+      </div>
+    </van-form>
+  </div>
+
+  <van-popup v-model:show="showPicker" round position="bottom">
+    <van-picker :columns="columns" @cancel="showPicker = false" @confirm="onConfirm" />
+  </van-popup>
+</template>
+
+<script setup>
+import { ref } from "vue";
+import { useRoute, useRouter } from "vue-router";
+import { addFormAPI } from "@/api/form.js";
+import { showSuccessToast, showFailToast } from "vant";
+import {
+  Cookies,
+  $,
+  _,
+  axios,
+  storeToRefs,
+  mainStore,
+  Toast,
+  useTitle,
+} from "@/utils/generatePackage.js";
+//import { } from '@/utils/generateModules.js'
+//import { } from '@/utils/generateIcons.js'
+//import { } from '@/composables'
+const $route = useRoute();
+const $router = useRouter();
+useTitle($route.meta.title);
+
+const client = ref("");
+const client_id = ref("");
+const name = ref("");
+const note = ref("");
+
+const columns = [
+  { text: "弥陀", value: 120463 },
+  { text: "观宗", value: 81661 },
+];
+const result = ref("");
+const showPicker = ref(false);
+
+const onConfirm = ({ selectedOptions }) => {
+  showPicker.value = false;
+  client.value = selectedOptions[0].text;
+  client_id.value = selectedOptions[0].value;
+};
+
+const onSubmit = async (values) => {
+  const result = await addFormAPI({
+    client_id: client_id.value,
+    name: values.name,
+    note: values.note,
+  });
+  if (result.code) {
+    showSuccessToast("新增成功");
+  }
+};
+</script>
+
+<style lang="less" scoped></style>