@misstalor17/elpis 1.0.0

package/app/pages/widgets/schema-search-bar/complex-view/input/input.vue

@@ -0,0 +1,37 @@
+<template>
+    <el-input v-model="dtoValue" v-bind="schema.option" class="input"></el-input>
+</template>
+    
+<script setup>
+import { ref, onMounted } from 'vue'
+
+const { schemaKey, schema } = defineProps({
+    schemaKey: String,
+    schema: Object
+})
+
+const dtoValue = ref()
+const emit = defineEmits(['loaded'])
+
+const getValue = () => {
+    return dtoValue.value !== undefined ? {
+        [schemaKey]: dtoValue.value
+    } : {}
+}
+
+const reset = () => {
+    dtoValue.value = schema?.option?.default
+}
+
+defineExpose({
+    getValue,
+    reset
+})
+onMounted(() => {
+    reset();
+    emit('loaded')
+})
+</script>
+    
+<style lang='less' scoped></style>
+    

package/app/pages/widgets/schema-search-bar/complex-view/select/select.vue

@@ -0,0 +1,41 @@
+<template>
+    <el-select v-model="dtoValue" v-bind="schema.option" class="select">
+        <el-option v-for="item in schema.option?.enumList" :key="item.value" :label="item.label"
+            :value="item.value"></el-option>
+    </el-select>
+</template>
+    
+<script setup>
+import { ref, onMounted } from 'vue'
+
+const { schemaKey, schema } = defineProps({
+    schemaKey: String,
+    schema: Object
+})
+
+const dtoValue = ref()
+const emit = defineEmits(['loaded'])
+
+const getValue = () => {
+    return dtoValue.value !== undefined ? {
+        [schemaKey]: dtoValue.value
+    } : {}
+}
+
+const reset = () => {
+    dtoValue.value = schema?.option?.default ?? schema.option?.enumList[0]?.value
+}
+
+defineExpose({
+    getValue,
+    reset
+})
+
+onMounted(() => {
+    reset();
+    emit('loaded')
+})
+</script>
+    
+<style lang='less' scoped></style>
+     

package/app/pages/widgets/schema-search-bar/schema-search-bar.vue

@@ -0,0 +1,109 @@
+<template>
+    <el-form v-if="schema && schema.properties" :inline="true" class="schema-search-bar">
+        <!--动态组件-->
+        <el-form-item v-for="(schemaItem, key) in schema.properties" :key="key" :label="schemaItem.label">
+            <component :ref="searchComList" :is="SearchItemConfig[schemaItem.option?.comType]?.component" :schemaKey="key"
+                :schema="schemaItem" @load="handleChildLoaded"></component>
+        </el-form-item>
+        <!--操作区域-->
+        <el-form-item>
+            <el-button type="primary" plain class="search-btn" @click="search">搜索</el-button>
+            <el-button plain class="reset-btn" @click="reset">重制</el-button>
+        </el-form-item>
+    </el-form>
+</template>
+    
+<script setup>
+import { ref, toRefs } from 'vue'
+import SearchItemConfig from './search-item-config.js'
+
+const props = defineProps({
+    /**
+     * schema配置，结构如下：
+     * {
+        type:'object',
+        properties:{
+            key:{
+                ...schema,//标准 scheam 配置
+                type:'',//字段类型
+                label:'',//字段中文名
+                //字段在 search-bar 中的配置
+                    option:{
+                        ...elComponentConfig,//标准 el-form 配置
+                        comType:'',//配置组件类型
+                        default:''//默认值
+                }
+            }
+        }
+        },
+     */
+    schema: Object
+})
+const { schema } = toRefs(props)
+const emit = defineEmits(['load', 'search', 'reset'])
+
+//页面上动态生成了多少个搜索框，我就把它们全部抓进一个数组里，后面我要批量控制它们。
+const searchComList = ref([])
+
+const getValue = () => {
+    let dtoObj = {}
+    searchComList.value.forEach(component => {
+        dtoObj = {
+            ...dtoObj,
+            ...component?.getValue()
+        }
+    })
+    return dtoObj;
+}
+
+let childComLoadedCount = 0
+const handleChildLoaded = () => {
+    childComLoadedCount++;
+    if (childComLoadedCount >= Object.keys(schema?.value?.properties).length) {
+        emit('load', getValue())
+    }
+}
+
+const search = () => {
+    emit('search', getValue())
+}
+const reset = () => {
+    searchComList.value.forEach(component => component?.reset())
+    emit('reset')
+}
+defineExpose({
+    reset,
+    getValue
+})
+</script>
+    
+<style lang='less'>
+.schema-search-bar {
+    min-width: 500px;
+
+    .input {
+        width: 180px;
+    }
+
+    .select {
+        width: 180px;
+    }
+
+    .dynamic-select {
+        width: 180px;
+    }
+
+    .date-range {
+        width: 150px;
+    }
+
+    .search-btn {
+        width: 100px;
+    }
+
+    .reset-btn {
+        width: 100px;
+    }
+}
+</style>
+    

package/app/pages/widgets/schema-search-bar/search-item-config.js

@@ -0,0 +1,23 @@
+import input from './complex-view/input/input.vue'
+import select from './complex-view/select/select.vue'
+import dynamicSelect from './complex-view/dynamic-select/dynamic-select.vue'
+import dateRange from './complex-view/date-range/date-range.vue'
+
+//业务扩展 search-bar 配置
+import BusinessSearchItemConfig from '$businessSearchItemConfig'
+
+const SearchItemConfig  = {
+    input:{
+        component:input
+    },
+    select:{
+        component:select
+    },
+    dynamicSelect:{
+        component:dynamicSelect
+    },
+    dateRange:{
+        component:dateRange
+    }
+}
+export default {...BusinessSearchItemConfig,...SearchItemConfig};

package/app/pages/widgets/schema-table/schema.table.vue

@@ -0,0 +1,191 @@
+<template>
+    <div class="schema-table">
+        <el-table class="table" v-if="schema && schema.properties" v-loading="loading" :data="tableData">
+            <template v-for="(schemaItem, key) in schema.properties">
+                <el-table-column v-if="schemaItem.option.visiable !== false" :key="key" :prop="key"
+                    :label="schemaItem.label" v-bind="schemaItem.option">
+                </el-table-column>
+            </template>
+            <el-table-column v-if="buttons?.length > 0" label="操作" fixed="right" :width="operationWidth">
+                <template #default="scope">
+                    <el-button v-for="item in buttons" link v-bind="item"
+                        @click="operationHanler({ btnConfig: item, rowData: scope.row })">
+                        {{ item.label }}
+                    </el-button>
+                </template>
+
+            </el-table-column>
+        </el-table>
+        <el-row justify="end" class="pagination">
+            <el-pagination :current-page="currentPage" :page-size="pageSize" :page-sizes="[10, 20, 50, 100, 200]"
+                layout="total, sizes, prev, pager, next, jumper" :total="total">
+            </el-pagination>
+        </el-row>
+    </div>
+</template>
+    
+<script setup>
+import { ref, toRefs, computed, watch, onMounted, nextTick } from 'vue'
+import $curl from '$elpisCommon/curl.js'
+const props = defineProps({
+    /**
+     * schema 配置，结构如下：
+     * {
+            type:'object',
+            properties:{
+                key:{
+                    ...schema,//标准 scheam 配置
+                    type:'',//字段类型
+                    label:'',//字段中文名
+                    option:{
+                        ...elTableColumnConfig,//标准 el-table-column 配置
+                        visible:true,//默认为true
+                    }//字段在 table中的相关配置
+                }
+            }
+        }
+     */
+    schema: Object,
+    // 表格数据源 api
+    api: String,
+    //api请求参数，请求 API 时携带
+    apiParams: Object,
+    /**
+     * buttons 操作按钮相关配置，结构如下：
+     * [
+     *  {
+            label:'',//按钮中文名
+            eventKey:'',//按钮事件名
+            eventOption:{},//按钮事件具体配置
+            ...elButtonConfig //标准 el-button配置
+        }
+     * ]
+     */
+    buttons: Array
+})
+const { schema, api, buttons, apiParams } = toRefs(props)
+const emit = defineEmits(['operate'])
+const operationWidth = computed(() => {
+    return buttons?.value?.length > 0 ? buttons.value.reduce((pre, cur) => {
+        return pre + cur.label.length * 18
+    }, 50) : 50
+})
+
+const loading = ref(false)
+const tableData = ref([])
+const currentPage = ref(1)
+const pageSize = ref(50)
+const total = ref(0)
+
+onMounted(() => {
+    initData()
+})
+// 监听schema和api变化，重新初始化数据
+watch([schema, api, apiParams], () => {
+    initData()
+}, { deep: true })
+
+// 监听分页变化，自动加载数据（替代原冗余的handle方法）
+watch([currentPage, pageSize], async () => {
+    await fetchTableData()
+}, { immediate: false })
+
+const initData = () => {
+    currentPage.value = 1
+    pageSize.value = 50
+    nextTick(async () => {
+        await loadTableData()
+    })
+}
+
+let timerId = null;
+const loadTableData = async () => {
+    clearTimeout(timerId)
+    timerId = setTimeout(async () => {
+        await fetchTableData();
+        timerId = null
+    }, 100)
+}
+
+const fetchTableData = async () => {
+    if (!api.value) { return; }
+
+    showLoading()
+
+    const res = await $curl({
+        method: 'get',
+        url: `${api.value}/list`,
+        query: {
+            ...apiParams.value,
+            page: currentPage.value,
+            size: pageSize.value
+        }
+    })
+    hideLoading()
+
+    if (!res || !res.success || !Array.isArray(res.data)) {
+        tableData.value = []
+        total.value = 0;
+        return;
+    }
+
+    tableData.value = buildTableData(res.data);
+    total.value = res.metadata.total
+}
+/**
+ * 对后端返回的数据进行渲染前的预处理
+ * @param {object} listData 
+ */
+const buildTableData = (listData) => {
+    if (!schema.value?.properties) {
+        return listData;
+    }
+
+    return listData.map(rowData => {
+        for (const dKey in rowData) {
+            const schemaItem = schema.value.properties[dKey]
+            //处理toFixed
+            if (schemaItem?.option?.toFixed) {
+                rowData[dKey] = rowData[dKey].toFixed && rowData[dKey].toFixed(schemaItem.option.toFixed)
+            }
+        }
+        return rowData;
+    })
+}
+
+const showLoading = () => {
+    loading.value = true
+}
+const hideLoading = () => {
+    loading.value = false
+}
+
+const operationHanler = ({ btnConfig, rowData }) => {
+    emit('operate', { btnConfig, rowData })
+}
+defineExpose({
+    initData,
+    loadTableData,
+    showLoading,
+    hideLoading
+})
+</script>
+    
+<style lang='less' scoped>
+.schema-table {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    overflow: auto;
+
+    .table {
+        flex: 1;
+    }
+
+    .pagination {
+        margin: 10px 0;
+        text-align: right;
+    }
+}
+</style>
+    

package/app/pages/widgets/sider-container/sider-container.vue

@@ -0,0 +1,34 @@
+<template>
+    <el-container class="sider-container">
+        <el-aside width="200px" class="aside">
+            <slot name="menu-content"></slot>
+        </el-aside>
+        <el-main class="main">
+            <slot name="main-content"></slot>
+        </el-main>
+    </el-container>
+</template>
+    
+<script setup>
+// import { ref } from 'vue'
+
+</script>
+    
+<style lang='less' scoped>
+.sider-container {
+    height: 100%;
+
+    .aside {
+        border-right: 1px solid #E8E8E8;
+    }
+
+    .main {
+        overflow: scroll;
+    }
+}
+
+:deep(.el-menu) {
+    border-right: 0;
+}
+</style>
+    

package/app/public/static/normalize.css

@@ -0,0 +1,240 @@
+/*! normalize.css v3.0.2 | MIT License | git.io/normalize */
+
+/**
+ * 1. Set default font family to sans-serif.
+ * 2. Prevent iOS text size adjust after orientation change, without disabling
+ *    user zoom.
+ */    
+ html,body,span,div,p,a,table,tbody,td,h1,h2,h3,img,form,font,strong,b,i,dl,dt,dd,ol,ul,li,dl,dd,dt,iframe,label,blockquote,input,button
+ {
+     padding: 0;
+     margin: 0;
+     list-style: none;
+ }
+ 
+ html {
+     font-family: "Open Sans","Helvetica Neue","Microsoft Yahei",sans-serif;/* 1 */
+     -ms-text-size-adjust: 100%; /* 2 */
+     -webkit-text-size-adjust: 100%; /* 2 */
+ }
+ 
+ /**
+  * Remove default margin.
+  */
+ 
+ body {
+     margin: 0;
+ }
+ 
+ /* Links
+    ========================================================================== */
+ 
+ /**
+  * Remove the gray background color from active links in IE 10.
+  */
+ 
+ a {
+     background-color: transparent;
+     text-decoration: none;
+ }
+ 
+ /**
+  * Improve readability when focused and also mouse hovered in all browsers.
+  */
+ 
+ a:active,
+ a:hover {
+     outline: 0;
+ }
+ 
+ /* Text-level semantics
+    ========================================================================== */
+ 
+ /**
+  * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
+  */
+ 
+ b,
+ strong {
+     font-weight: bold;
+ }
+ 
+ /* Embedded content
+    ========================================================================== */
+ 
+ /**
+  * Remove border when inside `a` element in IE 8/9/10.
+  */
+ 
+ img {
+     border: 0;
+ }
+ 
+ 
+ /* Grouping content
+    ========================================================================== */
+ 
+ /**
+  * Address margin not present in IE 8/9 and Safari.
+  */
+ 
+ figure {
+     margin: 1em 40px;
+ }
+ 
+ 
+ /* Forms
+    ========================================================================== */
+ 
+ /**
+  * Known limitation: by default, Chrome and Safari on OS X allow very limited
+  * styling of `select`, unless a `border` property is set.
+  */
+ 
+ /**
+  * 1. Correct color not being inherited.
+ a *    Known issue: affects color of disabled elements.
+  * 2. Correct font properties not being inherited.
+  * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
+  */
+ 
+ button,
+ input,
+ optgroup,
+ select,
+ textarea {
+     color: inherit; /* 1 */
+     font: inherit; /* 2 */
+     margin: 0; /* 3 */
+ }
+ 
+ /**
+  * Address `overflow` set to `hidden` in IE 8/9/10/11.
+  */
+ 
+ button {
+     overflow: visible;
+ }
+ 
+ /**
+  * Address inconsistent `text-transform` inheritance for `button` and `select`.
+  * All other form control elements do not inherit `text-transform` values.
+  * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
+  * Correct `select` style inheritance in Firefox.
+  */
+ 
+ button,
+ select {
+     text-transform: none;
+ }
+ 
+ /**
+  * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
+  *    and `video` controls.
+  * 2. Correct inability to style clickable `input` types in iOS.
+  * 3. Improve usability and consistency of cursor style between image-type
+  *    `input` and others.
+  */
+ 
+ button,
+ html input[type="button"], /* 1 */
+ input[type="reset"],
+ input[type="submit"] {
+     -webkit-appearance: button; /* 2 */
+     cursor: pointer; /* 3 */
+ }
+ 
+ /**
+  * Re-set default cursor for disabled elements.
+  */
+ 
+ button[disabled],
+ html input[disabled] {
+     cursor: default;
+ }
+ 
+ /**
+  * Remove inner padding and border in Firefox 4+.
+  */
+ 
+ button::-moz-focus-inner,
+ input::-moz-focus-inner {
+     border: 0;
+     padding: 0;
+ }
+ 
+ /**
+  * Address Firefox 4+ setting `line-height` on `input` using `!important` in
+  * the UA stylesheet.
+  */
+ 
+ input {
+     line-height: normal;
+ }
+ 
+ /**
+  * It's recommended that you don't attempt to style these elements.
+  * Firefox's implementation doesn't respect box-sizing, padding, or width.
+  *
+  * 1. Address box sizing set to `content-box` in IE 8/9/10.
+  * 2. Remove excess padding in IE 8/9/10.
+  */
+ 
+ input[type="checkbox"],
+ input[type="radio"] {
+     box-sizing: border-box; /* 1 */
+     padding: 0; /* 2 */
+ }
+ 
+ /**
+  * Fix the cursor style for Chrome's increment/decrement buttons. For certain
+  * `font-size` values of the `input`, it causes the cursor style of the
+  * decrement button to change from `default` to `text`.
+  */
+ 
+ input[type="number"]::-webkit-inner-spin-button,
+ input[type="number"]::-webkit-outer-spin-button {
+     height: auto;
+ }
+ 
+ /**
+  * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
+  * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
+  *    (include `-moz` to future-proof).
+  */
+ 
+ input[type="search"] {
+     -webkit-appearance: textfield; /* 1 */
+     -moz-box-sizing: content-box;
+     -webkit-box-sizing: content-box; /* 2 */
+     box-sizing: content-box;
+ }
+ 
+ /**
+  * Remove inner padding and search cancel button in Safari and Chrome on OS X.
+  * Safari (but not Chrome) clips the cancel button when the search input has
+  * padding (and `textfield` appearance).
+  */
+ 
+ input[type="search"]::-webkit-search-cancel-button,
+ input[type="search"]::-webkit-search-decoration {
+     -webkit-appearance: none;
+ }
+ 
+ /* Tables
+    ========================================================================== */
+ 
+ /**
+  * Remove most spacing between table cells.
+  */
+ 
+ table {
+     border-collapse: collapse;
+     border-spacing: 0;
+ }
+ 
+ td,
+ th {
+     padding: 0;
+ }
+ 

package/app/router/business.js

@@ -0,0 +1,9 @@
+module.exports = (app,router) => {
+    const {business:businessController} = app.controller
+    router.get('/api/proj/product',businessController.get.bind(businessController))
+    router.put('/api/proj/product',businessController.update.bind(businessController))
+    router.post('/api/proj/product',businessController.create.bind(businessController))
+    router.delete('/api/proj/product',businessController.remove.bind(businessController))
+    router.get('/api/proj/product/list',businessController.getList.bind(businessController))
+    router.get('/api/proj/product_enum/list',businessController.getProductEnumList.bind(businessController))
+} 

package/app/router/project.js

@@ -0,0 +1,6 @@
+module.exports = (app, router) => {
+    const { project: projectController } = app.controller;
+    router.get('/api/project',projectController.get.bind(projectController))
+    router.get('/api/project/list',projectController.getList.bind(projectController))
+    router.get('/api/project/model_list',projectController.getModelList.bind(projectController))
+}