提交上环境

.prettierrc.ts

+module.exports = {
+  // 字符串使用单引号
+  singleQuote: true,
+  // 每行末尾自动添加分号
+  semi: true,
+  // tab缩进大小,默认为2
+  tabWidth: 2,
+};

src/components/corn/JCorn.vue

+<template>
+  <div class="components-input-demo-presuffix">
+    <a-input
+      @click="openModal"
+      placeholder="corn表达式"
+      v-model="cron"
+      @change="handleOK"
+    >
+      <a-icon slot="prefix" type="schedule" title="corn控件" />
+      <a-icon
+        v-if="cron"
+        slot="suffix"
+        type="close-circle"
+        @click="handleEmpty"
+        title="清空"
+      />
+    </a-input>
+    <JCronModal ref="innerVueCron" :data="cron" @ok="handleOK"></JCronModal>
+  </div>
+</template>
+<script>
+import JCronModal from "@/components/corn/JCronModal.vue";
+
+export default {
+  name: "JCron",
+  components: {
+    JCronModal,
+  },
+  props: {
+    value: {
+      required: false,
+      type: String,
+      default: "",
+    },
+  },
+  data() {
+    return {
+      cron: this.value,
+    };
+  },
+  watch: {
+    value(val) {
+      this.cron = val;
+    },
+  },
+  methods: {
+    openModal() {
+      this.$refs.innerVueCron.show();
+    },
+    handleOK(val) {
+      this.cron = val;
+      this.$emit("change", this.cron);
+      // this.$emit("change", Object.assign({},  this.cron));
+    },
+    handleEmpty() {
+      this.handleOK("");
+    },
+  },
+  model: {
+    prop: "value",
+    event: "change",
+  },
+};
+</script>
+<style scoped>
+.components-input-demo-presuffix .anticon-close-circle {
+  cursor: pointer;
+  color: #ccc;
+  transition: color 0.3s;
+  font-size: 12px;
+}
+.components-input-demo-presuffix .anticon-close-circle:hover {
+  color: #f5222d;
+}
+.components-input-demo-presuffix .anticon-close-circle:active {
+  color: #666;
+}
+</style>

src/components/dropdownCheck/dropdownCheck.vue

+<!-- 下拉选择筛选 -->
+<template>
+  <el-dropdown ref="dropdown" :hide-on-click="false" trigger="contextmenu">
+    <span class="el-dropdown-link" @click="dropData.show">
+      {{title}}<el-icon class="el-icon--right"><arrow-down /></el-icon>
+    </span>
+    <template #dropdown>
+      <div class="space-between" style="width: 120px; padding: 10px 20px">
+        <el-checkbox
+          v-model="dropData.checkAll"
+          :indeterminate="dropData.isIndeterminate"
+          @change="dropData.handleCheckAllChange"
+          >全选</el-checkbox
+        >
+        <el-button type="primary" size="small" @click="dropData.confirm">确定</el-button>
+      </div>
+      <div style="height: 400px;width: 160px; overflow: auto">
+        <el-checkbox-group
+          v-model="dropData.checkedList"
+          @change="dropData.handleCheckedChange"
+        >
+          <el-dropdown-menu>
+            <el-dropdown-item v-for="(item, index) in list" :key="index">
+              <el-checkbox :label="item">
+                <div class="over1">
+                  {{item[prop]}}
+                </div>
+              </el-checkbox>
+            </el-dropdown-item>
+          </el-dropdown-menu>
+        </el-checkbox-group>
+      </div>
+    </template>
+  </el-dropdown>
+</template>
+
+<script lang="ts">
+import { reactive, ref } from 'vue'
+export default {
+  name: 'DropDownCheck',
+  props: {
+    modValue: {
+      type: Array,
+      default: null,
+      required: true
+    },
+    title: {
+      type: String,
+      default: ''
+    },
+    list: {
+      type: Array,
+      default: null
+    },
+    prop: {
+      type: String,
+      default: ''
+    }
+  },
+  setup(props, context) {
+    const dropdown = ref()
+    const dropData = reactive({
+      checkAll: false,
+      isIndeterminate: true,
+      checkedList: props.modValue,
+      handleCheckAllChange: (val: boolean) => {
+        dropData.checkedList = val ?  props.list : []
+        dropData.isIndeterminate = false
+        context.emit('update:modValue', dropData.checkedList)
+      },
+      handleCheckedChange: (value: string[]) => {
+        const checkedCount = value.length
+        dropData.checkAll = checkedCount === props.list.length
+        dropData.isIndeterminate = checkedCount > 0 && checkedCount < props.list.length
+        context.emit('update:modValue', dropData.checkedList)
+      },
+      show: () => {
+        dropdown.value.handleOpen()
+      },
+      confirm: () => {
+        dropdown.value.handleClose()
+        context.emit('onConfirm', props.title)
+      }
+    })
+
+    return {
+      dropData,
+      dropdown
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/components/inputTable/index.vue

+<template>
+  <el-table :data="tableData" style="width: 100%"  height="400px">
+    <el-table-column
+      v-for="(item, index) in tableTitle"
+      :key="index"
+      :label="item.lable"
+    >
+      <template #default="scope">
+        <div style="display: flex; align-items: center">
+          <el-input v-model="scope.row[item.prop]" placeholder="Please input" />
+        </div>
+      </template>
+    </el-table-column>
+    <el-table-column label="操作" width="180px" align="center" fixed="right">
+      <template #default="scope">
+        <div style="display: flex; align-items: center; justify-content: center">
+          <slot v-bind="scope"></slot>
+        </div>
+      </template>
+    </el-table-column>
+  </el-table>
+  <div class="flex-center-h" style="margin-top: 10px">
+    <el-input v-model="addInput" placeholder="输入名称" style="width: 300px">
+      <template #prepend>
+        <el-icon><Plus /></el-icon>
+      </template>
+    </el-input>
+    <el-button type="primary" style="margin-left: 10px" @click="add">新增</el-button>
+  </div>
+</template>
+
+<script lang="ts">
+import { ref } from 'vue'
+export default {
+  name: 'InputTable',
+  props: {
+    tableTitle: {
+      type: Array,
+      default: null
+    },
+    tableData: {
+      type: Array,
+      default: null
+    }
+  },
+  emits: ['onAdd'],
+  setup(props, context) {
+    const addInput = ref('')
+    const add = ref( async () => {
+      await context.emit('onAdd', addInput.value)
+      addInput.value = ''
+    })
+    return {
+      add,
+      addInput
+    }
+  }
+}
+</script>

src/mock/departmentManage.ts

+import Mock from 'mockjs'
+
+Mock.mock(`${import.meta.env.VITE_APP_BASE_URL}/department/index`, {
+  code: 200,
+  'data|1-10': [
+    {
+      "id|+1": 0,
+      cname: '@cname',
+      ename: '@name',
+      'type|+1': 0 ,
+      'code|+1': 'code001',
+      'children|1-10': [
+        {
+          "id|+1": 10,
+          cname: '@cname',
+          ename: '@name',
+          'type|+1': 0,
+          'code|+1': 'code002',
+          'children|1-10': [
+            {
+              "id|+1": 20,
+              cname: '@cname',
+              ename: '@name',
+              'type|+1': 0,
+              'code|+1': 'code003',
+            }
+          ]
+        }
+      ]
+    }
+  ],
+  msg: null,
+  success: true
+})
+
+Mock.mock(`${import.meta.env.VITE_APP_BASE_URL}/department/bizunit`, {
+  code: 200,
+  'data|1-10': [
+    {
+      "id|+1": 0,
+      cname: '@cname',
+      ename: '@name',
+      'depart|+1': '' ,
+      'product': '',
+      'code|+1': 'code001'
+    }
+  ],
+  msg: null,
+  success: true
+})

src/mock/project.ts

+import Mock from 'mockjs'
+
+Mock.mock(`${import.meta.env.VITE_APP_BASE_URL}/project/projectType`, {
+  code: 200,
+  'data|1-100': [
+    {
+      "id|+1": 0,
+      cname: '@cname',
+      ename: '@name',
+      'code|+1': 'code001',
+      'bizunits': [],
+      'effect_time': '@date',
+      'lose_effect_time': '@date',
+      'detail': ''
+    }
+  ],
+  msg: null,
+  success: true
+})
+
+Mock.mock(`${import.meta.env.VITE_APP_BASE_URL}/project/projectMaster`, {
+  code: 200,
+  'data|1-10': [
+    {
+      "id|+1": 0,
+      bizUnit: '研发事业部',
+      classificationIds: '',
+      classificationName: 'code001',
+      createTime: '@date',
+      'isEnabled|1': false,
+      name: '@cname',
+      notes: null,
+      'templatePhases|1-5': [
+        {
+          data: null,
+          children: [],
+          displayShow: null,
+          isLeaf: true,
+          'id|+1': 0,
+          label: '@cname',
+          'selected|1': false,
+          text: '',
+          title: '',
+          value: ''
+        }
+      ]
+    }
+  ],
+  msg: null,
+  success: true
+})

src/services/api/log/logApi.ts

+import { request } from "../config";
+
+// 查询日志
+export function getQueryxyunLog() {
+  return request({
+    url: "/api/log/list",
+    method: "get"
+  });
+}

src/services/api/synchronization/synchronizationAPI.ts

+import { request } from "../config";
+
+// 查询金蝶参数
+export function getSynchronization() {
+    return request ({
+        url: '/api/init/connect/parm',
+        method: 'get'
+    })
+}
+
+// 保存金蝶参数
+export function putSynchronization(data: any) {   
+    return request({
+        url: '/api/init/connect/parm/create',
+        method: 'post',
+        data
+    })
+}
+
+// 手动开启同步
+
+// 开启自动同步
+
+// 关闭自动同步
+
+// 手动重新同步错误同步

src/store/modules/app.ts

+import { ActionContext } from "vuex";
+import { RootState } from "..";
+export type AppState = {
+  clientHeight: any;
+}
+const state: AppState  = {
+  clientHeight: 900
+}
+
+const mutations = {
+  SET_CLIENTHEIGHT: (state: AppState, clientHeight: any) => {
+    state.clientHeight = clientHeight
+  }
+}
+
+const actions = {
+  setClientHeight({ commit }: ActionContext<AppState, RootState>, clientHeight: any) {
+    commit('SET_CLIENTHEIGHT', clientHeight)
+  }
+}
+
+const getters = {
+  getClientHeight() {
+    return state.clientHeight
+  }
+}
+
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions,
+  getters
+}

src/table/components/formateValue.vue

+<script lang="ts">
+import { FormItem } from '../type'
+import { PropType, h } from 'vue'
+export default {
+  name: 'FormateValue',
+  props: {
+    row: {
+      type: Object,
+      default: null
+    },
+    column: {
+      type: Object as PropType<FormItem>,
+      default: null
+    }
+  },
+  setup(props, context) {
+    const column: FormItem  = props.column
+    const row = props.row
+    switch (column.viewType) {
+      case 'field': {
+        return () => [
+          h('span', {
+            class: 'field'
+          }, row[column.prop])
+        ]
+      }
+      default: {
+        return () => [
+          h('span', {
+            class: 'field'
+          }, row[column.prop])
+        ]
+      }
+    }
+  }
+}
+</script>
\ No newline at end of file

src/views/department/bizunit.vue

+<template>
+  <div class="app-container">
+    <el-card shadow="always" :body-style="{ padding: '20px' }">
+      <el-tabs>
+        <el-tab-pane label="事业部">
+          <bizunit-table></bizunit-table>
+        </el-tab-pane>
+        <el-tab-pane label="部门角色">
+        </el-tab-pane>
+        <el-tab-pane label="事业部角色人员">
+        </el-tab-pane>
+      </el-tabs>
+    </el-card>
+  </div>
+</template>
+
+<script lang="ts">
+import BizunitTabel from './components/bizunitTable.vue'
+export default {
+  name: 'Bizunit',
+  components: {
+    'bizunit-table': BizunitTabel
+  },
+  setup() {
+  }
+}
+</script>
+
+<style lang="scss">
+
+</style>

src/views/department/components/bizunitTable.vue

+<template>
+  <Custom-table
+    :tableConfigData="tableConfigData"
+    @handle-show="handleShow"
+  >
+    <template v-slot:drawer>
+      <el-form-item
+        v-for="(item, index) in editData"
+        :key="index"
+        :label="item.label"
+        :prop="item.prop"
+      >
+        <custom-form-item
+          v-model:modValue="tableConfigData.drawerformData[item.prop]"
+          :type="item.type"
+          :inputType="item.inputValue"
+          :options="tableData"
+          :selectProp="item.selectProp"
+        >
+        </custom-form-item>
+      </el-form-item>
+    </template>
+  </Custom-table>
+</template>
+
+<script lang="ts">
+import { bizunitData } from '../tableConfigData/bizunit'
+import { Scope } from '@/table/type'
+import { ref, Ref, reactive } from 'vue'
+export default {
+  name: 'bizunitTable',
+  setup() {
+    const tableConfigData = reactive(bizunitData)
+    const tableData: Ref<any[]> = ref([])
+    const editData: Ref<any[]> = ref([])
+    tableConfigData.tableTitle.forEach(item => {
+      if (item.type) {
+        editData.value.push(item)
+      }
+    })
+    const handleShow = ref((params: { key: string, tableData: object[], scope?: Scope }) => {
+      tableData.value = params.tableData
+      const key = params.key
+      switch (key) {
+        case '新增':
+          tableConfigData.drawerformData = {
+            id: '',
+            type: 0,
+            cname: '',
+            ename: '',
+            code: '',
+            product: ''
+          }
+          break
+        case '编辑': {
+          if (!params.scope) return false
+          const row = params.scope.row
+          tableConfigData.drawerformData = {
+            id: row.id,
+            type: row.type,
+            cname: row.cname,
+            ename: row.ename,
+            code: row.code,
+            product: row.product
+          }
+          break
+        }
+      }
+    })
+    return {
+      tableConfigData,
+      handleShow,
+      tableData,
+      editData
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file

src/views/department/departmentManage.vue

+<template>
+  <div class="app-container">
+    <el-row :gutter="5">
+      <el-col :span="16">
+        <el-card shadow="always" :body-style="{ padding: '20px' }">
+          <template #header>
+            <div class="card-header">我的部门</div>
+          </template>
+          <Custom-table
+            :tableConfigData="tableConfigData"
+            @handle-show="handleShow"
+          >
+            <template v-slot:drawer>
+              <el-form-item
+                v-for="(item, index) in editData"
+                :key="index"
+                :label="item.label"
+                :prop="item.prop"
+              >
+                <custom-form-item
+                  v-model:modValue="tableConfigData.drawerformData[item.prop]"
+                  :type="item.type"
+                  :inputType="item.inputValue"
+                  :options="tableData"
+                  :selectProp="item.selectProp"
+                >
+                </custom-form-item>
+              </el-form-item>
+            </template>
+          </Custom-table>
+        </el-card>
+      </el-col>
+      <el-col :span="8">
+        <el-card shadow="always" :body-style="{ padding: '20px' }">
+          <el-tabs>
+            <el-tab-pane label="基本信息"></el-tab-pane>
+            <el-tab-pane label="部门权限"></el-tab-pane>
+          </el-tabs>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script lang="ts">
+import { departmentData } from './tableConfigData/departmentManage'
+import { Scope } from '@/table/type'
+import { ref, Ref, reactive } from 'vue'
+export default {
+  name: 'departmentManage',
+  setup() {
+    const tableConfigData = reactive(departmentData)
+    const tableData: Ref<any[]> = ref([])
+    const editData: Ref<any[]> = ref([])
+    tableConfigData.tableTitle.forEach(item => {
+      if (item.type) {
+        editData.value.push(item)
+      }
+    })
+    const handleShow = ref((params: { key: string, tableData: object[], scope?: Scope }) => {
+      console.log(params.tableData)
+      tableData.value = params.tableData
+      const key = params.key
+      switch (key) {
+        case '新增':
+          tableConfigData.drawerformData = {
+            id: '',
+            type: 0,
+            cname: '',
+            ename: '',
+            code: ''
+          }
+          break
+        case '编辑': {
+          if (!params.scope) return false
+          const row = params.scope.row
+          tableConfigData.drawerformData = {
+            id: row.id,
+            type: row.type,
+            cname: row.cname,
+            ename: row.ename,
+            code: row.code
+          }
+          break
+        }
+      }
+    })
+    return {
+      tableConfigData,
+      handleShow,
+      tableData,
+      editData
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/views/department/tableConfigData/bizunit.ts

+import { TableConfigData } from "@/table/type";
+
+const bizunitData: TableConfigData = {
+  title: '事业部',
+  tableTitle: [
+    {
+      label: '事业部名称',
+      prop: 'cname',
+      type: 'input'
+    },
+    {
+      label: '英文名称',
+      prop: 'ename',
+      type: 'input'
+    },
+    {
+      label: '编号',
+      prop: 'code',
+      type: 'input'
+    },
+    {
+      label: '对应部门',
+      prop: 'depart',
+      type: 'input'
+    },
+    {
+      label: '关联产品线',
+      prop: 'product',
+      type: 'input'
+    }
+  ],
+  drawerformData: {
+    id: '',
+    type: 0,
+    cname: '',
+    ename: '',
+    code: '',
+    product: ''
+  },
+  rules: {
+    cname: [
+      { required: true, message: '事业部名称', trigger: 'blur' }
+    ]
+  },
+  btnObj: {
+    width: '200',
+    isAdd: true,
+    isDelete: true
+  },
+  apiKey: 'department',
+  tableApi: '/bizunit',
+  dataKey: ''
+}
+
+export { bizunitData }

src/views/department/tableConfigData/departmentManage.ts

+import { TableConfigData } from "@/table/type";
+
+const departmentData: TableConfigData = {
+  title: '部门',
+  tableTitle: [
+    {
+      label: '部门名称',
+      prop: 'cname',
+      type: 'input'
+    },
+    {
+      label: '英文名称',
+      prop: 'ename',
+      type: 'input'
+    },
+    {
+      label: '编号',
+      prop: 'code',
+      type: 'input'
+    },
+    {
+      label: '类型',
+      prop: 'type',
+      type: 'input'
+    }
+  ],
+  drawerformData: {
+    id: '',
+    type: 0,
+    cname: '',
+    ename: '',
+    code: ''
+  },
+  rules: {
+    cname: [
+      { required: true, message: '请输入部门名称', trigger: 'blur' }
+    ]
+  },
+  btnObj: {
+    width: '200',
+    isAdd: true,
+    isDelete: true
+  },
+  apiKey: 'department',
+  tableApi: '/index',
+  dataKey: ''
+}
+
+export { departmentData }

src/views/project/components/dropdownCheck.vue

+<!-- 下拉选择筛选 -->
+<template>
+  <el-dropdown ref="dropdown" :hide-on-click="false" trigger="contextmenu">
+    <span class="el-dropdown-link" @click="dropData.show">
+      {{title}}<el-icon class="el-icon--right"><arrow-down /></el-icon>
+    </span>
+    <template #dropdown>
+      <div class="space-between" style="width: 120px; padding: 10px 20px">
+        <el-checkbox
+          v-model="dropData.checkAll"
+          :indeterminate="dropData.isIndeterminate"
+          @change="dropData.handleCheckAllChange"
+          >全选</el-checkbox
+        >
+        <el-button type="primary" size="small" @click="dropData.confirm">确定</el-button>
+      </div>
+      <div style="height: 400px;width: 160px; overflow: auto">
+        <el-checkbox-group
+          v-model="dropData.checkedList"
+          @change="dropData.handleCheckedChange"
+        >
+          <el-dropdown-menu>
+            <el-dropdown-item v-for="(item, index) in list" :key="index">
+              <el-checkbox :label="item">
+                <div class="over1">
+                  {{item[prop]}}
+                </div>
+              </el-checkbox>
+            </el-dropdown-item>
+          </el-dropdown-menu>
+        </el-checkbox-group>
+      </div>
+    </template>
+  </el-dropdown>
+</template>
+
+<script lang="ts">
+import { reactive, ref } from 'vue'
+export default {
+  name: 'DropDownCheck',
+  props: {
+    modValue: {
+      type: Array,
+      default: null,
+      required: true
+    },
+    title: {
+      type: String,
+      default: ''
+    },
+    list: {
+      type: Array,
+      default: null
+    },
+    prop: {
+      type: String,
+      default: ''
+    }
+  },
+  setup(props, context) {
+    const dropdown = ref()
+    const dropData = reactive({
+      checkAll: false,
+      isIndeterminate: true,
+      checkedList: props.modValue,
+      handleCheckAllChange: (val: boolean) => {
+        dropData.checkedList = val ?  props.list : []
+        dropData.isIndeterminate = false
+        context.emit('update:modValue', dropData.checkedList)
+      },
+      handleCheckedChange: (value: string[]) => {
+        const checkedCount = value.length
+        dropData.checkAll = checkedCount === props.list.length
+        dropData.isIndeterminate = checkedCount > 0 && checkedCount < props.list.length
+        context.emit('update:modValue', dropData.checkedList)
+      },
+      show: () => {
+        dropdown.value.handleOpen()
+      },
+      confirm: () => {
+        dropdown.value.handleClose()
+        context.emit('onConfirm', props.title)
+      }
+    })
+
+    return {
+      dropData,
+      dropdown
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/views/project/components/expectDoc.vue

+<template>
+  <el-drawer
+    v-model="drawerData.drawerShow"
+    title="配置交付文档"
+    direction="rtl"
+    :before-close="drawerData.handleClose"
+  >
+    <el-tabs class="demo-tabs" stretch>
+      <el-tab-pane v-for="(item, index) in list" :key="index">
+        <template #label>
+          <span class="custom-tabs-label">
+            <span>{{item.label}}</span>
+          </span>
+          <span class="count" v-if="item.children.length ">{{item.children.length}}</span>
+        </template>
+        <el-descriptions
+          v-for="(child, childIndex) in item.children"
+          :key="childIndex"
+          class="margin-top"
+          :title="child.name"
+          :column="3"
+          :size="size"
+          border
+        >
+          <template #extra>
+            <el-button type="primary" size="small" @click="drawerData.onAdd(index)">编辑</el-button>
+            <el-button type="primary" size="small" @click="drawerData.delete(childIndex)">删除</el-button>
+            <el-button type="primary" size="small" @click="drawerData.editRole">权限配置</el-button>
+            <el-button type="primary" size="small">审批路径</el-button>
+          </template>
+          <el-descriptions-item>
+            <template #label>
+              <div class="cell-item">
+                必须上传
+              </div>
+            </template>
+            {{child.isUpload}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <div class="cell-item">
+                必须审批
+              </div>
+            </template>
+            {{child.isComment}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <div class="cell-item">
+                默认文件夹
+              </div>
+            </template>
+            {{child.folder}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <div class="cell-item">
+                评审方式
+              </div>
+            </template>
+            {{child.isComment}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <div class="cell-item">
+                秘级
+              </div>
+            </template>
+            {{child.level}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <div class="cell-item">
+                文档编号
+              </div>
+            </template>
+            {{child.code}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <div class="cell-item">
+                前置交付文档
+              </div>
+            </template>
+            {{ child.beforeFolder}}
+          </el-descriptions-item>
+          <el-descriptions-item>
+            <template #label>
+              <div class="cell-item">
+                文档说明
+              </div>
+            </template>
+            {{ child.desc }}
+          </el-descriptions-item>
+        </el-descriptions>
+        <el-empty description="暂无文档" v-if="item.children.length === 0" />
+        <el-button type="primary" style="margin-top: 10px" size="small" @click="drawerData.onAdd(index)">添加交付文档清单</el-button>
+        <el-button type="primary" style="margin-top: 10px" size="small">设置排序</el-button>
+      </el-tab-pane>
+    </el-tabs>
+  </el-drawer>
+  <el-dialog v-model="dialogData.visible" title="交付文档">
+    <el-form :model="dialogData.formData" :rules="dialogData.rules" label-width="120px">
+      <el-form-item
+        v-for="(item, index) in dialogData.formItem"
+        :key="index"
+        :label="item.label"
+        :prop="item.prop"
+      >
+        <custom-form-item
+          v-model:modValue="dialogData.formData[item.prop]"
+          :type="item.type"
+          :inputType="item.inputValue"
+          :options="list"
+          :selectProp="item.selectProp"
+        >
+          <template v-slot:radios>
+            <el-radio :label="0">机密</el-radio>
+            <el-radio :label="1">秘密</el-radio>
+            <el-radio :label="2">内部公开</el-radio>
+            <el-radio :label="3">公开</el-radio>
+          </template>
+        </custom-form-item>
+      </el-form-item>
+    </el-form>
+     <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="dialogData.visible = false">取消</el-button>
+        <el-button type="primary" @click="dialogData.onConfirm"
+          >确定</el-button
+        >
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+<script lang="ts">
+import { reactive } from 'vue'
+import { ElMessageBox, ElMessage } from 'element-plus'
+import { FormItem } from '@/table/type'
+export default {
+  name: 'ExpectDoc',
+  props: {
+    list: {
+      type: Array as any,
+      default: () => {
+        return []
+      }
+    }
+  },
+  setup(props) {
+    const drawerData = reactive({
+      drawerShow: false,
+      index: 0,
+      show: () => {
+        drawerData.drawerShow = true
+      },
+      onAdd: (index: number) => {
+        drawerData.index = index
+        dialogData.visible = true
+      },
+      delete: (index: number) => {
+        ElMessageBox.confirm('确定删除吗？', '温馨提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning',
+        }).then(() => {
+          ElMessage({
+            type: 'success',
+            message: '删除成功',
+          })
+        })
+      },
+      editRole: () => {
+        ElMessage({
+          type: 'error',
+          message: '部门功能未开发，暂无法配置权限',
+        })
+      }
+    })
+
+    const formItem: FormItem[] = [
+      {
+        label: '交付文档名称',
+        prop: 'name',
+        type: 'input'
+      },
+      {
+        label: '默认存放文件夹',
+        prop: 'folder',
+        type: 'input'
+      },
+      {
+        label: '所属阶段',
+        prop: 'pharse',
+        type: 'select',
+        selectProp: {
+          value: 'id',
+          label: 'label'
+        }
+      },
+      {
+        label: '文档分类',
+        prop: 'type',
+        type: 'select',
+        selectProp: {
+          value: 'id',
+          label: 'label'
+        }
+      },
+      {
+        label: '文档编号',
+        prop: 'code',
+        type: 'input'
+      },
+      {
+        label: '评审方式',
+        prop: 'commentType',
+        type: 'select',
+        selectProp: {
+          value: 'id',
+          label: 'label'
+        }
+      },
+      {
+        label: '密级',
+        prop: 'level',
+        type: 'radio'
+      },
+      {
+        label: '必须上传',
+        prop: 'isUpload',
+        type: 'switch'
+      },
+      {
+        label: '必须审批',
+        prop: 'isComment',
+        type: 'switch'
+      },
+      {
+        label: '前置交付文档',
+        prop: 'beforeFolder',
+        type: 'select',
+        selectProp: {
+          value: 'id',
+          label: 'label'
+        }
+      },
+      {
+        label: '文档说明',
+        prop: 'desc',
+        type: 'input',
+        inputType: 'textarea'
+      },
+    ]
+
+    const dialogData = reactive({
+      visible: false,
+      formItem: formItem,
+      formData: {
+        id: '',
+        name: '',
+        folder: '',
+        pharse: '',
+        type: '',
+        code: '',
+        commentType: '',
+        level: 0,
+        isUpload: true,
+        isComment: true,
+        beforeFolder: '',
+        desc: ''
+      },
+      rules: {
+        name: [
+          { required: true, message: '请输入交付文档名称', trigger: 'blur' }
+        ],
+        commentType: [
+          { required: true, message: '请输入选择评审类型', trigger: 'blur' }
+        ]
+      },
+      onConfirm: () => {
+        props.list[drawerData.index].children.push(dialogData.formData)
+        dialogData.visible = false
+      }
+    })
+    return { drawerData, dialogData }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.count{
+  position: absolute;
+  top: 0px; right: 0;
+  width: 20px;
+  height: 20px;
+  display: flex; align-items: center; justify-content: center;
+  border-radius: 50%;
+}
+.margin-top{
+  margin-top: 20px;
+}
+</style>

src/views/project/components/folder.vue

+<template>
+  <el-drawer
+    v-model="drawerData.drawerShow"
+    title="编辑文件夹"
+    direction="rtl"
+    :before-close="drawerData.handleClose"
+  >
+    <CustomInputTable
+      :tableTitle="drawerData.tableTitle"
+      :tableData="drawerData.tableData"
+      @onAdd="drawerData.onAdd"
+    >
+      <template #default="scope">
+        <el-button type="danger" size="small" @click="drawerData.delete(scope.$index)">删除</el-button>
+      </template>
+    </CustomInputTable>
+  </el-drawer>
+</template>
+
+<script lang="ts">
+import { reactive } from 'vue'
+import { ElMessageBox, ElMessage } from 'element-plus'
+export default {
+  name: 'Folder',
+  setup() {
+    const tableData: {
+      isLeaf: true;
+      key: string;
+      level: number;
+      name: string;
+      parentId: string;
+      title: string;
+      value: string;
+    }[] = []
+    const drawerData = reactive({
+      drawerShow: false,
+      tableTitle: [
+        {
+          lable: '文件夹',
+          prop: 'name'
+        }
+      ],
+      tableData: tableData,
+      show: () => {
+        drawerData.drawerShow = true
+      },
+      onAdd: (value: string) => {
+        if (!value) {
+          return false
+        }
+        drawerData.tableData.push({
+          isLeaf: true,
+          key: '',
+          level: 0,
+          name: value,
+          parentId: '',
+          title: value,
+          value: ''
+        })
+      },
+      delete: (index: number) => {
+        ElMessageBox.confirm('确定删除吗？', '温馨提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning',
+        }).then(() => {
+          drawerData.tableData.splice(index, 1)
+          ElMessage({
+            type: 'success',
+            message: '删除成功',
+          })
+        })
+      }
+    })
+    return { drawerData }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/views/project/components/judge.vue

+<template>
+  <el-drawer
+    v-model="drawerData.drawerShow"
+    title="评审配置"
+    direction="rtl"
+    :before-close="drawerData.handleClose"
+    size="70%"
+  >
+    <el-row :gutter="20">
+      <el-col :span="6">
+        <div style="height: 40px">评审流程</div>
+        <el-tree
+          :data="drawerData.treeData"
+          accordion
+          @node-click="drawerData.handleNodeClick"
+        />
+      </el-col>
+      <el-col :span="18">
+        <el-tabs class="demo-tabs">
+          <el-tab-pane v-for="(item, index) in list" :key="index">
+            <template #label>
+              <span class="custom-tabs-label">
+                <span>{{item.label}}</span>
+              </span>
+            </template>
+            <el-table :data="drawerData.tableData"  style="width: 100%">
+              <el-table-column type="selection" />
+              <el-table-column prop="name" label="交付物" />
+              <el-table-column prop="type" label="评审方式" width="100" />
+              <el-table-column prop="isComment" label="必须审批" width="100" />
+            </el-table>
+          </el-tab-pane>
+        </el-tabs>
+      </el-col>
+    </el-row>
+  </el-drawer>
+</template>
+
+<script lang="ts">
+import { reactive } from 'vue'
+interface Tree {
+  label: string
+  children?: Tree[]
+}
+interface JudgeTableObj{
+  name: string;
+  type: string;
+  isComment: '是' | '否'
+}
+export default {
+  name: 'Judge',
+  props: {
+    list: {
+      type: Array,
+      default: null
+    }
+  },
+  setup() {
+    const data: Tree[] = [
+      {
+        label: '无分类',
+        children: [
+          {
+            label: '重大里程碑节点'
+          },
+          {
+            label: '立项评审'
+          },
+          {
+            label: '研发方案评审'
+          },
+          {
+            label: '文档评审流程'
+          },
+          {
+            label: '项目计划发布评审'
+          },
+          {
+            label: 'GR1质量阀里程碑评审'
+          },
+          {
+            label: '新文档评审流程'
+          }
+        ]
+      },
+      {
+        label: 'DCP',
+        children: [
+          {
+            label: '重大里程碑节点'
+          },
+          {
+            label: '立项评审'
+          },
+          {
+            label: '研发方案评审'
+          }
+        ]
+      },
+      {
+        label: 'TR',
+        children: [
+          {
+            label: '项目计划发布评审'
+          },
+          {
+            label: 'GR1质量阀里程碑评审'
+          },
+          {
+            label: '新文档评审流程'
+          }
+        ]
+      },
+      {
+        label: '文档',
+        children: []
+      }
+    ]
+    const tableData: JudgeTableObj[] = [
+      {
+        name: 'admin',
+        type: '不需要评审',
+        isComment: '否'
+      },
+      {
+        name: '测试',
+        type: '不需要评审',
+        isComment: '是'
+      }
+    ]
+    const drawerData = reactive({
+      drawerShow: false,
+      activeName: '',
+      treeData: data,
+      tableData: tableData,
+      show: () => {
+        drawerData.drawerShow = true
+      },
+      handleNodeClick: (data: Tree) => {
+        console.log(data)
+      }
+    })
+    return { drawerData }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-row {
+  margin-bottom: 20px;
+}
+.el-row:last-child {
+  margin-bottom: 0;
+}
+.el-col {
+  border-radius: 4px;
+}
+
+.grid-content {
+  border-radius: 4px;
+  min-height: 36px;
+}
+</style>

src/views/project/components/plan.vue

+<template>
+  <el-drawer
+    v-model="drawerData.drawerShow"
+    title="编辑计划"
+    direction="rtl"
+    :before-close="drawerData.handleClose"
+    size="70%"
+  >
+    <el-button type="primary" size="small" @click="drawerData.visible = true">新增计划</el-button>
+    <el-tabs class="demo-tabs">
+      <el-tab-pane v-for="(item, index) in drawerData.list" :label="item.name" :key="index">
+        <CustomInputTable
+          :tableTitle="drawerData.tableTitle"
+          :tableData="drawerData.tableData"
+          @onAdd="drawerData.onAdd"
+        >
+          <template #default="scope">
+            <el-button type="danger" size="small" @click="drawerData.delete(scope.$index)">删除</el-button>
+          </template>
+        </CustomInputTable>
+      </el-tab-pane>
+    </el-tabs>
+  </el-drawer>
+  <el-dialog v-model="drawerData.visible" title="新增计划">
+    <el-form :model="drawerData.formData" :rules="drawerData.rules" label-width="100px">
+      <el-form-item label="计划名称" prop="name">
+        <el-input v-model="drawerData.formData.name" autocomplete="off" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="drawerData.visible = false">取消</el-button>
+        <el-button type="primary" @click="drawerData.addPlan"
+          >确定</el-button
+        >
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+<script lang="ts">
+import { reactive } from 'vue'
+import { ElMessageBox, ElMessage } from 'element-plus'
+export default {
+  name: 'Plan',
+  setup() {
+    const tableData: {
+      id: number;
+      task: string;
+      count: string;
+      time: string;
+      beforeTask: string;
+      pharse: string;
+      folder: string;
+      role: string;
+      more: string;
+    }[] = []
+    const drawerData = reactive({
+      drawerShow: false,
+      list: [
+        {
+          name: '主计划'
+        }
+      ],
+      tableTitle: [
+        {
+          lable: '序号',
+          prop: 'id'
+        },
+        {
+          lable: '任务',
+          prop: 'task'
+        },
+        {
+          lable: '工期',
+          prop: 'count'
+        },
+        {
+          lable: '标准工时',
+          prop: 'time'
+        },
+        {
+          lable: '前置任务',
+          prop: 'beforeTask'
+        },
+        {
+          lable: '关联阶段',
+          prop: 'pharse'
+        },
+        {
+          lable: '预期交付文档',
+          prop: 'folder'
+        },
+        {
+          lable: '责任角色',
+          prop: 'role'
+        },
+        {
+          lable: '更多属性',
+          prop: 'more'
+        },
+      ],
+      tableData: tableData,
+      visible: false,
+      formData: {
+        name: ''
+      },
+      rules: {
+        name: [{
+          required: true, message: '请输入计划名称', trigger: 'blur'
+        }]
+      },
+      show: () => {
+        drawerData.drawerShow = true
+      },
+      addPlan: ()=> {
+        drawerData.list.push({
+          name: drawerData.formData.name
+        })
+        drawerData.visible = false
+      },
+      onAdd: (value: string) => {
+        if (!value) {
+          return false
+        }
+        drawerData.tableData.push({
+          id: Date.now(),
+          task: value,
+          count: '',
+          time: '',
+          beforeTask: '',
+          pharse: '',
+          folder: '',
+          role: '',
+          more: '更多详情',
+        })
+      },
+      delete: (index: number) => {
+        ElMessageBox.confirm('确定删除吗？', '温馨提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning',
+        }).then(() => {
+          drawerData.tableData.splice(index, 1)
+          ElMessage({
+            type: 'success',
+            message: '删除成功',
+          })
+        })
+      }
+    })
+    return { drawerData }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/views/project/components/projectMasterEdit.vue

+<template>
+   <el-dialog v-model="dialogData.visible" title="项目模板">
+    <el-form :model="dialogData.formData" :rules="dialogData.rules" label-width="100px">
+      <el-form-item label="模板名称" prop="name">
+        <el-input v-model="dialogData.formData.name" autocomplete="off" />
+      </el-form-item>
+      <el-form-item label="事业部">
+        <el-select v-model="dialogData.formData.bizUnits" placeholder="请选择事业部" multiple>
+          <el-option label="研发事业部" value="研发事业部" />
+          <el-option label="业务事业部" value="业务事业部" />
+          <el-option label="电梯事业部" value="电梯事业部" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="适用于">
+        <el-radio-group v-model="dialogData.formData.radioType" class="ml-4">
+          <el-radio label="0" size="large">项目类型</el-radio>
+          <el-radio label="1" size="large">项目分类</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="范围选择" v-show="dialogData.formData.radioType === '0'">
+        <el-radio-group v-model="dialogData.formData.range" class="ml-4">
+          <el-radio label="0" size="large">所有项目类型</el-radio>
+          <el-radio label="1" size="large">部分项目类型</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="项目类型" v-show="dialogData.formData.radioType === '1'">
+        <el-radio-group v-model="dialogData.formData.projectType" class="ml-4">
+          <el-radio :label="item.id" size="large" v-for="(item, index) in list" :key="index">{{item.cname}}</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="项目类型" v-show="dialogData.formData.range === '1'">
+        <el-checkbox-group v-model="dialogData.formData.checkList1">
+          <el-checkbox :label="item.cname" v-for="(item, index) in list" :key="index"/>
+        </el-checkbox-group>
+      </el-form-item>
+      <el-form-item label="项目分类" v-show="dialogData.formData.radioType === '1'">
+        <el-checkbox-group v-model="dialogData.formData.checkList2">
+          <el-checkbox :label="item.cname" v-for="(item, index) in list" :key="index"/>
+        </el-checkbox-group>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button @click="dialogData.visible = false">取消</el-button>
+        <el-button type="primary" @click="dialogData.onConfirm"
+          >确定</el-button
+        >
+      </span>
+    </template>
+  </el-dialog>
+</template>
+
+<script lang="ts">
+import {  reactive } from 'vue'
+export default {
+  name: 'ProjectMasterEdit',
+  props: {
+    list: {
+      type: Array,
+      default: null
+    }
+  },
+  setup(props, context) {
+    const dialogData = reactive({
+      visible: false,
+      formData: {
+        name: '',
+        bizUnits: '',
+        radioType: '0',
+        range: '0',
+        projectType: '',
+        checkList1: [],
+        checkList2: []
+      },
+      rules: {
+        name: {
+          required: true, message: '请输入模板名称', trigger: 'blur'
+        }
+      },
+      show: () => {
+        dialogData.visible = true
+      },
+      onConfirm: () => {
+        context.emit('onConfirm', dialogData.formData)
+      }
+    })
+    return {
+      dialogData
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file

src/views/project/components/templatePhases.vue

+<template>
+   <el-dialog v-model="dialogData.visible" title="配置阶段">
+    <el-table :data="master.templatePhases" style="width: 100%"  height="400px">
+      <el-table-column label="阶段名称" width="400px">
+        <template #default="scope">
+          <div style="display: flex; align-items: center">
+            <el-input v-model="scope.row.label" placeholder="Please input" />
+          </div>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" width="180px" align="center">
+        <template #default="scope">
+          <div style="display: flex; align-items: center; justify-content: center">
+            <el-button type="danger" size="small" @click="dialogData.deletePharse(scope.$index)">删除</el-button>
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div class="flex-center-h" style="margin-top: 10px">
+      <el-input v-model="dialogData.addInput" placeholder="输入阶段名称" style="width: 300px">
+        <template #prepend>
+          <el-icon><Plus /></el-icon>
+        </template>
+      </el-input>
+      <el-button type="primary" style="margin-left: 10px" @click="dialogData.addPhases">新增</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script lang="ts">
+import {  reactive } from 'vue'
+import { ElMessageBox, ElMessage } from 'element-plus'
+export default {
+  name: 'TemplatePhases',
+  props: {
+    master: {
+      type: Object,
+      default: null
+    }
+  },
+  setup(props, context) {
+    const dialogData = reactive({
+      visible: false,
+      addInput: '',
+      show: () => {
+        dialogData.visible = true
+      },
+      addPhases: () => {
+        if (!dialogData.addInput) {
+          return false
+        }
+        props.master.templatePhases.push({
+          children: [],
+          data: null,
+          displayShow: null,
+          id: 1,
+          isLeaf: true,
+          label: dialogData.addInput,
+          selected: false,
+          text: '',
+          title: '',
+          value: '',
+        })
+        dialogData.addInput = ''
+      },
+      deletePharse: (index: number) => {
+        ElMessageBox.confirm('确定删除吗？', '温馨提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning',
+        }).then(() => {
+          props.master.templatePhases.splice(index, 1)
+          ElMessage({
+            type: 'success',
+            message: '删除成功',
+          })
+        })
+      }
+    })
+    return {
+      dialogData
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>
\ No newline at end of file

src/views/project/projectMaster.vue

+<template>
+  <div class="app-container">
+    <div class="flex-center-h" style="margin-bottom: 20px">
+      <dropdown-check
+        v-model:modValue="projectMasterData.projectTypeSelect"
+        title="项目类型"
+        :list="projectMasterData.projectType"
+        prop="cname"
+        @onConfirm="projectMasterData.onConfirm"
+      />
+      <dropdown-check
+        v-model:modValue="projectMasterData.projectTypeChildSelect"
+        title="项目子类"
+        :list="projectMasterData.projectType"
+        prop="cname"
+        @onConfirm="projectMasterData.onConfirm"
+        style="margin-left: 20px"
+      />
+      <el-button type="primary" style="margin-left: 20px" size="small" @click="projectMasterData.showDialog">新建模板</el-button>
+    </div>
+    <div class="list" v-for="(item, index) in projectMasterData.list" :key="index">
+      <el-card class="box-card">
+        <template #header>
+          <div class="card-header space-between">
+            <div class="flex-center-h">
+              <el-icon style="margin-right: 10px"><CopyDocument /></el-icon>
+              <span style="margin-right: 10px">{{item.name}}</span>
+              <el-dropdown style="margin-right: 10px">
+                <span class="el-dropdown-link" style="color: #1890ff">
+                  <el-icon><Setting /></el-icon>
+                  操作
+                </span>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item @click="projectMasterData.showDialog(item.id)">编辑</el-dropdown-item>
+                    <el-dropdown-item @click="projectMasterData.delete(item.id)">删除</el-dropdown-item>
+                    <el-dropdown-item @click="projectMasterData.showDialog(item.id)">复制现有模板</el-dropdown-item>
+                    <el-dropdown-item>复制现有项目</el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+              <el-dropdown>
+                <span class="el-dropdown-link" style="color: #1890ff">
+                  {{ item.isEnabled ? '停用' : '启用' }}
+                  <el-icon class="el-icon--right">
+                    <arrow-down />
+                  </el-icon>
+                </span>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item @click="item.isEnabled = false">启用</el-dropdown-item>
+                    <el-dropdown-item @click="item.isEnabled = true">停用</el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </div>
+            <div class="flex-center-h">
+              <el-link type="primary" link @click="projectMasterData.showPhases(item)">配置阶段</el-link>
+              <el-link type="primary" link @click="projectMasterData.showFolder(item.id)">配置文件夹</el-link>
+              <el-link type="primary" link @click="projectMasterData.showExpectDoc(item)">配置交付文档</el-link>
+              <el-link type="primary" link @click="projectMasterData.showPlan(item.id)">配置WBS计划</el-link>
+              <el-link type="primary" link @click="projectMasterData.showJudge(item)">评审配置</el-link> 
+            </div>
+          </div>
+          <div style="width: 600px; margin-top: 10px;">
+            <el-descriptions :column="3">
+              <el-descriptions-item label="项目类型">全局模板</el-descriptions-item>
+              <el-descriptions-item label="事业部">{{item.bizUnit}}</el-descriptions-item>
+              <el-descriptions-item label="创建日期">{{item.createTime}}</el-descriptions-item>
+            </el-descriptions>
+          </div>
+        </template>
+        <el-steps :active="item.templatePhases.length" finish-status="success" simple>
+          <el-step v-for="(step, index) in item.templatePhases" :key="index" :title="step.label" />
+        </el-steps>
+      </el-card>
+    </div>
+  </div>
+  <project-master-edit ref="masterEdit" :list="projectMasterData.projectType" />
+  <template-phases ref="templatePhasesDialog" :master="projectMasterData.master" />
+  <folder ref="folderWrap" />
+  <expectDoc ref="expectDocWrap" :list="projectMasterData.expectDocList" />
+  <plan ref="planWrap" />
+  <judge ref="judgeWrap" :list="projectMasterData.master.templatePhases" />
+</template>
+
+<script lang="ts">
+import { getTableList } from '@/services/api/customTable'
+import { reactive, ref } from 'vue'
+import DropDownCheck from './components/dropdownCheck.vue'
+import ProjectMasterEdit from './components/projectMasterEdit.vue'
+import TemplatePhases from './components/templatePhases.vue'
+import Folder from './components/folder.vue'
+import ExpectDoc from './components/expectDoc.vue'
+import Plan from './components/plan.vue'
+import Judge from './components/judge.vue'
+import { ElMessageBox } from 'element-plus'
+export default {
+  name: 'ProjectMaster',
+  components: {
+    'dropdown-check': DropDownCheck,
+    'project-master-edit': ProjectMasterEdit,
+    'template-phases': TemplatePhases,
+    'folder': Folder,
+    'expectDoc': ExpectDoc,
+    'plan': Plan,
+    'judge': Judge
+  },
+  setup() {
+
+    const masterEdit = ref() // 编辑组件
+    const templatePhasesDialog = ref() // 配置阶段组件
+    const folderWrap = ref() // 配置阶段组件
+    const expectDocWrap = ref()
+    const planWrap = ref()
+    const judgeWrap = ref()
+    const projectMasterData = reactive({
+      list: [],
+      projectType: [],
+      projectTypeSelect: [],
+      projectTypeChildSelect: [],
+      master: {},
+      expectDocList: [],
+      onConfirm: (key: string) => {
+        if (key === '项目类型') {
+          console.log(projectMasterData.projectTypeSelect)
+        } else {
+          console.log(projectMasterData.projectTypeChildSelect)
+        }
+      },
+      // 编辑模板
+      showDialog: (id?: string) => {
+        masterEdit.value.dialogData.show()
+      },
+      // 配置阶段
+      showPhases: (item: any) => {
+        projectMasterData.master = item
+        templatePhasesDialog.value.dialogData.show()
+      },
+      // 配置文件
+      showFolder: () => {
+        folderWrap.value.drawerData.show()
+      },
+      // 配置交付清单
+      showExpectDoc: (item: any) => {
+        expectDocWrap.value.drawerData.show(),
+        projectMasterData.expectDocList = item.templatePhases
+      },
+      // 打开计划
+      showPlan: () => {
+        planWrap.value.drawerData.show()
+      },
+      // 配置评审
+      showJudge: (item: any) => {
+        projectMasterData.master = item
+        judgeWrap.value.drawerData.show()
+      },
+      // 删除模板
+      delete: (id: string) => {
+        ElMessageBox.confirm('确定删除吗？', '温馨提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning',
+        }).then(() => {
+          
+        })
+      }
+    })
+    const init = () => {
+      getTableList('project/projectMaster').then((res: any) => {
+        if (res.code === 200) {
+          console.log(res)
+          projectMasterData.list = res.data
+        }
+      })
+      getTableList('project/projectType').then((res: any) => {
+        if (res.code === 200) {
+          console.log('项目类型', res)
+          projectMasterData.projectType = res.data
+        }
+      })
+    }
+    init()
+    return {
+      projectMasterData,
+      masterEdit,
+      templatePhasesDialog,
+      folderWrap,
+      expectDocWrap,
+      planWrap,
+      judgeWrap
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-link{
+  margin-left: 10px;
+}
+</style>>

src/views/project/projectType.vue

+<template>
+  <div class="app-container">
+    <Custom-table
+      :tableConfigData="tableConfigData"
+      @handle-show="handleShow"
+    >
+      <template v-slot:drawer>
+        <el-form-item
+          v-for="(item, index) in editData"
+          :key="index"
+          :label="item.label"
+          :prop="item.prop"
+        >
+          <custom-form-item
+            v-model:modValue="tableConfigData.drawerformData[item.prop]"
+            :type="item.type"
+            :inputType="item.inputValue"
+            :options="tableData"
+            :selectProp="item.selectProp"
+          >
+          </custom-form-item>
+        </el-form-item>
+      </template>
+    </Custom-table>
+  </div>
+</template>
+
+<script lang="ts">
+import { projectTypeData } from './tableConfigData/projectType'
+import { Scope } from '@/table/type'
+import { ref, Ref, reactive } from 'vue'
+export default {
+  name: 'ProjectType',
+  setup() {
+    const tableConfigData = reactive(projectTypeData)
+    const tableData: Ref<any[]> = ref([])
+    const editData: Ref<any[]> = ref([])
+    tableConfigData.tableTitle.forEach(item => {
+      if (item.type) {
+        editData.value.push(item)
+      }
+    })
+    const handleShow = ref((params: { key: string, tableData: object[], scope?: Scope }) => {
+      tableData.value = params.tableData
+      const key = params.key
+      switch (key) {
+        case '新增':
+          tableConfigData.drawerformData = {
+            id: '',
+            cname: '',
+            ename: '',
+            code: '',
+            bizunits: '',
+            effect_time: '',
+            lose_effect_time: '',
+            detail: ''
+          }
+          break
+        case '编辑': {
+          if (!params.scope) return false
+          const row = params.scope.row
+          tableConfigData.drawerformData = {
+            id: row.id,
+            cname: row.cname,
+            ename: row.ename,
+            code: row.code,
+            bizunits: row.bizunit,
+            effect_time: row.effect_time,
+            lose_effect_time: row.lose_effect_time,
+            detail: row.detail
+          }
+          break
+        }
+      }
+    })
+    return {
+      tableConfigData,
+      handleShow,
+      tableData,
+      editData
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/views/project/tableConfigData/projectList.ts

+import { TableConfigData } from "@/table/type";
+
+const projectListData: TableConfigData = {
+  title: '项目',
+  tableTitle: [
+    {
+      label: '快捷',
+      prop: 'quick',
+      type: '',
+      viewType: 'module',
+      width: '80',
+      fixed: 'left'
+    },
+    {
+      label: '状态',
+      prop: 'delayLevelName',
+      type: '',
+      viewType: 'module',
+      width: '80',
+      fixed: 'left'
+    },
+    {
+      label: '项目编号',
+      prop: 'code',
+      type: '',
+      viewType: 'field',
+      fixed: 'left'
+    },
+    {
+      label: '项目名称',
+      prop: 'name',
+      type: '',
+      viewType: 'module',
+      width: '200',
+      fixed: 'left'
+    },
+    {
+      label: '项目经理',
+      prop: 'managerName',
+      type: '',
+      viewType: 'field',
+      width: '120'
+    },
+    {
+      label: '项目阶段',
+      prop: 'phase',
+      type: '',
+      viewType: 'field',
+      width: '120'
+    },
+    {
+      label: '项目状态',
+      prop: 'state',
+      type: '',
+      viewType: 'field',
+      width: '120'
+    }
+  ],
+  drawerformData: {
+  },
+  btnObj: {
+    width: '100',
+    isAdd: false,
+    isDelete: false
+  },
+  apiKey: 'project',
+  tableApi: '/projectList',
+  dataKey: ''
+}
+
+export { projectListData }

src/views/project/tableConfigData/projectType.ts

+import { TableConfigData } from "@/table/type";
+
+const projectTypeData: TableConfigData = {
+  title: '事业部',
+  tableTitle: [
+    {
+      label: '项目类型',
+      prop: 'cname',
+      type: 'input'
+    },
+    {
+      label: '英文名称',
+      prop: 'ename',
+      type: 'input'
+    },
+    {
+      label: '编号',
+      prop: 'code',
+      type: 'input'
+    },
+    {
+      label: '适用事业部',
+      prop: 'bizunits',
+      type: 'input'
+    },
+    {
+      label: '生效时间',
+      prop: 'effect_time',
+      type: 'input'
+    },
+    {
+      label: '失效日期',
+      prop: 'lose_effect_time',
+      type: 'input'
+    },
+    {
+      label: '详细配置',
+      prop: 'detail',
+      type: 'input'
+    }
+  ],
+  drawerformData: {
+    id: '',
+    cname: '',
+    ename: '',
+    code: '',
+    bizunits: '',
+    effect_time: '',
+    lose_effect_time: '',
+    detail: ''
+  },
+  rules: {
+    cname: [
+      { required: true, message: '项目类型名称', trigger: 'blur' }
+    ]
+  },
+  btnObj: {
+    width: '200',
+    isAdd: true,
+    isDelete: true
+  },
+  apiKey: 'project',
+  tableApi: '/projectType',
+  dataKey: ''
+}
+
+export { projectTypeData }

src/views/system/scheduledTask.vue

+<template>
+  <el-card>
+    <!-- 筛选框 -->
+    <el-form
+      :model="form"
+      ref="resetFormData"
+      style="margin-top: 50px"
+      @keyup.enter.native="onSubmit"
+    >
+      <el-space :size="30">
+        <el-form-item label="任务类别：" prop="leibie">
+          <el-input
+            placeholder="请输入任务类别"
+            v-model="form.leibie"
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="任务状态：">
+          <el-select
+            v-model="form.region"
+            placeholder="请选择任务状态"
+            prop="region"
+          >
+            <el-option
+              v-for="(item, index) in options"
+              :key="index"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit">查询</el-button>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onClear">重置</el-button>
+        </el-form-item>
+      </el-space>
+    </el-form>
+    <!-- 新增 -->
+    <div style="margin-bottom: 20px">
+      <el-button type="primary" @click="addForm">新增</el-button>
+    </div>
+
+    <!-- table框 -->
+    <el-table :data="tableData" style="width: 100%" border stripe flexible>
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column
+        type="index"
+        label="#"
+        :index="indexMethod"
+        align="center"
+      />
+      <el-table-column prop="jobClassName" label="任务类名" align="center" />
+      <el-table-column prop="cronExpression" label="cron表达式" align="center" />
+      <el-table-column prop="parameter" label="参数" align="center" />
+      <el-table-column prop="description" label="描述" align="center" />
+      <el-table-column
+        prop="status"
+        label="状态"
+        width="100"
+        align="center"
+        :filters="[
+          { text: '已启动', value: '0' },
+          { text: '已暂停', value: '1' },
+        ]"
+        :filter-method="filterTag"
+        filter-placement="bottom-end"
+      >
+        <template #default="scope">
+          <el-tag
+            :type="scope.row.status === '已启动' ? '' : 'success'"
+            disable-transitions
+            >{{ scope.row.status }}</el-tag
+          >
+        </template>
+      </el-table-column>
+      <el-table-column prop="operation" label="操作" align="center" width="150px">
+        <template #default="scope">
+          <span
+            class="el-dropdown-link"
+            @click="handleNow(scope)"
+            style="color: #409eff; cursor: pointer; margin-top: 2px"
+            >启动</span
+          >
+
+          <el-divider direction="vertical" />
+          <el-dropdown
+            :hide-on-click="false"
+            style="color: #409eff; cursor: pointer; margin-top: 2px"
+          >
+            <span class="el-dropdown-link">
+              更多
+              <el-icon class="el-icon--right">
+                <arrow-down />
+              </el-icon>
+            </span>
+            <template #dropdown>
+              <el-dropdown-menu>
+                <el-dropdown-item @click="restartNow"
+                  >立即执行</el-dropdown-item
+                >
+                <el-dropdown-item @click="handleEdit(scope)"
+                  >编辑</el-dropdown-item
+                >
+                <el-dropdown-item @click="handleDelete(scope)"
+                  >删除</el-dropdown-item
+                >
+              </el-dropdown-menu>
+            </template>
+          </el-dropdown>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页区域 -->
+    <div class="demo-pagination-block" style="margin-top: 20px">
+      <el-pagination
+        v-model:currentPage="currentPage"
+        v-model:page-size="pageSize"
+        :page-sizes="[10, 20, 30]"
+        small
+        :disabled="disabled"
+        :background="background"
+        layout="->, sizes, prev, pager, next"
+        :total="total"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
+    </div>
+
+    <!-- 对话框区域 -->
+    <el-dialog
+      v-model="dialogVisible"
+      :title="titleName"
+      width="50%"
+      :before-close="handleClose"
+    >
+      <el-form
+        :mode="taskForm"
+        label-position="right"
+        label-width="100px"
+        style="padding: 5%"
+      >
+        <el-form-item
+          label="任务类别"
+          prop="jobClassName"
+          :rules="[{ required: true, message: '请输入任务类别：' }]"
+        >
+          <el-input v-model="taskForm.jobClassName" placeholder="请输入任务类别：" clearable></el-input>
+        </el-form-item>
+        <el-form-item label="cron表达式：" prop="cronExpression">
+          <!-- <j-cron
+            ref="innerVueCron"
+            v-model="taskForm.cronExpression"
+            placeholder="* * * * * ? *"
+            @change="setCorn"
+          ></j-cron> -->
+          <el-input v-model="taskForm.cronExpression" placeholder="* * * * * ? *" clearable></el-input>
+        </el-form-item>
+        <el-form-item label="参数：" prop="parameter">
+          <el-input type="textarea" v-model="taskForm.parameter" placeholder="请输入参数：" clearable></el-input>
+        </el-form-item>
+        <el-form-item label="描述：" prop="description">
+          <el-input type="textarea" v-model="taskForm.description" placeholder="请输入描述：" clearable></el-input>
+        </el-form-item>
+        <el-form-item label="状态：" prop="status">
+          <el-radio-group v-model="taskForm.status">
+            <el-radio-button label="正常"></el-radio-button>
+            <el-radio-button label="停止"></el-radio-button>
+          </el-radio-group>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="handleClose">Cancel</el-button>
+          <el-button type="primary" @click="dialogVisible = false"
+            >Confirm</el-button
+          >
+        </span>
+      </template>
+    </el-dialog>
+  </el-card>
+</template>
+
+<script setup lang="ts">
+import JCron from "@/components/corn/JCorn.vue";
+import { ref, reactive, nextTick } from "vue";
+import { ElForm, ElMessage, ElMessageBox } from "element-plus";
+
+// table的index列
+const indexMethod = (index: number) => {
+  index = 1;
+  return index ++;
+};
+const options = ref([
+  { label: "全部", value: "0" },
+  { label: "正常", value: "1" },
+  { label: "停止", value: "2" },
+]);
+
+interface List {
+  jobClassName: string;
+  cronExpression: string;
+  parameter: string;
+  description: string;
+  status: string;
+  operation: string;
+}
+const tableData: List[] = [
+  {
+    jobClassName: "table",
+    cronExpression: "table",
+    parameter: "table",
+    description: "table",
+    status: "true",
+    operation: "table",
+  },
+];
+
+const taskForm = reactive({
+  jobClassName: "",
+  cronExpression: "",
+  parameter: "",
+  description: "",
+  status: "",
+});
+
+const total = ref(100)
+const currentPage = ref(10);
+const pageSize = ref(10);
+const background = ref(false);
+const disabled = ref(false);
+
+// ref
+const resetFormData = ref<InstanceType<typeof ElForm>>();
+const form = reactive({
+  region: "",
+  leibie: "",
+});
+
+// 对话框
+const dialogVisible = ref(false);
+// 表单的标题
+const titleName = ref("");
+const onSubmit = () => {
+  const { region, leibie } = form;
+  console.log("查询" + region + "--" + leibie);
+};
+
+// 重置按钮
+const onClear = () => {
+  // 清空数组
+  resetFormData.value?.resetFields();
+};
+
+const filterTag = (value: string, row: List) => {
+  // return row.e === value
+  console.log("prop:" + row.status + "true or false:" + value);
+};
+// 新增任务
+const addForm = () => {
+  titleName.value = "新增任务";
+  dialogVisible.value = true;
+  console.log("新增");
+};
+const handleEdit = (res: any) => {
+  titleName.value = "编辑任务";
+  dialogVisible.value = true;
+  console.log("编辑");
+};
+const handleDelete = (res: any) => {
+  ElMessageBox.confirm("确认删除？", "确认提醒", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(() => {
+      ElMessage({ type: "success", message: "删除成功" });
+    })
+    .catch(() => {
+      ElMessage({ type: "info", message: "取消删除" });
+    });
+  console.log("删除");
+};
+// 启动任务
+const handleNow = (res: any) => {
+  console.log("启动");
+};
+// 立即执行
+const restartNow = () => {
+  ElMessageBox.confirm("是否立即执行任务？", "确认提醒", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(() => {
+      ElMessage({ type: "success", message: "执行成功" });
+    })
+    .catch(() => {
+      ElMessage({ type: "info", message: "取消执行" });
+    });
+};
+// 分页事件
+const handleSizeChange = (val: number) => {
+  console.log(`${val} items per page`);
+};
+const handleCurrentChange = (val: number) => {
+  console.log(`current page: ${val}`);
+};
+// 关闭对话框
+const handleClose = () => {
+  titleName.value = "";
+  dialogVisible.value = false;
+  console.log("关闭对话框");
+};
+
+// corn表达式
+const setCorn = (data: any) => {
+  console.log("data)", data);
+  nextTick(() => {
+    taskForm.cronExpression = data;
+  });
+  if (Object.keys(data).length == 0) {
+    ElMessage.warning("请输入cron表达式!");
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

src/views/system/synchronizationManage.vue

+<template>
+  <!-- 按钮 -->
+  <div style="margin: 50px 50px">
+    <el-space :size="30">
+      <el-button type="primary" icon="SwitchButton" @click="handleOpen"
+        >启用同步</el-button
+      >
+      <el-button type="info" icon="CircleClose" @click="handleClose"
+        >关闭同步</el-button
+      >
+      <el-button type="primary" icon="Refresh" @click="handleManual"
+        >手动同步</el-button
+      >
+    </el-space>
+  </div>
+
+  <!-- 表单区域 -->
+  <div style="height: 500px; width: 500px; margin: auto 25%">
+    <el-form
+      ref="ruleFormRef"
+      :rules="rules"
+      :model="sybchronizationForm"
+      label-position="right"
+      label-width="100px"
+      class="demo-ruleForm"
+      style="margin-top: 50px"
+    >
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="金蝶地址：" prop="k3CloudUrl">
+            <el-input
+              v-model="sybchronizationForm.k3CloudUrl"
+              placeholder="请输入金蝶地址："
+              clearable
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24" prop="dbid">
+          <el-form-item label="数据库ID：">
+            <el-input
+              v-model="sybchronizationForm.dbid"
+              placeholder="请输入数据库ID："
+              clearable
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="语言：" prop="lang">
+            <el-input
+              v-model="sybchronizationForm.lang"
+              placeholder="请输入语言："
+              clearable
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="账号：" prop="uid">
+            <el-input
+              v-model="sybchronizationForm.uid"
+              placeholder="请输入账号："
+              clearable
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="密码：" prop="pwd">
+            <el-input
+              v-model="sybchronizationForm.pwd"
+              type="password"
+              placeholder="请输入密码："
+              clearable
+              show-password
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item style="margin-left: 20%">
+            <el-button
+              type="primary"
+              icon="Download"
+              @click="handleSave(ruleFormRef)"
+              >保存配置</el-button
+            >
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import {
+  getSynchronization,
+  putSynchronization,
+} from "@/services/api/synchronization/synchronizationAPI";
+import { ref, reactive, onMounted } from "vue";
+import { ElMessage } from "element-plus";
+import type { FormInstance, FormRules } from "element-plus";
+
+const sybchronizationForm = ref({
+  k3CloudUrl: "",
+  dbid: "",
+  lang: "",
+  uid: "",
+  pwd: "",
+});
+// 校验规则
+const rules = ref<FormRules>({
+  k3CloudUrl: [{ required: true, message: "金蝶地址不为空", trigger: "blur" }],
+  dbid: [{ required: true, message: "数据库ID不为空", trigger: "blur" }],
+  lang: [{ required: true, message: "语言不为空", trigger: "blur" }],
+  uid: [{ required: true, message: "账号不为空", trigger: "blur" }],
+  pwd: [{ required: true, message: "密码不为空", trigger: "blur" }]
+  });
+const ruleFormRef = ref<FormInstance>();
+onMounted(async () => {
+  const { data: res } = await getSynchronization();
+  sybchronizationForm.value = res;
+  console.log(res);
+});
+const isDisabled = ref(false);
+const handleOpen = () => {
+  if (isDisabled.value === true) return;
+  isDisabled.value = true;
+  console.log("启动同步");
+};
+const handleClose = () => {
+  if (isDisabled.value === false) return;
+  isDisabled.value = false;
+  console.log("关闭同步");
+};
+const handleManual = () => {
+  if (isDisabled.value === true) return;
+  isDisabled.value = true;
+  console.log("手动同步");
+};
+const handleSave = (formEl: FormInstance | undefined) => {
+  if (!formEl) return;
+  formEl.validate(async (valid, fields) => {
+    if (valid) {
+      const res: any = await putSynchronization(sybchronizationForm.value);
+      if (res.code === 200)
+        return ElMessage({ message: "保存参数成功！", type: "success" });
+      ElMessage({ message: "保存参数失败！", type: "error" });
+    } else {
+      console.log("校验失败", fields);
+      return false;
+    }
+  });
+};
+</script>
+
+<style lang="scss" scoped>
+.el-form-item {
+  margin-bottom: 40px;
+}
+</style>

src/views/system/tableConfigData/menuManage.ts

+import { TableConfigData } from "@/table/type";
+
+const menuConfigData: TableConfigData = {
+  title: '菜单',
+  tableTitle: [
+    {
+      label: '菜单名称',
+      prop: 'title',
+      type: 'input'
+    },
+    {
+      label: '菜单类型',
+      prop: 'type',
+      type: 'radio'
+    },
+    {
+      label: '上级菜单',
+      prop: 'parentId',
+      type: 'select',
+      selectProp: {
+        value: 'id',
+        label: 'title'
+      }
+    },
+    {
+      label: 'icon',
+      prop: 'icon',
+      type: 'input'
+    },
+    {
+      label: '组件',
+      prop: 'component',
+      type: 'input'
+    },
+    {
+      label: '路径',
+      prop: 'path',
+      type: 'input'
+    },
+    /* {
+      label: '控制器',
+      prop: 'apiKey',
+      type: 'input',
+      hidden: true
+    },
+    {
+      label: '是否显示',
+      prop: 'is_show',
+      type: 'switch',
+      hidden: true
+    }, */
+    {
+      label: '排序',
+      prop: 'sortNo',
+      type: 'input',
+      inputType: 'number'
+    }
+  ],
+  drawerformData: {
+    id: '',
+    type: 0,
+    title: '',
+    component: '',
+    path: '',
+    sortNo: 0,
+    apiKey: '',
+    parentId: '',
+    icon: '',
+    is_show: true
+  },
+  rules: {
+    title: [
+      { required: true, message: '请输入菜单名称', trigger: 'blur' }
+    ],
+    component: [
+      { required: true, message: '请输入菜单组件', trigger: 'blur' }
+    ],
+    path: [
+      { required: true, message: '请输入菜单路径', trigger: 'blur' }
+    ],
+    apiKey: [
+      { required: true, message: '请输入接口路径', trigger: 'blur' }
+    ]
+  },
+  btnObj: {
+    width: '200',
+    isAdd: true,
+    isDelete: true
+  },
+  apiKey: 'permission',
+  tableApi: '/getMenuTree',
+  dataKey: ''
+}
+
+export { menuConfigData }

src/views/system/tableConfigData/roleManage.ts

+import { TableConfigData } from "@/table/type";
+
+const roleConfigData: TableConfigData = {
+  title: '角色',
+  tableTitle: [
+    {
+      label: '角色编码',
+      prop: 'roleCode',
+      type: 'input'
+    },
+    {
+      label: '角色名称',
+      prop: 'roleName',
+      type: 'input'
+    },
+    {
+      label: '角色描述',
+      prop: 'roleDesc',
+      type: 'input',
+      inputType: 'textarea'
+    },
+    {
+      label: '创建时间',
+      prop: 'fdate',
+      type: ''
+    }
+  ],
+  drawerformData: {
+    id: '',
+    roleCode: '',
+    roleName: '',
+    roleDesc: ''
+  },
+  rules: {
+    roleCode: [
+      { required: true, message: '请输入角色编码', trigger: 'blur' }
+    ],
+    roleName: [
+      { required: true, message: '请输入角色名称', trigger: 'blur' }
+    ]
+  },
+  btnObj: {
+    width: '200',
+    isAdd: true,
+    isDelete: true
+  },
+  apiKey: 'role',
+  tableApi: '/list',
+  dataKey: 'records'
+}
+
+export { roleConfigData }

src/views/system/tableConfigData/useXyunLog.ts

+import { ref, onMounted } from "vue";
+import { getQueryxyunLog } from "@/services/api/log/logApi";
+
+export const useXyunLogTableList = () => {
+  const tableList = ref([]);
+  const total = ref(0)
+  const loading = ref(true)
+  onMounted(async () => {
+    const res = await getQueryxyunLog();
+    tableList.value = res.data.records;
+    total.value = res.data.total
+    loading.value = false
+  });
+  return {
+    tableList,
+    total,
+    loading
+  };
+};

src/views/system/xyunLog.vue

+<template>
+  <div class="router">
+    <el-card>
+      <el-space
+        direction="vertical"
+        alignment="align-items: left"
+        style="margin-top: 30px"
+      >
+        <!-- 过滤条件框 -->
+        <div>
+          <el-form :model="filterForm">
+            <el-space :size="40">
+              <el-form-item label="选择时间：">
+                <el-date-picker
+                  v-model="filterForm.dateTime"
+                  type="datetimerange"
+                  range-separator="至"
+                  start-placeholder="开始时间"
+                  end-placeholder="结束时间"
+                  @change="dateChange"
+                />
+              </el-form-item>
+              <el-form-item label="名称：" width="60px">
+                <el-input v-model="filterForm.name" />
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" @click="handleScreen">筛选</el-button>
+              </el-form-item>
+            </el-space>
+          </el-form>
+        </div>
+      </el-space>
+
+      <el-divider />
+
+      <!-- 表格 -->
+      <el-table
+        v-loading="loading"
+        :data="tableList"
+        border
+        stripe
+        style="width: 100%"
+        @selection-change="handleSelectionChange"
+      >
+        <el-table-column type="selection" width="55" />
+        <el-table-column
+          prop="flag"
+          label="同步状态"
+          :filters="[
+            { text: '同步成功', value: '0' },
+            { text: '同步失败', value: '1' },
+          ]"
+          :filter-method="filterTag"
+          :filter-multiple="false"
+          filter-placement="bottom-end"
+          align="center"
+        >
+          <template #default="scope">
+            {{ scope.row.flag }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="name" label="名称" />
+        <el-table-column prop="content" label="内容" />
+        <el-table-column prop="createTime" label="创建时间" />
+        <el-table-column fixed="right" label="操作" align="center">
+          <template #default="scope">
+            <el-button
+              link
+              type="primary"
+              size="small"
+              @click="handleDetails(scope.row)"
+              >详情</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <div style="margin-top: 20px">
+        <el-pagination
+          v-model:currentPage="currentPage"
+          v-model:page-size="pageSize"
+          :page-sizes="[10, 20, 30]"
+          :small="small"
+          :disabled="disabled"
+          :background="background"
+          layout="->, total, sizes, prev, pager, next, jumper"
+          :total="total"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          hide-on-single-page
+        />
+      </div>
+    </el-card>
+
+    <!-- 添加对话框 -->
+    <!-- <el-dialog v-model="dialogVisible" title="添加日志" width="40%">
+      <el-form
+        :model="addForm"
+        label-position="right"
+        label-width="100px"
+        style="padding: 0 5%"
+      >
+        <el-form-item label="名称：">
+          <el-input v-model="addForm.name" placeholder="请输入名称：" />
+        </el-form-item>
+        <el-form-item label="同步状态：">
+          <el-input v-model="addForm.flag" placeholder="请输入同步状态：" />
+        </el-form-item>
+        <el-form-item label="内容：">
+          <el-input v-model="addForm.content" placeholder="请输入内容：" />
+        </el-form-item>
+        <el-form-item label="请求参数：">
+          <el-input
+            type="textarea"
+            v-model="addForm.data"
+            placeholder="请输入请求参数："
+          />
+        </el-form-item>
+        <el-form-item label="同步时长：">
+          <el-input v-model="addForm.costime" placeholder="请输入同步时长：" />
+        </el-form-item>
+        <el-form-item label="错误原因：">
+          <el-input v-model="addForm.message" placeholder="请输入错误原因：" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="cancelVisible">取消</el-button>
+          <el-button type="primary" @click="confirmVisible">确认</el-button>
+        </span>
+      </template>
+    </el-dialog> -->
+
+    <!-- 详情页面 -->
+    <el-dialog v-model="visible" title="详情页面" width="40%">
+      <el-form
+        :model="detailForm"
+        label-position="left"
+        label-width="100px"
+        style="padding: 0 5%"
+        :disabled="(disabled = true)"
+      >
+        <el-form-item label="名称：">
+          <el-input v-model="detailForm.name" placeholder="名称为" />
+        </el-form-item>
+        <el-form-item label="同步状态：">
+          <el-input v-model="detailForm.flag" placeholder="同步状态为" />
+        </el-form-item>
+        <el-form-item label="内容：">
+          <el-input v-model="detailForm.content" placeholder="内容为" />
+        </el-form-item>
+        <el-form-item label="请求参数：">
+          <el-input
+            type="textarea"
+            v-model="detailForm.data"
+            placeholder="请求参数为"
+          />
+        </el-form-item>
+        <el-form-item label="同步时长：">
+          <el-input v-model="detailForm.costime" placeholder="同步时长为为" />
+        </el-form-item>
+        <el-form-item label="创建时间：">
+          <el-input v-model="detailForm.createTime" placeholder="创建时间为" />
+        </el-form-item>
+        <el-form-item label="错误原因：">
+          <el-input v-model="detailForm.message" placeholder="错误原因为" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="cancelVisible1">关闭</el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from "vue";
+import moment from "moment";
+import { ElTable } from "element-plus";
+import { useXyunLogTableList } from "./tableConfigData/useXyunLog";
+
+interface List {
+  flag: Boolean;
+  name: string;
+  createTime: string;
+  content: string;
+}
+const filterForm = ref({
+  dateTime: [] as any[],
+  name: ""
+})
+const detailForm = ref({
+  flag: "",
+  name: "",
+  content: "",
+  data: "",
+  message: "",
+  costime: "",
+  createTime: "",
+});
+const dialogVisible = ref(false);
+const visible = ref(false);
+// 多选框
+const multipleSelection = ref<List[]>([]);
+// 分页
+// 总页数
+// const total = ref(0);
+// 当前页数
+const currentPage = ref(4);
+// 每页条数
+const pageSize = ref(10);
+// 是否使用小型分页样式
+const small = ref(true);
+// 是否为分页按钮添加背景色
+const background = ref(false);
+// 是否禁用分页
+const disabled = ref(false);
+
+// onMounted(() => {
+//   init();
+// });
+// const init = () => {
+//   getQueryxyunLog().then((res) => {
+//     tableData.value = res.data.records
+//   });
+// };
+
+const { tableList, total, loading } = useXyunLogTableList();
+
+// 同步成功/失败
+const filterTag = (value: Boolean, row: any) => {
+  
+  console.log(row.flag);
+  return row.flag === value
+  // console.log(value);
+  // if(value) {
+  //   tableList.value.forEach(item => {
+  //     console.log(item);
+  //   })
+  // }
+};
+
+const dateChange = (value: any) => {
+  const time = [];
+  let starttime = moment(value[0]).format("YYYY-MM-DD HH:mm:ss");
+  let endtime = moment(value[1]).format("YYYY-MM-DD HH:mm:ss");
+  time.push(starttime, endtime);
+  filterForm.value.dateTime = time
+};
+// 选择多选框的数据
+const handleSelectionChange = (val: List[]) => {
+  multipleSelection.value = val;
+};
+// 点击弹出页面
+const addDialogVisible = () => {
+  dialogVisible.value = true;
+};
+// 详情
+const handleDetails = (scope: any) => {
+  console.log(filterForm.value);
+  
+  detailForm.value = scope;
+  visible.value = true;
+};
+// 对话框取消按钮
+const arr: any = [];
+const cancelVisible = () => {
+  detailForm.value = arr;
+  dialogVisible.value = false;
+};
+const cancelVisible1 = () => {
+  const arr: any = [];
+  detailForm.value = arr;
+  visible.value = false;
+};
+// 筛选按钮
+const handleScreen = () => {
+  console.log("点击筛选");
+};
+// 分页
+// 每页新条数
+const handleSizeChange = (val: number) => {
+  console.log(`${val} items per page`);
+};
+// 新页数
+const handleCurrentChange = (val: number) => {
+  console.log(`current page: ${val}`);
+};
+</script>
+<style scoped></style>

src/views/xyun/business/KingdeelogList.vue

+<template>
+<div class="kingdeelog-container">
+    
+</div>
+</template>
\ No newline at end of file