财务门户设计

web-vue/packages/biz/api/biz/notes.ts

@@ -0,0 +1,36 @@
+/**
+ * Copyright (c) 2013-Now http://jeesite.com All rights reserved.
+ * No deletion without permission, or be held responsible to law.
+ * @author gaoxq
+ */
+import { defHttp } from '@jeesite/core/utils/http/axios';
+import { useGlobSetting } from '@jeesite/core/hooks/setting';
+import { BasicModel, Page } from '@jeesite/core/api/model/baseModel';
+
+const { adminPath } = useGlobSetting();
+
+export interface BizNotes extends BasicModel<BizNotes> {
+  createTime?: string; // 创建时间
+  content: string; // 便签内容
+  ustatus: string; // 便签状态
+  updateTime: string; // 更新时间
+  createUser?: string; // 创建用户
+}
+
+export const bizNotesList = (params?: BizNotes | any) =>
+  defHttp.get<BizNotes>({ url: adminPath + '/biz/notes/list', params });
+  
+  export const bizNotesListAll = (params?: BizNotes | any) =>
+    defHttp.get<BizNotes[]>({ url: adminPath + '/biz/notes/listAll', params });
+
+export const bizNotesListData = (params?: BizNotes | any) =>
+  defHttp.post<Page<BizNotes>>({ url: adminPath + '/biz/notes/listData', params });
+
+export const bizNotesForm = (params?: BizNotes | any) =>
+  defHttp.get<BizNotes>({ url: adminPath + '/biz/notes/form', params });
+
+export const bizNotesSave = (params?: any, data?: BizNotes | any) =>
+  defHttp.postJson<BizNotes>({ url: adminPath + '/biz/notes/save', params, data });
+
+export const bizNotesDelete = (params?: BizNotes | any) =>
+  defHttp.get<BizNotes>({ url: adminPath + '/biz/notes/delete', params });

web-vue/packages/biz/views/biz/green/index.vue

@@ -0,0 +1,136 @@
+<template>
+  <div class="work-green-container">
+    <div class="header-section">
+      <div class="card-item col-1-85 section-1-item">
+        
+      </div>
+      <div class="card-item col-1-15 section-1-item">
+        头部第二列内容区域
+      </div>
+    </div>
+
+    <div class="main-container">
+      <div class="upper-section">
+        <div class="card-item col-3-equal">
+ 
+        </div>
+        <div class="card-item col-3-equal">
+          <HostInfo />
+        </div>
+        <div class="card-item col-3-equal">
+          上部第三列内容区域
+        </div>
+      </div>
+
+      <div class="middle-section">
+        <div class="card-item col-2-equal">
+        </div>
+        <div class="card-item col-2-equal">
+          中部第二列内容区域
+        </div>
+      </div>
+
+      <div class="lower-section">
+        <div class="card-item col-2-equal">
+          下部第一列内容区域
+        </div>
+        <div class="card-item col-2-equal">
+          下部第二列内容区域
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup name="WorkGreenPage">
+import { Icon } from '@jeesite/core/components/Icon';
+import { ref, onMounted, watch, onUnmounted, nextTick } from 'vue';
+import { BasicForm, FormProps } from '@jeesite/core/components/Form';
+
+</script>
+
+<style scoped>
+.work-green-container {
+  height: calc(100vh - 100px);
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 2px;
+  box-sizing: border-box;
+  overflow: hidden;
+}
+
+.header-section {
+  height: 10%;
+  display: flex;
+  gap: 8px;
+  box-sizing: border-box;
+}
+
+.main-container {
+  height: 90%;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  box-sizing: border-box;
+}
+
+.upper-section, .middle-section, .lower-section {
+  height: calc(100% / 3);
+  display: flex;
+  gap: 8px;
+  box-sizing: border-box;
+}
+
+.card-item {
+  height: 100%;
+  overflow: auto;
+  box-sizing: border-box;
+  background: #fff;
+  border: 1px solid #f0f0f0;
+  border-radius: 4px;
+  padding: 4px;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
+}
+
+.section-1-item {
+  border-color: #b3d8ff;
+  border-width: 1px;
+  border-style: solid;
+}
+
+.col-1-85 {
+  width: 85%;
+}
+.col-1-15 {
+  width: 15%;
+}
+
+.col-3-equal {
+  flex: 1;
+  width: 33.333%;
+}
+
+.col-2-equal {
+  flex: 1;
+  width: 50%;
+}
+
+@media (max-width: 768px) {
+  .header-section, .upper-section, .middle-section, .lower-section {
+    flex-direction: column;
+    height: auto !important;
+  }
+  .col-1-75, .col-1-25, .col-3-equal, .col-2-equal {
+    width: 100%;
+    height: 100px;
+  }
+  .work-green-container {
+    height: auto;
+    min-height: calc(100vh - 100px);
+  }
+  .main-container {
+    height: auto;
+  }
+}
+</style>