Browse Source

中期发版。测试流程

v8_master
超级管理员 2 years ago
parent
commit
5e1cb059b9
  1. 3
      src/components/DesignForm/assembly/isSearch.ts
  2. 141
      src/components/DesignForm/dragControlApp.vue
  3. 2
      src/components/DesignForm/formControlAttr.vue
  4. 2197
      src/components/DesignForm/formControlProperties.vue
  5. 33
      src/components/DesignForm/rule/numberRules.ts
  6. 104
      src/components/DesignForm/validateApp.ts
  7. 1733
      src/styles/workflowcss/workflow.css
  8. 1
      src/styles/workflowcss/workflow.min.css
  9. 3
      src/types/components.d.ts
  10. 324
      src/views/dashboard/index.vue
  11. 146
      src/views/dashboard/index_1.vue
  12. 250
      src/views/dashboard/index_old.vue
  13. 1
      src/views/sysworkflow/lowcodepage/appFormList.vue
  14. 1
      src/views/sysworkflow/lowcodepage/appPage/appMenus.vue
  15. 24
      src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue
  16. 4
      src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue

3
src/components/DesignForm/assembly/isSearch.ts

@ -0,0 +1,3 @@
export const formControlProject = (val:any) =>{
return []
}

141
src/components/DesignForm/dragControlApp.vue

@ -0,0 +1,141 @@
<!--
@ 作者: 秦东
@ 时间: 2024-05-09 15:12:45
@ 备注: 自定义表单组件页面(App专用)
-->
<script lang='ts' setup>
import controlListData from '@/components/DesignForm/assembly'
import Draggable from 'vuedraggable-es'
import '@/assets/iconfont/iconfont.css'
//
import FormVersion from '@/components/DesignForm/formVersion.vue';
const props = withDefaults(
defineProps<{
tableKey?: number | string,
signCode?: number | string,
}>(),
{}
)
const designType = inject('formDesignType') as string // ( app.provide())
//
const searchField = [
'input',
'radio',
'checkbox',
'select',
'datePicker',
'timePicker',
'inputNumber',
'cascader',
'component',
'button'
]
/**
@ 作者: 秦东
@ 时间: 2024-05-09 10:58:56
@ 功能: 表单组件数据
*/
const controlList = computed(() => {
if (designType === 'search') {
//
const temp: any = []
controlListData.forEach((item: any) => {
if (item.children) {
const filter = item.children.filter((ch: any) => {
return searchField.includes(ch.type)
})
if (filter && filter.length) {
temp.push({ title: item.title, children: filter })
}
}
})
return temp
} else {
return controlListData
}
})
const tableVersion = ref() //
const emits = defineEmits<{
(e: 'versionUpdateForm', value: string): void
}>()
/**
@ 作者: 秦东
@ 时间: 2024-05-09 11:36:59
@ 功能: 启用和禁用版本
*/
const enableOrDisable = (val?:any) =>{
console.log("启用和禁用版本",val)
emits('versionUpdateForm', val)
}
/**
@ 作者: 秦东
@ 时间: 2024-05-09 11:40:15
@ 功能: 打开版本选择页面
*/
const useVersionClick = () => {
tableVersion.value.open()
}
const activities = [
{
content: 'Event start',
timestamp: '2018-04-15',
},
{
content: 'Approved',
timestamp: '2018-04-13',
},
{
content: 'Success',
timestamp: '2018-04-11',
},
]
</script>
<template>
<div class="components-list">
<div v-for="(list, index) in controlList" :key="index">
<div class="title">
{{ list.title }}
<div
class="template"
@click="useVersionClick"
>
版本
</div>
</div>
<draggable
v-model="list.children"
tag="ul"
:group="{ name: 'form', pull: 'clone', put: false }"
ghost-class="ghost"
:sort="false"
:clone="clone"
item-key="key123"
>
<template #item="{ element }">
<li class="fontIcon" :class="[element.type]">
<i v-if="element.iconFont==''" :class="`icon-${element.icon}`"></i>
<i v-if="element.iconFont!=''" :class="`fa ${element.iconFont} `"></i>
<span :title="element.label">{{ element.label }}</span>
</li>
</template>
</draggable>
</div>
</div>
<FormVersion ref="tableVersion" :table-key="props.tableKey" :sign-code="props.signCode" @enableOrDisable="enableOrDisable" />
</template>
<style lang='scss' scoped>
.tab_pane_body{
text-align: center;
}
.fontIcon{
i{
padding: 4px 0px 0 0px;
}
}
</style>

2
src/components/DesignForm/formControlAttr.vue

@ -1423,7 +1423,7 @@
defineExpose({ getFormFieldBySource }) defineExpose({ getFormFieldBySource })
// //
const isNotWrite = (val:any) =>{ const isNotWrite = (val:any) =>{
// console.log("--->",val) console.log("判断输入框是否可写--->",val,props.customerformid)
if(val.key === "name" && props.customerformid != ""){ if(val.key === "name" && props.customerformid != ""){
return true return true
} }

2197
src/components/DesignForm/formControlProperties.vue

File diff suppressed because it is too large

33
src/components/DesignForm/rule/numberRules.ts

@ -0,0 +1,33 @@
/**
@ 作者: 秦东
@ 时间: 2024-05-10 09:38:51
@ 功能: 数字规则列表
*/
interface NumberValidateTypes {
type: string
label: string
msg: string
}
const NumberValidateConfig: NumberValidateTypes[] = [
{
type: 'time',
label: '时间',
msg:'请选择时间格式'
},
{
type: 'text',
label: '自定义字符',
msg:'请输入自定义字符'
},
{
type: 'serialnumber',
label: '流水序号',
msg:'流水号起始值'
},
{
type: 'randomnumber',
label: '随机数',
msg:'请输入随机数位数'
}
]
export default NumberValidateConfig

104
src/components/DesignForm/validateApp.ts

@ -0,0 +1,104 @@
// 快速添加 内置校验规则
interface ValidateTypes {
type: string
label: string
regExp?: RegExp
message?: string
}
const validateConfig: ValidateTypes[] = [
{
type: 'required',
label: '必填',
regExp: /^\s*$/,
message: '必填项'
},
{
type: 'mobile',
label: '手机号码',
regExp: /^0{0,1}(13[0-9]|15[7-9]|153|156|18[7-9])[0-9]{8}$/,
message: '请输入手机号码'
},
{
type: 'tel',
label: '固话',
regExp: /^0\d{2,3}-\d{7,8}$/,
message: '请输入固定电话号码'
},
{
type: 'phone',
label: '固话或手机',
regExp: /^((0\d{2,3}(-?)\d{7,8})|(1[3456789]\d{9}))$/,
message: '请输入固定电话号码或手机号'
},
{
type: 'email',
label: '邮箱',
regExp: /^[a-z0-9A-Z._%-]+@([a-z0-9A-Z-]+\.)+[a-zA-Z]{2,4}$/,
message: '请输入邮箱地址'
},
{
type: 'int',
label: '正整数',
regExp: /^[0-9]*[1-9][0-9]*$/,
message: '请输入正整数'
},
{
type: 'number',
label: '数字',
regExp: /^\d+(\.\d+)?$/,
message: '请输入数字'
},
{
type: 'money',
label: '金额',
regExp: /^[0-9]+\.?[0-9]{0,2}$/,
message: '请输入正确的金额,最多两位小数'
},
{
type: 'card',
label: '身份证',
regExp:
/(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/,
message: '请输入身份证号'
},
{
type: 'cn',
label: '中文',
regExp: /[\u4e00-\u9fa5]+/,
message: '请输入中文'
},
{
type: 'numberLetter',
label: '数字字母',
regExp: /[0-9a-zA-Z]$/,
message: '请输入数字或字母'
},
{
type: 'url',
label: '网址',
regExp: /^https?:\/\/((.)+(\.)?)*(:\d+)?(\/((\.)?(\?)?=?&?.(\?)?)*)*$/,
message: '请输入网址'
},
{
type: 'longitude',
label: '经度',
regExp: /^[-+]?(0?\d{1,2}\.\d{1,10}|1[0-7]?\d\.\d{1,10}|180\.0{1,10})$/,
message: '请输入正确的经度'
},
{
type: 'latitude',
label: '纬度',
regExp: /^[-+]?([0-8]?\d{1}\.\d{1,10}|90\.0{1,10})$/,
message: '请输入正确的纬度'
},
{
type: 'rules',
label: '自定义正则',
message:""
},
{
type: 'methods',
label: '自定义方法'
}
]
export default validateConfig

1733
src/styles/workflowcss/workflow.css

File diff suppressed because it is too large

1
src/styles/workflowcss/workflow.min.css

File diff suppressed because one or more lines are too long

3
src/types/components.d.ts

@ -22,6 +22,7 @@ declare module '@vue/runtime-core' {
DesignLayoutPage: typeof import('./../components/DesignForm/designLayout/designLayoutPage.vue')['default'] DesignLayoutPage: typeof import('./../components/DesignForm/designLayout/designLayoutPage.vue')['default']
DiyIconfont: typeof import('./../components/DesignForm/public/expand/diy-iconfont.vue')['default'] DiyIconfont: typeof import('./../components/DesignForm/public/expand/diy-iconfont.vue')['default']
DragControl: typeof import('./../components/DesignForm/dragControl.vue')['default'] DragControl: typeof import('./../components/DesignForm/dragControl.vue')['default']
DragControlApp: typeof import('./../components/DesignForm/dragControlApp.vue')['default']
DragControlNew: typeof import('./../components/DesignForm/dragControlNew.vue')['default'] DragControlNew: typeof import('./../components/DesignForm/dragControlNew.vue')['default']
ElAffix: typeof import('element-plus/es')['ElAffix'] ElAffix: typeof import('element-plus/es')['ElAffix']
ElAside: typeof import('element-plus/es')['ElAside'] ElAside: typeof import('element-plus/es')['ElAside']
@ -58,6 +59,7 @@ declare module '@vue/runtime-core' {
ElImageViewer: typeof import('element-plus/es')['ElImageViewer'] ElImageViewer: typeof import('element-plus/es')['ElImageViewer']
ElInput: typeof import('element-plus/es')['ElInput'] ElInput: typeof import('element-plus/es')['ElInput']
ElInputNumber: typeof import('element-plus/es')['ElInputNumber'] ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
ElLink: typeof import('element-plus/es')['ElLink']
ElMain: typeof import('element-plus/es')['ElMain'] ElMain: typeof import('element-plus/es')['ElMain']
ElMenu: typeof import('element-plus/es')['ElMenu'] ElMenu: typeof import('element-plus/es')['ElMenu']
ElMenuItem: typeof import('element-plus/es')['ElMenuItem'] ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
@ -102,6 +104,7 @@ declare module '@vue/runtime-core' {
FormControlAttr: typeof import('./../components/DesignForm/formControlAttr.vue')['default'] FormControlAttr: typeof import('./../components/DesignForm/formControlAttr.vue')['default']
FormControlAttr_2024024: typeof import('./../components/DesignForm/formControlAttr_2024024.vue')['default'] FormControlAttr_2024024: typeof import('./../components/DesignForm/formControlAttr_2024024.vue')['default']
FormControlAttres: typeof import('./../components/DesignForm/formControlAttres.vue')['default'] FormControlAttres: typeof import('./../components/DesignForm/formControlAttres.vue')['default']
FormControlProperties: typeof import('./../components/DesignForm/formControlProperties.vue')['default']
FormGroup: typeof import('./../components/DesignForm/public/form/formGroup.vue')['default'] FormGroup: typeof import('./../components/DesignForm/public/form/formGroup.vue')['default']
FormGroup1: typeof import('./../components/DesignForm/public/form/formGroup1.vue')['default'] FormGroup1: typeof import('./../components/DesignForm/public/form/formGroup1.vue')['default']
FormItem: typeof import('./../components/DesignForm/public/form/formItem.vue')['default'] FormItem: typeof import('./../components/DesignForm/public/form/formItem.vue')['default']

324
src/views/dashboard/index.vue

@ -1,146 +1,250 @@
<!-- <script lang="ts">
@ 作者: 秦东 export default { name: "Dashboard" };
@ 时间: 2023-11-06 13:39:13 </script>
@ 备注: 首页
-->
<script lang='ts' setup>
import * as echarts from 'echarts'; //
<script setup lang="ts">
import { useUserStore } from "@/store/modules/user"; import { useUserStore } from "@/store/modules/user";
import { useTransition, TransitionPresets } from "@vueuse/core";
import GithubCorner from "@/components/GithubCorner/index.vue";
import { orgInfo } from '@/api/displayboardapi/types' import SvgIcon from "@/components/SvgIcon/index.vue";
import { getOrgChiled,getCompanyDeparment,targetListForDepartment } from '@/api/displayboardapi/indexapi' import BarChart from "./components/BarChart.vue";
import PieChart from "./components/PieChart.vue";
import UserInfo from "@/views/dashboard/components/userinfo.vue"; import RadarChart from "./components/RadarChart.vue";
import SanLianpIng from "@/views/dashboard/components/sanlianping.vue";
import EducationChart from "@/views/dashboard/components/education.vue";
import AllOrgYear from "@/views/dashboard/components/allorgyear.vue";
import OrgUserAge from "@/views/dashboard/components/orguserage.vue";
import OrgEducation from "@/views/dashboard/components/orgeducation.vue";
import Application from "@/views/dashboard/components/application.vue";
import HostNews from "@/views/dashboard/components/hostnews.vue";
const userStore = useUserStore(); const userStore = useUserStore();
const orgListCont = ref<orgInfo[]>([])
const educationOrgId = ref<number>(309)
const masterBody = ref<any>(null)
const drawerWidht = ref<any>()
/**
* 获取行政组织
*/
function getOrgList(){
getOrgChiled({id:313})
.then(( {data} )=>{
console.log("获取行政组织-2-->",data)
orgListCont.value = data.list
educationOrgId.value = data.current
})
}
const orgAllYears = ref<any>() //
const oenOrg = ref<any>() // const date: Date = new Date();
const greetings = computed(() => {
// if (date.getHours() >= 6 && date.getHours() < 8) {
onMounted(() => { return "晨起披衣出草堂,轩窗已自喜微凉🌅!";
} else if (date.getHours() >= 8 && date.getHours() < 12) {
drawerWidht.value = masterBody.value?.clientWidth return "上午好🌞!";
getOrgList(); } else if (date.getHours() >= 12 && date.getHours() < 18) {
// console.log("----100---->",drawerWidht.value) return "下午好☕!";
}) } else if (date.getHours() >= 18 && date.getHours() < 24) {
return "晚上好🌃!";
} else if (date.getHours() >= 0 && date.getHours() < 6) {
return "偷偷向银河要了一把碎星,只等你闭上眼睛撒入你的梦中,晚安🌛!";
}
});
const duration = 5000;
//
const amount = ref(0);
const amountOutput = useTransition(amount, {
duration: duration,
transition: TransitionPresets.easeOutExpo,
});
amount.value = 2000;
// 访
const visitCount = ref(0);
const visitCountOutput = useTransition(visitCount, {
duration: duration,
transition: TransitionPresets.easeOutExpo,
});
visitCount.value = 2000;
//
const messageCount = ref(0);
const messageCountOutput = useTransition(messageCount, {
duration: duration,
transition: TransitionPresets.easeOutExpo,
});
messageCount.value = 2000;
//
const orderCount = ref(0);
const orderCountOutput = useTransition(orderCount, {
duration: duration,
transition: TransitionPresets.easeOutExpo,
});
orderCount.value = 2000;
</script> </script>
<template> <template>
<div ref="masterBody" class="app_container"> <div class="dashboard-container">
<el-row :gutter="10"> <!-- github角标 -->
<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
<AllOrgYear :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
</el-col> <!-- 用户信息 -->
<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor"> <el-row class="mb-8">
<UserInfo :user-store="userStore" /> <el-card class="w-full">
</el-col> <div class="flex justify-between flex-wrap">
</el-row> <div class="flex items-center">
<el-row :gutter="10" class="cart_top_juLi"> <img
<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback"> class="user-avatar"
:src="userStore.avatar + '?imageView2/1/w/80/h/80'"
/>
<span class="ml-[10px] text-[16px]">
{{ userStore.nickname }}
</span>
</div>
<el-row :gutter="10"> <div class="leading-[40px]">
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback"> {{ greetings }}
</div>
<OrgUserAge :org-list-cont="orgListCont" :education-org-id="educationOrgId" /> <div v-if="false" class="space-x-2 flex items-center" >
<el-link
target="_blank"
type="danger"
href="https://www.cnblogs.com/haoxianrui/p/16090029.html"
>官方0到1教程</el-link
>
<el-divider direction="vertical" />
<el-link
target="_blank"
type="success"
href="https://gitee.com/youlaiorg/vue3-element-admin"
>Gitee源码</el-link
>
<el-divider direction="vertical" />
<el-link
target="_blank"
type="primary"
href="https://github.com/youlaitech/vue3-element-admin"
>GitHub源码
</el-link>
</div>
</div>
</el-card>
</el-row>
<!-- 数据卡片 -->
<el-row :gutter="40" class="mb-4">
<el-col :xs="24" :sm="12" :lg="6" class="mb-4">
<div class="data-box">
<div
class="text-[#40c9c6] hover:!text-white hover:bg-[#40c9c6] p-3 rounded"
>
<svg-icon icon-class="uv" size="3em" />
</div>
<div class="flex flex-col space-y-3">
<div class="text-[var(--el-text-color-secondary)]">访问数</div>
<div class="text-lg">
{{ Math.round(visitCountOutput) }}
</div>
</div>
</div>
</el-col> </el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback">
<OrgEducation :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
<!--消息数-->
<el-col :xs="24" :sm="12" :lg="6" class="mb-4">
<div class="data-box">
<div
class="text-[#36a3f7] hover:!text-white hover:bg-[#36a3f7] p-3 rounded"
>
<svg-icon icon-class="message" size="3em" />
</div>
<div class="flex flex-col space-y-3">
<div class="text-[var(--el-text-color-secondary)]">消息数</div>
<div class="text-lg">
{{ Math.round(messageCountOutput) }}
</div>
</div>
</div>
</el-col> </el-col>
</el-row>
<el-col :xs="24" :sm="12" :lg="6" class="mb-4">
<div class="data-box">
<div
class="text-[#f4516c] hover:!text-white hover:bg-[#f4516c] p-3 rounded"
>
<svg-icon icon-class="money" size="3em" />
</div>
<div class="flex flex-col space-y-3">
<div class="text-[var(--el-text-color-secondary)]">收入金额</div>
<div class="text-lg">
{{ Math.round(amountOutput) }}
</div>
</div>
</div>
</el-col> </el-col>
<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor"> <el-col :xs="24" :sm="12" :lg="6" class="mb-2">
<div class="data-box">
<HostNews v-model:drawer-widht="drawerWidht" /> <div
class="text-[#34bfa3] hover:!text-white hover:bg-[#34bfa3] p-3 rounded"
>
<svg-icon icon-class="shopping" size="3em" />
</div>
<div class="flex flex-col space-y-3">
<div class="text-[var(--el-text-color-secondary)]">订单数</div>
<div class="text-lg">
{{ Math.round(orderCountOutput) }}
</div>
</div>
</div>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="10" class="cart_top_juLi">
<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
<SanLianpIng /> <!-- Echarts 图表 -->
<el-row :gutter="40">
<el-col :sm="24" :lg="8" class="mb-4">
<BarChart
id="barChart"
height="400px"
width="100%"
class="bg-[var(--el-bg-color-overlay)]"
/>
</el-col>
<el-col :xs="24" :sm="12" :lg="8" class="mb-4">
<PieChart
id="pieChart"
height="400px"
width="100%"
class="bg-[var(--el-bg-color-overlay)]"
/>
</el-col> </el-col>
<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
<Application :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
<el-col :xs="24" :sm="12" :lg="8" class="mb-4">
<RadarChart
id="radarChart"
height="400px"
width="100%"
class="bg-[var(--el-bg-color-overlay)]"
/>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
</template> </template>
<style lang='scss' scoped>
.app_container{ <style lang="scss" scoped>
padding: 10px 20px 0px 20px; .dashboard-container {
height: calc(100vh - 90px); position: relative;
overflow: hidden; padding: 24px;
overflow-y: auto;
} .user-avatar {
.readback{ width: 40px;
// background-color:#FF0000; height: 40px;
.allOrgAxisCares{ border-radius: 50%;
display: block;
width:100%;
height:280px;
overflow:auto;
} }
.github-corner {
position: absolute;
top: 0;
right: 0;
z-index: 99;
border: 0;
} }
.orgAllMothsTitle{
width:100%; .data-box {
display: flex; display: flex;
align-items: center;
justify-content: space-between; justify-content: space-between;
padding: 20px;
font-weight: bold;
color: var(--el-text-color-regular);
background: var(--el-bg-color-overlay);
border-color: var(--el-border-color);
box-shadow: var(--el-box-shadow-dark);
} }
.greenColor{
// background-color:#FFAC52;
// padding:0 10px 0 10px; .svg-icon {
fill: currentcolor !important;
} }
.span_icon_left{
margin-right:10px;
}
.cart_top_juLi{
// margin-top:10px;
}
.titleInfo{
font-size: 20px;
font-weight: bold;
} }
</style> </style>

146
src/views/dashboard/index_1.vue

@ -0,0 +1,146 @@
<!--
@ 作者: 秦东
@ 时间: 2023-11-06 13:39:13
@ 备注: 首页
-->
<script lang='ts' setup>
import * as echarts from 'echarts'; //
import { useUserStore } from "@/store/modules/user";
import { orgInfo } from '@/api/displayboardapi/types'
import { getOrgChiled,getCompanyDeparment,targetListForDepartment } from '@/api/displayboardapi/indexapi'
import UserInfo from "@/views/dashboard/components/userinfo.vue";
import SanLianpIng from "@/views/dashboard/components/sanlianping.vue";
import EducationChart from "@/views/dashboard/components/education.vue";
import AllOrgYear from "@/views/dashboard/components/allorgyear.vue";
import OrgUserAge from "@/views/dashboard/components/orguserage.vue";
import OrgEducation from "@/views/dashboard/components/orgeducation.vue";
import Application from "@/views/dashboard/components/application.vue";
import HostNews from "@/views/dashboard/components/hostnews.vue";
const userStore = useUserStore();
const orgListCont = ref<orgInfo[]>([])
const educationOrgId = ref<number>(309)
const masterBody = ref<any>(null)
const drawerWidht = ref<any>()
/**
* 获取行政组织
*/
function getOrgList(){
getOrgChiled({id:313})
.then(( {data} )=>{
console.log("获取行政组织-2-->",data)
orgListCont.value = data.list
educationOrgId.value = data.current
})
}
const orgAllYears = ref<any>() //
const oenOrg = ref<any>() //
//
onMounted(() => {
drawerWidht.value = masterBody.value?.clientWidth
getOrgList();
// console.log("----100---->",drawerWidht.value)
})
</script>
<template>
<div ref="masterBody" class="app_container">
<el-row :gutter="10">
<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
<AllOrgYear :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
</el-col>
<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
<UserInfo :user-store="userStore" />
</el-col>
</el-row>
<el-row :gutter="10" class="cart_top_juLi">
<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
<el-row :gutter="10">
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback">
<OrgUserAge :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="12" class="readback">
<OrgEducation :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
</el-col>
</el-row>
</el-col>
<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
<HostNews v-model:drawer-widht="drawerWidht" />
</el-col>
</el-row>
<el-row :gutter="10" class="cart_top_juLi">
<el-col :xs="24" :sm="16" :md="16" :lg="18" :xl="19" class="readback">
<SanLianpIng />
</el-col>
<el-col :xs="24" :sm="8" :md="8" :lg="6" :xl="5" class="greenColor">
<Application :org-list-cont="orgListCont" :education-org-id="educationOrgId" />
</el-col>
</el-row>
</div>
</template>
<style lang='scss' scoped>
.app_container{
padding: 10px 20px 0px 20px;
height: calc(100vh - 90px);
overflow: hidden;
overflow-y: auto;
}
.readback{
// background-color:#FF0000;
.allOrgAxisCares{
display: block;
width:100%;
height:280px;
overflow:auto;
}
}
.orgAllMothsTitle{
width:100%;
display: flex;
align-items: center;
justify-content:space-between;
}
.greenColor{
// background-color:#FFAC52;
// padding:0 10px 0 10px;
}
.span_icon_left{
margin-right:10px;
}
.cart_top_juLi{
// margin-top:10px;
}
.titleInfo{
font-size: 20px;
font-weight: bold;
}
</style>

250
src/views/dashboard/index_old.vue

@ -1,250 +0,0 @@
<script lang="ts">
export default { name: "Dashboard" };
</script>
<script setup lang="ts">
import { useUserStore } from "@/store/modules/user";
import { useTransition, TransitionPresets } from "@vueuse/core";
import GithubCorner from "@/components/GithubCorner/index.vue";
import SvgIcon from "@/components/SvgIcon/index.vue";
import BarChart from "./components/BarChart.vue";
import PieChart from "./components/PieChart.vue";
import RadarChart from "./components/RadarChart.vue";
const userStore = useUserStore();
const date: Date = new Date();
const greetings = computed(() => {
if (date.getHours() >= 6 && date.getHours() < 8) {
return "晨起披衣出草堂,轩窗已自喜微凉🌅!";
} else if (date.getHours() >= 8 && date.getHours() < 12) {
return "上午好🌞!";
} else if (date.getHours() >= 12 && date.getHours() < 18) {
return "下午好☕!";
} else if (date.getHours() >= 18 && date.getHours() < 24) {
return "晚上好🌃!";
} else if (date.getHours() >= 0 && date.getHours() < 6) {
return "偷偷向银河要了一把碎星,只等你闭上眼睛撒入你的梦中,晚安🌛!";
}
});
const duration = 5000;
//
const amount = ref(0);
const amountOutput = useTransition(amount, {
duration: duration,
transition: TransitionPresets.easeOutExpo,
});
amount.value = 2000;
// 访
const visitCount = ref(0);
const visitCountOutput = useTransition(visitCount, {
duration: duration,
transition: TransitionPresets.easeOutExpo,
});
visitCount.value = 2000;
//
const messageCount = ref(0);
const messageCountOutput = useTransition(messageCount, {
duration: duration,
transition: TransitionPresets.easeOutExpo,
});
messageCount.value = 2000;
//
const orderCount = ref(0);
const orderCountOutput = useTransition(orderCount, {
duration: duration,
transition: TransitionPresets.easeOutExpo,
});
orderCount.value = 2000;
</script>
<template>
<div class="dashboard-container">
<!-- github角标 -->
<!-- 用户信息 -->
<el-row class="mb-8">
<el-card class="w-full">
<div class="flex justify-between flex-wrap">
<div class="flex items-center">
<img
class="user-avatar"
:src="userStore.avatar + '?imageView2/1/w/80/h/80'"
/>
<span class="ml-[10px] text-[16px]">
{{ userStore.nickname }}
</span>
</div>
<div class="leading-[40px]">
{{ greetings }}
</div>
<div v-if="false" class="space-x-2 flex items-center" >
<el-link
target="_blank"
type="danger"
href="https://www.cnblogs.com/haoxianrui/p/16090029.html"
>官方0到1教程</el-link
>
<el-divider direction="vertical" />
<el-link
target="_blank"
type="success"
href="https://gitee.com/youlaiorg/vue3-element-admin"
>Gitee源码</el-link
>
<el-divider direction="vertical" />
<el-link
target="_blank"
type="primary"
href="https://github.com/youlaitech/vue3-element-admin"
>GitHub源码
</el-link>
</div>
</div>
</el-card>
</el-row>
<!-- 数据卡片 -->
<el-row :gutter="40" class="mb-4">
<el-col :xs="24" :sm="12" :lg="6" class="mb-4">
<div class="data-box">
<div
class="text-[#40c9c6] hover:!text-white hover:bg-[#40c9c6] p-3 rounded"
>
<svg-icon icon-class="uv" size="3em" />
</div>
<div class="flex flex-col space-y-3">
<div class="text-[var(--el-text-color-secondary)]">访问数</div>
<div class="text-lg">
{{ Math.round(visitCountOutput) }}
</div>
</div>
</div>
</el-col>
<!--消息数-->
<el-col :xs="24" :sm="12" :lg="6" class="mb-4">
<div class="data-box">
<div
class="text-[#36a3f7] hover:!text-white hover:bg-[#36a3f7] p-3 rounded"
>
<svg-icon icon-class="message" size="3em" />
</div>
<div class="flex flex-col space-y-3">
<div class="text-[var(--el-text-color-secondary)]">消息数</div>
<div class="text-lg">
{{ Math.round(messageCountOutput) }}
</div>
</div>
</div>
</el-col>
<el-col :xs="24" :sm="12" :lg="6" class="mb-4">
<div class="data-box">
<div
class="text-[#f4516c] hover:!text-white hover:bg-[#f4516c] p-3 rounded"
>
<svg-icon icon-class="money" size="3em" />
</div>
<div class="flex flex-col space-y-3">
<div class="text-[var(--el-text-color-secondary)]">收入金额</div>
<div class="text-lg">
{{ Math.round(amountOutput) }}
</div>
</div>
</div>
</el-col>
<el-col :xs="24" :sm="12" :lg="6" class="mb-2">
<div class="data-box">
<div
class="text-[#34bfa3] hover:!text-white hover:bg-[#34bfa3] p-3 rounded"
>
<svg-icon icon-class="shopping" size="3em" />
</div>
<div class="flex flex-col space-y-3">
<div class="text-[var(--el-text-color-secondary)]">订单数</div>
<div class="text-lg">
{{ Math.round(orderCountOutput) }}
</div>
</div>
</div>
</el-col>
</el-row>
<!-- Echarts 图表 -->
<el-row :gutter="40">
<el-col :sm="24" :lg="8" class="mb-4">
<BarChart
id="barChart"
height="400px"
width="100%"
class="bg-[var(--el-bg-color-overlay)]"
/>
</el-col>
<el-col :xs="24" :sm="12" :lg="8" class="mb-4">
<PieChart
id="pieChart"
height="400px"
width="100%"
class="bg-[var(--el-bg-color-overlay)]"
/>
</el-col>
<el-col :xs="24" :sm="12" :lg="8" class="mb-4">
<RadarChart
id="radarChart"
height="400px"
width="100%"
class="bg-[var(--el-bg-color-overlay)]"
/>
</el-col>
</el-row>
</div>
</template>
<style lang="scss" scoped>
.dashboard-container {
position: relative;
padding: 24px;
.user-avatar {
width: 40px;
height: 40px;
border-radius: 50%;
}
.github-corner {
position: absolute;
top: 0;
right: 0;
z-index: 99;
border: 0;
}
.data-box {
display: flex;
justify-content: space-between;
padding: 20px;
font-weight: bold;
color: var(--el-text-color-regular);
background: var(--el-bg-color-overlay);
border-color: var(--el-border-color);
box-shadow: var(--el-box-shadow-dark);
}
.svg-icon {
fill: currentcolor !important;
}
}
</style>

1
src/views/sysworkflow/lowcodepage/appFormList.vue

@ -226,6 +226,7 @@ const appKey = ref<string>("")
@ 功能: 编辑app内容 @ 功能: 编辑app内容
*/ */
const editAppCont = (val:string) => { const editAppCont = (val:string) => {
emits('getRongQiAttr')
appKey.value = val.toString(); appKey.value = val.toString();
appPageShow.value = true; appPageShow.value = true;
} }

1
src/views/sysworkflow/lowcodepage/appPage/appMenus.vue

@ -239,6 +239,7 @@ const createNewPage = (val?:string) => {
@node-drop="handleDrop" @node-drop="handleDrop"
> >
<template #default="{ node, data }"> <template #default="{ node, data }">
<div class="appMenuTitle"> <div class="appMenuTitle">
<el-space wrap> <el-space wrap>
<svg-icon prefix="icon" :icon-class="data.svg" @click="setAppMenusSvg(data)" /> <svg-icon prefix="icon" :icon-class="data.svg" @click="setAppMenusSvg(data)" />

24
src/views/sysworkflow/lowcodepage/appPage/appPageForm/pageForm.vue

@ -11,7 +11,7 @@ import { FormData,formStruct,DrawerStruct, VideoMsg } from '@/api/DesignForm/typ
// //
import DragControl from '@/components/DesignForm/dragControl.vue'; import DragControlApp from '@/components/DesignForm/dragControlApp.vue';
const props = defineProps({ const props = defineProps({
appCont:{ appCont:{
@ -63,8 +63,8 @@ const state = computed({
emits('update:state', val) emits('update:state', val)
} }
}); });
provide('formDesignType', state.value.designType)
const formKeyVal = computed({ const appFormKeyVal = computed({
get() { get() {
return props.formKey return props.formKey
}, },
@ -73,7 +73,7 @@ const formKeyVal = computed({
} }
}); });
const versionCont = ref<customerFormVersionCont[]>([]) // const versionCont = ref<customerFormVersionCont[]>([]) //
const tableKey = ref("")
// //
const searchCheckField = (data: FormData) => { const searchCheckField = (data: FormData) => {
state.value.formData.list.push(data) state.value.formData.list.push(data)
@ -93,25 +93,21 @@ const openAceEditDrawer = (params: any) => {
</script> </script>
<template> <template>
<el-aside class="asideBox leftBox"> <el-aside class="asideBox leftBox">
<DragControl <DragControlApp
v-model:versionid="props.formVersion" :table-key="state.formData.form.name"
:formid="state.formOtherData.source" @versionUpdateForm="versionUpdateForm"
:versioncont="versionCont"
@click-check="searchCheckField"
@click="selectTemplate"
@editversionstaus="editversionstaus"
/> />
</el-aside> </el-aside>
<el-main class="mainBox rightBox"> <el-main class="mainBox rightBox">
{{state.formData.config}}
</el-main> </el-main>
<el-aside class="asideBox"> <el-aside class="asideBox">
<form-control-attr <formControlProperties
ref="formControlAttrEl" ref="formControlAttrEl"
v-model:formOtherData="state.formOtherData" v-model:formOtherData="state.formOtherData"
:form-data="state.formData.form" :form-data="state.formData.form"
:form-config="state.formData.config" :form-config="state.formData.config"
:customerformid="props.groupKey" :customerformid="tableKey"
:form-list="state.formData.list" :form-list="state.formData.list"
:form-info="state.formData" :form-info="state.formData"
@open-dialog="openAceEditDrawer" @open-dialog="openAceEditDrawer"

4
src/views/sysworkflow/lowcodepage/appPage/createAppFormPage.vue

@ -57,7 +57,7 @@ const state = reactive<formStruct>({
formName: formConfigCont.formName formName: formConfigCont.formName
}, },
config: { config: {
groupKey:props.formGroupKey groupKey:props.groupKey
}, },
styles:{ styles:{
divStyle:{}, divStyle:{},
@ -138,7 +138,7 @@ onBeforeMount(() => {
</el-tabs> </el-tabs>
</div> </div>
<div class="headRight"> <div class="headRight">
{{ props.menuId }} {{props.groupKey}}
<el-button type="danger" size="small" @click="closeSavePageForm" >关闭</el-button> <el-button type="danger" size="small" @click="closeSavePageForm" >关闭</el-button>
</div> </div>
</el-header> </el-header>

Loading…
Cancel
Save