90 changed files with 2880 additions and 678 deletions
@ -0,0 +1,3 @@
@@ -0,0 +1,3 @@
|
||||
NODE_ENV="preview" |
||||
# VUE_APP_BASE_URL="http://172.16.16.120:8080" |
||||
VUE_APP_BASE_URL="http://localhost" |
||||
@ -0,0 +1,2 @@
@@ -0,0 +1,2 @@
|
||||
NODE_ENV="production" |
||||
VUE_APP_BASE_URL="" |
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -1 +0,0 @@
@@ -1 +0,0 @@
|
||||
<!doctype html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="/favicon.ico"><title></title><script defer="defer" src="/js/chunk-vendors.2810f37d.js"></script><script defer="defer" src="/js/index.29912fb5.js"></script><link href="/css/chunk-vendors.6e16aa55.css" rel="stylesheet"><link href="/css/index.3ad5135e.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but noob-mengyxu doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div></body></html> |
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -0,0 +1,44 @@
@@ -0,0 +1,44 @@
|
||||
import { Lang } from 'noob-mengyxu'; |
||||
|
||||
export default class En extends Lang.En { |
||||
table = { |
||||
title: 'Table demo', |
||||
props: [ |
||||
'Case name', |
||||
'Task name', |
||||
'User name', |
||||
'Log content', |
||||
'Create time', |
||||
], |
||||
}; |
||||
form = { |
||||
title: 'Form Example', |
||||
input: 'Input', |
||||
select: 'Select', |
||||
datePicker: 'Date picker', |
||||
pass: 'The verification passed', |
||||
bishu: 'Must enter', |
||||
bixuan: 'Must select', |
||||
maxLen: 'Max length', |
||||
char: 'Character', |
||||
num: 'Integer', |
||||
hex: 'Hexadecimal', |
||||
lan: 'Longitude', |
||||
lat: 'Latitude', |
||||
email: 'Email', |
||||
phone: 'Phone number', |
||||
idCard: 'ID card', |
||||
pwd: 'Simple password', |
||||
password: 'Password', |
||||
}; |
||||
menu = { |
||||
operator: 'Operator', |
||||
home: 'Home', |
||||
base: 'General', |
||||
table: 'Table', |
||||
form: 'Form', |
||||
tool: 'Tool', |
||||
terminal: 'Terminal', |
||||
color: 'Color', |
||||
}; |
||||
} |
||||
@ -0,0 +1,7 @@
@@ -0,0 +1,7 @@
|
||||
import Zh from './zh'; |
||||
import En from './en'; |
||||
import { Lang } from 'noob-mengyxu'; |
||||
Lang.registerLang('zh', new Zh()); |
||||
Lang.registerLang('en', new En()); |
||||
|
||||
export default Lang.i18n; |
||||
@ -0,0 +1,37 @@
@@ -0,0 +1,37 @@
|
||||
import { Lang } from 'noob-mengyxu'; |
||||
export default class Zh extends Lang.Zh { |
||||
table = { |
||||
title: '表格演示', |
||||
props: ['案件名称', '任务名称', '用户名', '日志内容', '产生时间'], |
||||
}; |
||||
form = { |
||||
title: '表单演示', |
||||
input: '输入框', |
||||
select: '选择框', |
||||
datePicker: '时间选择框', |
||||
pass: '校验通过', |
||||
bishu: '必输', |
||||
bixuan: '必选', |
||||
maxLen: '最长', |
||||
char: '字符', |
||||
num: '整数', |
||||
hex: '十六进制数字', |
||||
lan: '经度', |
||||
lat: '纬度', |
||||
email: '电子邮箱', |
||||
phone: '手机号码', |
||||
idCard: '身份证号码', |
||||
pwd: '简单密码', |
||||
password: '普通密码', |
||||
}; |
||||
menu = { |
||||
operator: '运维', |
||||
home: '主页', |
||||
base: '通用', |
||||
table: '表格', |
||||
form: '表单', |
||||
tool: '工具', |
||||
terminal: '终端', |
||||
color: '颜色', |
||||
}; |
||||
} |
||||
@ -1 +1,3 @@
@@ -1 +1,3 @@
|
||||
export default {}; |
||||
import { Store } from 'noob-mengyxu'; |
||||
class Actions extends Store.Actions {} |
||||
export default new Actions(); |
||||
|
||||
@ -1,12 +1,10 @@
@@ -1,12 +1,10 @@
|
||||
import { createStore } from 'plugs'; |
||||
import { Store } from 'noob-mengyxu'; |
||||
import state from './state'; |
||||
import mutations from './mutations'; |
||||
import actions from './actions'; |
||||
|
||||
export default createStore({ |
||||
export default Store.createStore({ |
||||
state, |
||||
getters: {}, |
||||
mutations, |
||||
actions, |
||||
modules: {}, |
||||
}); |
||||
|
||||
@ -0,0 +1,3 @@
@@ -0,0 +1,3 @@
|
||||
import { Store } from 'noob-mengyxu'; |
||||
class Mutations extends Store.Mutations {} |
||||
export default new Mutations(); |
||||
@ -1,14 +1,9 @@
@@ -1,14 +1,9 @@
|
||||
export default { |
||||
dict: { |
||||
test: { |
||||
a: 'A', |
||||
b: 'B', |
||||
c: 'C', |
||||
}, |
||||
}, |
||||
test: [ |
||||
import { Store } from 'noob-mengyxu'; |
||||
class State extends Store.State { |
||||
test = [ |
||||
{ key: 'a', value: 'A' }, |
||||
{ key: 'b', value: 'B' }, |
||||
{ key: 'c', value: 'C' }, |
||||
], |
||||
}; |
||||
]; |
||||
} |
||||
export default new State(); |
||||
|
||||
@ -1,15 +1,89 @@
@@ -1,15 +1,89 @@
|
||||
<template> |
||||
<span>待开发</span> |
||||
<h2>{{ t('form.title') }}</h2> |
||||
<el-row> |
||||
<el-col :span="8"> |
||||
<ModifyForm class="modify-form-demo" @cancel="demo = {}" @confirm="" :rules="rules" :param="demo" :width="140" |
||||
:items="demoItems"> |
||||
</ModifyForm> |
||||
</el-col> |
||||
<el-col :span="8"> |
||||
<ModifyForm ref="form" class="modify-form-demo" @cancel="cancel" @confirm="confirm" :rules="rules" |
||||
:param="param" :width="140" :items="items"> |
||||
</ModifyForm> |
||||
</el-col> |
||||
<el-col :span="8"> |
||||
<LoginForm @login="e => console.log(e)"></LoginForm> |
||||
</el-col> |
||||
</el-row> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
import { onMounted, ref } from "vue"; |
||||
import { ModifyForm, Element, LoginForm } from 'noob-mengyxu'; |
||||
import { useI18n } from "vue3-i18n"; |
||||
const { t } = useI18n(); |
||||
const { showMessage, SimpleRequired, SimpleCharacter, Character, SimpleNumber, Hexadecimal, Longitude, Latitude, Email, Phone, Ipv4, Ipv6, IdCard, SimplePassword, Password } = Element; |
||||
const rules = { |
||||
bishu: [new SimpleRequired('form.bishu')], |
||||
bixuan: [new SimpleRequired('form.bixuan', true)], |
||||
maxLen: [new SimpleCharacter(10)], |
||||
char: [new Character(new RegExp(/^[^ ]+$/))], |
||||
num: [new SimpleNumber(10, 20)], |
||||
hex: [new Hexadecimal(2, 8)], |
||||
lan: [new Longitude()], |
||||
lat: [new Latitude()], |
||||
email: [new Email()], |
||||
phone: [new Phone()], |
||||
ipv4: [new Ipv4()], |
||||
ipv6: [new Ipv6()], |
||||
idCard: [new IdCard()], |
||||
pwd: [new SimplePassword()], |
||||
password: [new Password()] |
||||
} |
||||
const demo = ref<any>({}); |
||||
const demoItems = [ |
||||
{ i18n: 'form.input', code: 'input' }, |
||||
{ i18n: 'form.select', code: 'select', dict: 'test' }, |
||||
{ i18n: 'form.NoobDate', code: 'date', date: true }, |
||||
] |
||||
const items = [ |
||||
{ i18n: 'form.bishu', code: 'bishu' }, |
||||
{ i18n: 'form.bixuan', code: 'bixuan', dict: 'test' }, |
||||
{ i18n: 'form.maxLen', code: 'maxLen' }, |
||||
{ i18n: 'form.char', code: 'char' }, |
||||
{ i18n: 'form.num', code: 'num' }, |
||||
{ i18n: 'form.hex', code: 'hex' }, |
||||
{ i18n: 'form.lan', code: 'lan' }, |
||||
{ i18n: 'form.lat', code: 'lat' }, |
||||
{ i18n: 'form.email', code: 'email' }, |
||||
{ i18n: 'form.phone', code: 'phone' }, |
||||
{ name: 'ipv4', code: 'ipv4' }, |
||||
{ name: 'ipv6', code: 'ipv6' }, |
||||
{ i18n: 'form.idCard', code: 'idCard' }, |
||||
{ i18n: 'form.pwd', code: 'pwd' }, |
||||
{ i18n: 'form.password', code: 'password' }, |
||||
] |
||||
const param = ref<any>({}); |
||||
const form = ref(); |
||||
|
||||
const { state, commit, dispatch } = useStore(); |
||||
const cancel = () => { |
||||
param.value = {}; |
||||
setTimeout(() => { |
||||
form.value?.clearValidate(); |
||||
}, 50); |
||||
} |
||||
|
||||
const confirm = () => { |
||||
showMessage('success', t('form.pass')); |
||||
} |
||||
|
||||
onMounted(() => { }); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
::v-deep .modify-form-demo { |
||||
width: 400px; |
||||
float: left; |
||||
padding: 20px; |
||||
} |
||||
</style> |
||||
@ -1,15 +1,14 @@
@@ -1,15 +1,14 @@
|
||||
<template> |
||||
<WkbTag>ssss</WkbTag> |
||||
<NoobTag>{{ t('title') }}</NoobTag> |
||||
<NoobTag type="success">{{ t('title') }}</NoobTag> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
import { WkbTag } from "noob"; |
||||
import { NoobTag, Http } from "noob-mengyxu"; |
||||
import { useI18n } from "vue3-i18n"; |
||||
const { t } = useI18n(); |
||||
const { post } = Http.Axios2 |
||||
|
||||
const { state, commit, dispatch } = useStore(); |
||||
|
||||
onMounted(() => { }); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
|
||||
@ -0,0 +1,58 @@
@@ -0,0 +1,58 @@
|
||||
<template> |
||||
<el-descriptions class="noob-descriptions" :title="title" :column="colnums[state.size.size]" :size="state.size.size" |
||||
:border="border"> |
||||
<el-descriptions-item v-if="isObi()" v-for="(val, key, i) in data" :label="key"> |
||||
{{ val }} |
||||
</el-descriptions-item> |
||||
<el-descriptions-item v-else-if="isArr()" v-for="item in data" :label="item.key"> |
||||
{{ item.value }} |
||||
</el-descriptions-item> |
||||
<el-descriptions-item v-else :label="t('base.value')">{{ data }}</el-descriptions-item> |
||||
</el-descriptions> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { onMounted } from "vue"; |
||||
import { useI18n } from "vue3-i18n"; |
||||
const { t } = useI18n(); |
||||
|
||||
const { state, commit, dispatch } = useStore(); |
||||
|
||||
const prop = defineProps({ |
||||
data: { |
||||
type: Object, |
||||
default: 0, |
||||
}, |
||||
title: { |
||||
type: String, |
||||
default: null, |
||||
}, |
||||
border: { |
||||
type: Boolean, |
||||
default: true |
||||
} |
||||
}); |
||||
|
||||
const colnums = { |
||||
'normal': 4, |
||||
'small': 5, |
||||
'large': 3 |
||||
} |
||||
|
||||
const isObi = () => { |
||||
return typeof prop.data === 'object'; |
||||
} |
||||
|
||||
const isArr = () => { |
||||
return Array.isArray(prop.data); |
||||
} |
||||
|
||||
onMounted(() => { }); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
.noob-descriptions { |
||||
--el-descriptions-item-bordered-label-background: v-bind('state.style.tableBg') !important; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,81 @@
@@ -0,0 +1,81 @@
|
||||
<template> |
||||
<div :class="['infomation', center && 'center']"> |
||||
<el-button class="icon" type="info" :icon="icon"></el-button> |
||||
<div class="title">{{ title }}</div> |
||||
<el-divider></el-divider> |
||||
<span style="margin-right: -105px">{{ num }}</span> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
const prop = defineProps({ |
||||
num: { |
||||
type: Number, |
||||
default: 0, |
||||
}, |
||||
icon: { |
||||
type: String, |
||||
default: '', |
||||
}, |
||||
title: { |
||||
type: String, |
||||
default: '', |
||||
}, |
||||
center: { |
||||
type: Boolean, |
||||
default: false |
||||
} |
||||
}); |
||||
|
||||
</script> |
||||
<style lang="scss" scoped> |
||||
.infomation { |
||||
text-align: center; |
||||
margin-bottom: 10px; |
||||
float: left; |
||||
width: 250px; |
||||
height: 80px; |
||||
background-color: transparent; |
||||
color: deepskyblue; |
||||
border-radius: 20px; |
||||
margin-left: 50px; |
||||
box-shadow: -2px 2px 3px #aaaaaa; |
||||
|
||||
.icon { |
||||
position: relative; |
||||
top: -10px; |
||||
z-index: 2; |
||||
left: -35px; |
||||
font-size: 20px; |
||||
background-color: transparent; |
||||
color: deepskyblue; |
||||
} |
||||
|
||||
.title { |
||||
float: right; |
||||
margin: 10px 10px 0 0; |
||||
} |
||||
|
||||
&.center { |
||||
.icon { |
||||
left: 0px; |
||||
} |
||||
|
||||
.title { |
||||
float: none; |
||||
width: 100%; |
||||
margin: 0; |
||||
text-align: center; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.el-divider { |
||||
background-color: transparent; |
||||
position: relative; |
||||
} |
||||
|
||||
.el-divider--horizontal { |
||||
margin: 5px 0; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,144 @@
@@ -0,0 +1,144 @@
|
||||
<template> |
||||
<div class="my-table"> |
||||
<el-table :size="state.size.size" :data="page ? data.data : data" @selection-change="selectionChange" |
||||
:height="height || (page ? state.size.pTableHeight : state.size.tableHeight)" highlight-current-row |
||||
:row-key="rowKey" :tree-porps="treeProps"> |
||||
|
||||
<el-table-column v-for="item in props" :key="item.code" :prop="item.code" :label="item.name || t(item.i18n)" |
||||
:type="item.type" :min-width="item.width" :width="item.type ? item.width : ''" :fixed="item.fixed" |
||||
:align="item.align ? item.align : 'center'" show-overflow-tooltip :formatter="formatter"> |
||||
|
||||
<template v-if="item.slot" #default="scope"> |
||||
<slot :name="item.code" :row="scope.row"></slot> |
||||
</template> |
||||
|
||||
<template v-if="item.dict" #default="{ row }"> |
||||
{{ formatterByDist(item.dict, row[item.code]) }} |
||||
</template> |
||||
|
||||
</el-table-column> |
||||
|
||||
</el-table> |
||||
</div> |
||||
<div v-if="page" class="my-pagination"> |
||||
<el-pagination :small="state.size.size == 'small'" @size-change="handleSizeChange" |
||||
@current-change="handleCurrentChange" :current-page="example.page" :page-sizes="[10, 20, 50, 100, 200]" |
||||
:page-size="example.size" layout="total, sizes, prev, pager, next, jumper" :total="data.total"> |
||||
</el-pagination> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
import { useI18n } from "vue3-i18n"; |
||||
// import { PageExample } from "noob-mengyxu"; |
||||
const { t } = useI18n(); |
||||
const { state } = useStore(); |
||||
|
||||
const prop = defineProps({ |
||||
data: { |
||||
type: Object, |
||||
default: null |
||||
}, |
||||
props: { |
||||
type: Array<any>(), |
||||
default: [], |
||||
}, |
||||
page: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
height: { |
||||
type: Number, |
||||
default: null, |
||||
}, |
||||
example: { |
||||
type: Object, |
||||
default: {}, |
||||
}, |
||||
rowKey: { |
||||
type: String, |
||||
default: null, |
||||
}, |
||||
treeProps: { |
||||
type: Object, |
||||
default: null, |
||||
}, |
||||
}); |
||||
|
||||
const emit = defineEmits(["query", "selection-change"]); |
||||
|
||||
const selectionChange = selection => { |
||||
emit("selection-change", selection); |
||||
}; |
||||
|
||||
const handleSizeChange = (val) => { |
||||
prop.example.size = val; |
||||
emit("query"); |
||||
}; |
||||
|
||||
const handleCurrentChange = (val) => { |
||||
prop.example.page = val; |
||||
emit("query"); |
||||
}; |
||||
|
||||
const getValue = ( |
||||
row: any, |
||||
column: string, |
||||
value: any, |
||||
index?: number |
||||
) => { |
||||
if ((value == null || value == '') && value !== 0) { |
||||
return '--'; |
||||
} |
||||
return value; |
||||
}; |
||||
|
||||
const formatter = (row: any, column: any, value: any, index: number) => { |
||||
if (row.scheme) |
||||
return formatterByDist(row.scheme + '_' + column.property, value); |
||||
return getValue(null, '', value); |
||||
}; |
||||
|
||||
const formatterByDist = (dictKey, value) => { |
||||
if (!dictKey) { |
||||
return getValue(null, '', value); |
||||
} |
||||
const mapping = state.dict[dictKey]; |
||||
if (mapping == null) { |
||||
return getValue(null, '', value); |
||||
} |
||||
return mapping[value] == null ? value : mapping[value]; |
||||
}; |
||||
onMounted(() => { }); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
.my-table * { |
||||
--el-table-bg-color: v-bind('state.style.tableBg') !important; |
||||
--el-table-tr-bg-color: v-bind('state.style.tableBg') !important; |
||||
--el-table-expanded-cell-bg-color: v-bind('state.style.tableBg') !important; |
||||
|
||||
--el-table-border-color: v-bind('state.style.tableBorderColor'); |
||||
--el-table-border: 1px solid var(--el-table-border-color); |
||||
--el-table-text-color: v-bind('state.style.tableColor'); |
||||
--el-table-header-text-color: v-bind('state.style.tableColor'); |
||||
--el-table-row-hover-bg-color: v-bind('state.style.tableCurBg'); |
||||
--el-table-current-row-bg-color: v-bind('state.style.tableCurBg'); |
||||
--el-table-header-bg-color: v-bind('state.style.tableHeadBg'); |
||||
--el-bg-color: v-bind('state.style.tableBg') !important; |
||||
} |
||||
|
||||
::v-deep .el-table__row--level-1, |
||||
::v-deep .el-table__row--level-3 { |
||||
background: v-bind('state.style.tableChildBg') !important; |
||||
} |
||||
|
||||
.my-pagination * { |
||||
--el-pagination-bg-color: v-bind('state.style.bodyBg') !important; |
||||
--el-pagination-disabled-bg-color: v-bind('state.style.bodyBg') !important; |
||||
--el-pagination-text-color: v-bind('state.style.color') !important; |
||||
--el-pagination-button-color: v-bind('state.style.color') !important; |
||||
--el-pagination-button-disabled-bg-color: v-bind('state.style.bodyBg') !important; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,68 @@
@@ -0,0 +1,68 @@
|
||||
<template> |
||||
<el-form label-position="right" class="login-form" :model="param" ref="loginForm" :rules="rules"> |
||||
<el-form-item> |
||||
<div class="lte-title"> {{ t('title') }} </div> |
||||
</el-form-item> |
||||
<el-form-item prop="userId"> |
||||
<NoobInput v-model="param.userId" :placeholder="t('pwd.userId')" :full="true"></NoobInput> |
||||
</el-form-item> |
||||
<el-form-item prop="password"> |
||||
<NoobInput v-model="param.password" type="password" :placeholder="t('pwd.pwd')" :full="true"></NoobInput> |
||||
</el-form-item> |
||||
<el-form-item> |
||||
<NoobButton @click="login">{{ t('pwd.login') }}</NoobButton> |
||||
</el-form-item> |
||||
</el-form> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
import { FormInstance } from "element-plus"; |
||||
import { NoobInput, NoobButton, Element } from "noob-mengyxu"; |
||||
import { useI18n } from "vue3-i18n"; |
||||
|
||||
const { t } = useI18n(); |
||||
const { state } = useStore(); |
||||
const { SimpleRequired } = Element; |
||||
|
||||
const emit = defineEmits(["login"]); |
||||
const param = ref<any>({}); |
||||
const loginForm = ref<FormInstance>(); |
||||
|
||||
const rules = { |
||||
userId: [new SimpleRequired('pwd.userId')], |
||||
password: [new SimpleRequired('pwd.pwd')] |
||||
} |
||||
|
||||
const login = () => { |
||||
if (!loginForm.value) return; |
||||
loginForm.value?.validate((valid, fields) => { |
||||
if (valid) { |
||||
emit("login", param.value); |
||||
loginForm.value?.clearValidate(); |
||||
} |
||||
}); |
||||
} |
||||
|
||||
onMounted(() => { }); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
.login-form { |
||||
width: v-bind('state.size.loginWidth'); |
||||
height: v-bind('state.size.loginHeight'); |
||||
} |
||||
|
||||
.lte-title { |
||||
font-size: 1.5em; |
||||
font-weight: bold; |
||||
text-align: center; |
||||
width: 100%; |
||||
color: rgb(49, 89, 143); |
||||
} |
||||
|
||||
.el-button { |
||||
width: 100%; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,40 @@
@@ -0,0 +1,40 @@
|
||||
<template> |
||||
<el-tooltip effect="dark" :content="t('base.modify')" placement="top"> |
||||
<el-button v-if="modify" :size="state.size.size" type="primary" @click="emit('modify')" icon="EditPen" circle /> |
||||
</el-tooltip> |
||||
<el-tooltip effect="dark" :content="t('base.delete')" placement="top"> |
||||
<el-button v-if="del" :size="state.size.size" type="danger" @click="emit('del')" icon="delete" circle /> |
||||
</el-tooltip> |
||||
<el-tooltip effect="dark" :content="t('base.add')" placement="top"> |
||||
<el-button v-if="add" :size="state.size.size" type="success" @click="emit('add')" icon="plus" circle /> |
||||
</el-tooltip> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { onMounted } from "vue"; |
||||
import { useI18n } from "vue3-i18n"; |
||||
|
||||
const { t } = useI18n(); |
||||
const { state } = useStore(); |
||||
const emit = defineEmits(["modify", "del", "add"]); |
||||
const prop = defineProps({ |
||||
add: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
modify: { |
||||
type: Boolean, |
||||
default: true, |
||||
}, |
||||
del: { |
||||
type: Boolean, |
||||
default: true, |
||||
}, |
||||
}); |
||||
|
||||
onMounted(() => { }); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
</style> |
||||
@ -1,12 +1,24 @@
@@ -1,12 +1,24 @@
|
||||
import WkbTag from './tag.vue'; |
||||
import NoobTag from './item/tag.vue'; |
||||
import NoobButton from './item/button.vue'; |
||||
import NoobSelect from './item/select.vue'; |
||||
import NoobInput from './item/input.vue'; |
||||
import NoobDate from './item/datetime.vue'; |
||||
|
||||
export { WkbTag }; |
||||
export { NoobTag, NoobButton, NoobSelect, NoobInput, NoobDate }; |
||||
|
||||
import SearchRow from './table/search-row.vue'; |
||||
import SearchInput from './table/search-input.vue'; |
||||
import ListTable from './table/list-table.vue'; |
||||
export { SearchRow, ListTable, SearchInput }; |
||||
|
||||
import ModifyForm from './form/modify-form.vue'; |
||||
import DictSelect from './form/dict-select.vue'; |
||||
export { ModifyForm, DictSelect }; |
||||
import SearchRow from './data/search-row.vue'; |
||||
import ListTable from './data/list-table.vue'; |
||||
import Infomation from './data/infomation.vue'; |
||||
import ModifyForm from './data/modify-form.vue'; |
||||
import LoginForm from './data/login-form.vue'; |
||||
import Descriptions from './data/descriptions.vue'; |
||||
import TableAction from './data/table-action.vue'; |
||||
export { |
||||
SearchRow, |
||||
ListTable, |
||||
Infomation, |
||||
ModifyForm, |
||||
LoginForm, |
||||
Descriptions, |
||||
TableAction, |
||||
}; |
||||
|
||||
@ -0,0 +1,64 @@
@@ -0,0 +1,64 @@
|
||||
<template> |
||||
<el-button :class="type || state.style.name" :size="state.size.size" :type="type" :icon="icon" :disabled="disabled" |
||||
:plain="plain" :round="round" :circle="circle" :="loading" :text="text" :link="link"> |
||||
<slot /> |
||||
</el-button> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
const { state } = useStore(); |
||||
|
||||
const prop = defineProps({ |
||||
type: { |
||||
type: String, |
||||
default: null |
||||
}, |
||||
icon: { |
||||
type: String, |
||||
default: null |
||||
}, |
||||
disabled: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
plain: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
round: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
circle: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
loading: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
text: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
link: { |
||||
type: Boolean, |
||||
default: false, |
||||
} |
||||
}); |
||||
|
||||
onMounted(() => { }); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
.dark { |
||||
--el-button-bg-color: v-bind('state.style.itemBg'); |
||||
--el-button-border-color: v-bind('state.style.itemBg'); |
||||
--el-button-text-color: v-bind('state.style.color'); |
||||
--el-button-hover-bg-color: v-bind('state.style.itemBg'); |
||||
--el-button-hover-border-color: v-bind('state.style.itemBg'); |
||||
--el-button-hover-text-color: v-bind('state.style.color'); |
||||
} |
||||
</style> |
||||
@ -0,0 +1,69 @@
@@ -0,0 +1,69 @@
|
||||
<template> |
||||
<el-date-picker :size="state.size.size" :class="['form-item', full && 'full']" :value-format="formater" |
||||
v-model="myValue" type="datetime" :placeholder="placeholder || t('rule.pleaseEnter')" :disabled="disabled" |
||||
:clearable="clearable" :teleported="false" /> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { onMounted, ref, watch } from "vue"; |
||||
import { useI18n } from 'vue3-i18n'; |
||||
const { t } = useI18n(); |
||||
const { state } = useStore(); |
||||
|
||||
const prop = defineProps({ |
||||
modelValue: null, |
||||
placeholder: { |
||||
type: String, |
||||
default: null |
||||
}, |
||||
disabled: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
clearable: { |
||||
type: Boolean, |
||||
default: true, |
||||
}, |
||||
full: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
formater: { |
||||
type: String, |
||||
defaul: 'YYYY-MM-DDTHH:mm:ss' |
||||
}, |
||||
width: { |
||||
type: Number |
||||
} |
||||
}); |
||||
const emit = defineEmits(["update:modelValue"]); |
||||
const myValue = ref(null); |
||||
const width = ref('150px'); |
||||
const setWidth = () => { |
||||
if (prop.width) { |
||||
width.value = prop.width + 'px'; |
||||
} else { |
||||
width.value = state.size.searchWidth; |
||||
} |
||||
} |
||||
watch(() => state.size, (n, o) => { |
||||
setWidth(); |
||||
}) |
||||
watch(myValue, (n, o) => { |
||||
emit('update:modelValue', n); |
||||
}) |
||||
watch(() => prop.modelValue, (n, o) => { |
||||
myValue.value = n; |
||||
}) |
||||
onMounted(() => { |
||||
prop.modelValue && (myValue.value = prop.modelValue); |
||||
setWidth(); |
||||
}); |
||||
</script> |
||||
<style lang="scss"> |
||||
//@import url(); 引入公共css类 |
||||
.form-item { |
||||
width: v-bind('width'); |
||||
} |
||||
</style> |
||||
@ -0,0 +1,68 @@
@@ -0,0 +1,68 @@
|
||||
<template> |
||||
<el-input :size="state.size.size" :class="['form-item', full && 'full']" v-model="myValue" :type="type" |
||||
:placeholder="placeholder || t('rule.pleaseEnter')" :disabled="disabled" :clearable="clearable"></el-input> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { onMounted, ref, watch } from "vue"; |
||||
import { useI18n } from 'vue3-i18n'; |
||||
const { t } = useI18n(); |
||||
const { state } = useStore(); |
||||
|
||||
const prop = defineProps({ |
||||
modelValue: null, |
||||
placeholder: { |
||||
type: String, |
||||
default: null |
||||
}, |
||||
type: { |
||||
type: String, |
||||
default: null |
||||
}, |
||||
disabled: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
clearable: { |
||||
type: Boolean, |
||||
default: true, |
||||
}, |
||||
full: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
width: { |
||||
type: Number |
||||
} |
||||
}); |
||||
const emit = defineEmits(["update:modelValue"]); |
||||
const myValue = ref(null); |
||||
const width = ref('150px'); |
||||
const setWidth = () => { |
||||
if (prop.width) { |
||||
width.value = prop.width + 'px'; |
||||
} else { |
||||
width.value = state.size.searchWidth; |
||||
} |
||||
} |
||||
watch(myValue, (n, o) => { |
||||
emit('update:modelValue', n); |
||||
}) |
||||
watch(() => prop.modelValue, (n, o) => { |
||||
myValue.value = n; |
||||
}) |
||||
watch(() => state.size, (n, o) => { |
||||
setWidth(); |
||||
}) |
||||
onMounted(() => { |
||||
prop.modelValue && (myValue.value = prop.modelValue); |
||||
setWidth(); |
||||
}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
.form-item { |
||||
width: v-bind('width'); |
||||
} |
||||
</style> |
||||
@ -1,116 +0,0 @@
@@ -1,116 +0,0 @@
|
||||
<template> |
||||
<div class="my-table"> |
||||
<el-table :size="state.size.size" :data="page ? data.data : data" @selection-change="selectionChange" |
||||
:height="height ? height : (page ? state.sizes.pTableHei : state.sizes.tableHei)" highlight-current-row |
||||
header-row-class-name="table-head" row-class-name="table-row"> |
||||
<el-table-column v-for="item in props" :key="item.code" :prop="item.code" :label="item.name" :type="item.type" |
||||
:min-width="item.width" :width="item.type ? item.width : ''" :align="item.align ? item.align : 'center'" |
||||
show-overflow-tooltip :formatter="formatter"> |
||||
<template v-if="item.slot" #default="scope"> |
||||
<slot :name="item.code" :row="scope.row"></slot> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
</div> |
||||
<div v-if="page" class="my-pagination"> |
||||
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="example.page" |
||||
:page-sizes="[10, 20, 50, 100, 200]" :page-size="example.size" layout="total, sizes, prev, pager, next, jumper" |
||||
:total="data.total"> |
||||
</el-pagination> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
|
||||
const { state } = useStore(); |
||||
const prop = defineProps({ |
||||
data: { |
||||
type: Object, |
||||
default: null |
||||
}, |
||||
props: { |
||||
type: Array<any>(), |
||||
default: [], |
||||
}, |
||||
page: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
height: { |
||||
type: Number, |
||||
default: null, |
||||
}, |
||||
example: { |
||||
type: Object, |
||||
default: null, |
||||
}, |
||||
}); |
||||
|
||||
|
||||
const emit = defineEmits(["query", "selection-change"]); |
||||
|
||||
const selectionChange = selection => { |
||||
emit("selection-change", selection); |
||||
}; |
||||
|
||||
const handleSizeChange = (val) => { |
||||
prop.example.size = val; |
||||
emit("query"); |
||||
}; |
||||
|
||||
const handleCurrentChange = (val) => { |
||||
prop.example.page = val; |
||||
emit("query"); |
||||
}; |
||||
|
||||
const getValue = ( |
||||
row: any, |
||||
column: string, |
||||
value: any, |
||||
index?: number |
||||
) => { |
||||
if ((value == null || value == '') && value !== 0) { |
||||
return '--'; |
||||
} |
||||
return value; |
||||
}; |
||||
|
||||
const formatter = (row: any, column: any, value: any, index: number) => { |
||||
if (row.scheme) |
||||
return formatterByDist(row.scheme + '_' + column.property, value); |
||||
return getValue(null, '', value); |
||||
}; |
||||
|
||||
const formatterByDist = (dictKey, value) => { |
||||
if (!dictKey) { |
||||
return getValue(null, '', value); |
||||
} |
||||
const mapping = state.dict[dictKey]; |
||||
if (mapping == null) { |
||||
return getValue(null, '', value); |
||||
} |
||||
return mapping[value] == null ? value : mapping[value]; |
||||
}; |
||||
|
||||
onMounted(() => { }); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
.my-table ::v-deep .el-table__header .el-table__cell { |
||||
background-color: v-bind('state.style.tableHeadBg') !important; |
||||
border-bottom: 1px solid v-bind('state.style.tableBorderColor'); |
||||
} |
||||
|
||||
.my-table ::v-deep .el-table { |
||||
background-color: v-bind('state.style.bodyBg') !important; |
||||
color: v-bind('state.style.tableColor'); |
||||
border-bottom: 1px solid v-bind('state.style.tableBorderColor'); |
||||
} |
||||
|
||||
.my-table ::v-deep .el-table__body .el-table__cell { |
||||
background-color: v-bind('state.style.tableBg') !important; |
||||
border-bottom: 1px solid v-bind('state.style.tableBorderColor'); |
||||
} |
||||
</style> |
||||
@ -1,51 +0,0 @@
@@ -1,51 +0,0 @@
|
||||
<template> |
||||
<el-input :size="state.size.size" class="search-input" v-model="myValue" :placeholder="placeholder || state.lang.pleaseEnter" |
||||
:disabled="disabled" :clearable="clearable"></el-input> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref, watch } from "vue"; |
||||
|
||||
const { state, commit, dispatch } = useStore(); |
||||
|
||||
const prop = defineProps({ |
||||
modelValue: null, |
||||
placeholder: { |
||||
type: String, |
||||
default: null |
||||
}, |
||||
disabled: { |
||||
type: Boolean, |
||||
default: false, |
||||
}, |
||||
clearable: { |
||||
type: Boolean, |
||||
default: true, |
||||
}, |
||||
width: { |
||||
type: Number, |
||||
default: 150, |
||||
} |
||||
}); |
||||
const emit = defineEmits(["update:modelValue"]); |
||||
const myValue = ref(null); |
||||
const width = ref('150px'); |
||||
watch(myValue, (n, o) => { |
||||
emit('update:modelValue', n); |
||||
}) |
||||
onMounted(() => { |
||||
myValue.value = prop.modelValue; |
||||
width.value = prop.width + 'px'; |
||||
}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
.search-input { |
||||
width: v-bind('width'); |
||||
margin-right: v-bind('state.size.searchMargin'); |
||||
::v-deep .el-input__wrapper{ |
||||
background-color: v-bind('state.style.itemBg'); |
||||
} |
||||
} |
||||
</style> |
||||
@ -1,4 +1,5 @@
@@ -1,4 +1,5 @@
|
||||
import Index from './router/index.vue'; |
||||
import MenuTree from './components/menuTree.vue'; |
||||
import Head from './components/head.vue'; |
||||
export { Index, MenuTree, Head }; |
||||
import MenuTree from './common/menu-tree.vue'; |
||||
import Head from './common/head.vue'; |
||||
import Views from './views'; |
||||
export { Index, MenuTree, Head, Views }; |
||||
|
||||
@ -0,0 +1,56 @@
@@ -0,0 +1,56 @@
|
||||
<template> |
||||
<SearchRow :title="t('buffer.title')" :del="false" @query="query" :add="false" :query="false"> |
||||
<template #left> |
||||
<NoobButton type="success" :icon="delete" @click="clean().then(query)"> |
||||
{{ t('buffer.clean') }} |
||||
</NoobButton> |
||||
</template> |
||||
</SearchRow> |
||||
<ListTable @query="query" :props="props" :data="result"> |
||||
<template #value="{ row }"> |
||||
<Descriptions :data="row.value" /> |
||||
</template> |
||||
<template #action="{ row }"> |
||||
<TableAction @modify="delay(row)" @del="delate(row)" /> |
||||
</template> |
||||
</ListTable> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { onMounted, ref } from "vue"; |
||||
import { Api, ListTable, SearchRow, NoobButton, TableAction, Element, Descriptions } from "noob-mengyxu"; |
||||
import { useI18n } from "vue3-i18n"; |
||||
const { t } = useI18n(); |
||||
const { prompt } = Element; |
||||
const { list, clean, set, del } = Api.buffer; |
||||
const result = ref([]); |
||||
|
||||
const props = [ |
||||
{ code: 'value', type: "expand", slot: true }, |
||||
{ i18n: 'buffer.prop.1', code: 'key', width: 200 }, |
||||
{ i18n: 'buffer.prop.2', code: 'effective', width: 100 }, |
||||
{ i18n: 'buffer.prop.3', code: '失效时间', width: 180 }, |
||||
{ i18n: 'buffer.prop.4', code: 'action', width: 130, slot: true }, |
||||
] |
||||
|
||||
const query = () => { |
||||
list().then((rsp: any) => result.value = rsp) |
||||
} |
||||
|
||||
const delate = (row) => { |
||||
Element.confirm(t('buffer.delete.0'), t('buffer.delete.1')).then(() => { |
||||
del(row).then(query); |
||||
}) |
||||
} |
||||
|
||||
const delay = row => { |
||||
prompt(t(''), t(''), /^((\d{2}(([02468][048])|([13579][26]))[\-\/\s]?((((0?[13578])|(1[02]))[\-\/\s]?((0?[1-9])|([1-2][0-9])|(3[01])))|(((0?[469])|(11))[\-\/\s]?((0?[1-9])|([1-2][0-9])|(30)))|(0?2[\-\/\s]?((0?[1-9])|([1-2][0-9])))))|(\d{2}(([02468][1235679])|([13579][01345789]))[\-\/\s]?((((0?[13578])|(1[02]))[\-\/\s]?((0?[1-9])|([1-2][0-9])|(3[01])))|(((0?[469])|(11))[\-\/\s]?((0?[1-9])|([1-2][0-9])|(30)))|(0?2[\-\/\s]?((0?[1-9])|(1[0-9])|(2[0-8]))))))(\s((([0-1][0-9])|(2?[0-3]))\:([0-5]?[0-9])((\s)|(\:([0-5]?[0-9])))))?$/, '时间格式不正确').then(value => { |
||||
set({ key: row.key, loseTime: value }).then(query) |
||||
}) |
||||
} |
||||
|
||||
onMounted(() => { |
||||
query(); |
||||
}); |
||||
</script> |
||||
<style lang="scss" scoped></style> |
||||
@ -0,0 +1,14 @@
@@ -0,0 +1,14 @@
|
||||
<template> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
|
||||
const { state, commit, dispatch } = useStore(); |
||||
|
||||
onMounted(() => {}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
</style> |
||||
@ -0,0 +1,115 @@
@@ -0,0 +1,115 @@
|
||||
<template> |
||||
<SearchRow :title="t('dict.title')" :del="false" @query="query" @add="addDict"> |
||||
<NoobInput v-model="example.name" :placeholder="t('dict.example.0')" /> |
||||
<NoobInput v-model="example.code" :placeholder="t('dict.example.1')" /> |
||||
<NoobSelect v-model="example.status" dict="active_status" :placeholder="t('dict.example.2')" /> |
||||
</SearchRow> |
||||
<ListTable @query="query" :props="props" :example="example" :page="true" :data="result" rowKey="code" |
||||
:treeProps="{ children: 'children' }"> |
||||
<template #status="{ row }"> |
||||
<div slot="reference" class="name-wrapper"> |
||||
<NoobTag v-if="row.status == 'A'"> |
||||
{{ t('base.active') }} |
||||
</NoobTag> |
||||
<NoobTag v-else type="danger"> |
||||
{{ t('base.inactive') }} |
||||
</NoobTag> |
||||
</div> |
||||
</template> |
||||
<template #action="{ row }"> |
||||
<TableAction :add="row.parent == null" @modify="modify(row)" @del="delate(row)" @add="addDict(row)"/> |
||||
</template> |
||||
</ListTable> |
||||
|
||||
<el-dialog :title="t('base.add') + t('dict.name')" v-model="flag.modify" :close-on-click-modal="false" top="15vh" |
||||
width="40%" @keydown.enter.native="confirm"> |
||||
<ModifyForm ref="form" :param="dict" :rules="rules" :items="items" @confirm="confirm" @cancel="flag.modify = false"> |
||||
<template #code> |
||||
<NoobInput v-model="dict.code" full :placeholder="t('rule.pleaseEnter') + t('dict.prop.1')" |
||||
:disabled="!flag.add" /> |
||||
</template> |
||||
</ModifyForm> |
||||
</el-dialog> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
import { Api, PageExample, PageResult, ListTable, SearchRow, NoobInput, NoobSelect, TableAction, NoobTag, ModifyForm, Element } from "noob-mengyxu"; |
||||
import { useI18n } from "vue3-i18n"; |
||||
const { t } = useI18n(); |
||||
const { SimpleRequired } = Element; |
||||
const { state, commit, dispatch } = useStore(); |
||||
const { list, add, set, del } = Api.dictionary; |
||||
const result = ref(new PageResult()); |
||||
const example = reactive<any>(new PageExample()); |
||||
const flag = reactive({ |
||||
modify: false, |
||||
add: false |
||||
}) |
||||
const dict = ref<any>(); |
||||
const form = ref(); |
||||
|
||||
const props = [ |
||||
{ i18n: 'dict.prop.0', code: 'name', width: 180, align: 'left' }, |
||||
{ i18n: 'dict.prop.1', code: 'code', width: 180 }, |
||||
{ i18n: 'dict.prop.2', code: 'desc', width: 300 }, |
||||
{ i18n: 'dict.prop.3', code: 'status', slot: true, width: 120 }, |
||||
{ i18n: 'dict.prop.4', code: 'action', slot: true, type: 'action', width: 180, fixed: 'right' }, |
||||
] |
||||
|
||||
const items = [ |
||||
{ i18n: 'dict.prop.1', code: 'code', slot: true }, |
||||
{ i18n: 'dict.prop.0', code: 'name' }, |
||||
{ i18n: 'dict.prop.2', code: 'desc' }, |
||||
{ i18n: 'dict.prop.3', code: 'status', dict: 'active_status' }, |
||||
] |
||||
|
||||
const rules = { |
||||
code: [new SimpleRequired('dict.prop.1')], |
||||
name: [new SimpleRequired('dict.prop.0')], |
||||
status: [new SimpleRequired('dict.prop.3')] |
||||
} |
||||
|
||||
const query = () => { |
||||
list(example).then((rsp: any) => result.value = rsp) |
||||
} |
||||
|
||||
const addDict = (row) => { |
||||
form.value?.clearValidate(); |
||||
flag.modify = true; |
||||
flag.add = true; |
||||
dict.value = { status: 'A' } |
||||
row && (dict.value.parent = row.code); |
||||
} |
||||
|
||||
const modify = (row) => { |
||||
form.value?.clearValidate(); |
||||
flag.modify = true; |
||||
flag.add = false; |
||||
dict.value = JSON.parse(JSON.stringify(row)); |
||||
} |
||||
|
||||
const delate = (row) => { |
||||
Element.confirm(t('dict.delete.0'), t('dict.delete.1')).then(() => { |
||||
del(row).then(query); |
||||
}) |
||||
} |
||||
|
||||
const confirm = () => { |
||||
const api = flag.add ? add : set; |
||||
api(dict.value).then(rsp => { |
||||
if (rsp) { |
||||
query(); |
||||
flag.modify = false; |
||||
} |
||||
}) |
||||
} |
||||
|
||||
onMounted(() => { |
||||
query(); |
||||
}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
</style> |
||||
@ -0,0 +1,68 @@
@@ -0,0 +1,68 @@
|
||||
import Login from './login.vue'; |
||||
import Buffer from './buffer.vue'; |
||||
import Config from './config.vue'; |
||||
import Dictionary from './dictionary.vue'; |
||||
import Permission from './permission.vue'; |
||||
import Role from './role.vue'; |
||||
import Status from './status.vue'; |
||||
import Log from './log.vue'; |
||||
const routes = [ |
||||
{ |
||||
path: '/login', |
||||
name: 'login', |
||||
component: Login, |
||||
}, |
||||
{ |
||||
path: '/buffer', |
||||
name: 'buffer', |
||||
component: Buffer, |
||||
}, |
||||
{ |
||||
path: '/config', |
||||
name: 'config', |
||||
component: Config, |
||||
}, |
||||
{ |
||||
path: '/dictionary', |
||||
name: 'dictionary', |
||||
component: Dictionary, |
||||
}, |
||||
{ |
||||
path: '/permission', |
||||
name: 'permission', |
||||
component: Permission, |
||||
}, |
||||
{ |
||||
path: '/role', |
||||
name: 'role', |
||||
component: Role, |
||||
}, |
||||
{ |
||||
path: '/status', |
||||
name: 'status', |
||||
component: Status, |
||||
}, |
||||
{ |
||||
path: '/log', |
||||
name: 'log', |
||||
component: Log, |
||||
}, |
||||
]; |
||||
const menus = { |
||||
buff: { i18n: 'preMenu.operator.0', path: 'buffer', icon: 'Warning' }, |
||||
config: { i18n: 'preMenu.operator.1', path: 'config', icon: 'EditPen' }, |
||||
dictionary: { |
||||
i18n: 'preMenu.operator.2', |
||||
path: 'dictionary', |
||||
icon: 'Collection', |
||||
}, |
||||
permission: { |
||||
i18n: 'preMenu.operator.3', |
||||
path: 'permission', |
||||
icon: 'Unlock', |
||||
}, |
||||
role: { i18n: 'preMenu.operator.4', path: 'role', icon: 'User' }, |
||||
status: { i18n: 'preMenu.operator.5', path: 'status', icon: 'Setting' }, |
||||
log: { i18n: 'preMenu.operator.6', path: 'log', icon: 'Document' }, |
||||
}; |
||||
export default { routes, menus }; |
||||
@ -0,0 +1,43 @@
@@ -0,0 +1,43 @@
|
||||
<template> |
||||
<SearchRow :title="t('log.title')" :add="false" :del="false" @query="query"> |
||||
<NoobInput v-model="example.userId" :placeholder="t('log.prop.1')" /> |
||||
<NoobDate v-model="example.startTime" :placeholder="t('log.start')" /> |
||||
<NoobDate v-model="example.stopTime" :placeholder="t('log.stop')" /> |
||||
</SearchRow> |
||||
<ListTable @query="query" :props="props" :example="example" :page="true" :data="result"></ListTable> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
import { Api, PageExample, PageResult, ListTable, SearchRow, NoobInput, NoobDate } from "noob-mengyxu"; |
||||
import { useI18n } from "vue3-i18n"; |
||||
const { t } = useI18n(); |
||||
|
||||
const { state, commit, dispatch } = useStore(); |
||||
const { list } = Api.log; |
||||
const result = ref(new PageResult()); |
||||
const example = reactive<any>(new PageExample()); |
||||
|
||||
const props = [ |
||||
{ i18n: 'log.prop.0', type: 'index', width: 80 }, |
||||
{ i18n: 'log.prop.1', code: 'userId', width: 120 }, |
||||
{ i18n: 'log.prop.2', code: 'module', width: 120, dict: 'log_module' }, |
||||
{ i18n: 'log.prop.3', code: 'type', width: 150, dict: 'log_type' }, |
||||
{ i18n: 'log.prop.4', code: 'time', width: 150 }, |
||||
{ i18n: 'log.prop.5', code: 'loginIp', width: 180 }, |
||||
{ i18n: 'log.prop.6', code: 'context', width: 300 } |
||||
] |
||||
|
||||
const query = () => { |
||||
list(example).then((rsp: any) => result.value = rsp) |
||||
} |
||||
|
||||
onMounted(() => { |
||||
dispatch('getDictMap', ['log_module', 'log_type']) |
||||
query(); |
||||
}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
</style> |
||||
@ -0,0 +1,56 @@
@@ -0,0 +1,56 @@
|
||||
<template> |
||||
<div class="login"> |
||||
<LoginForm @login="login"> |
||||
</LoginForm> |
||||
</div> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { onBeforeMount, reactive, ref } from "vue"; |
||||
import { useStore } from "vuex"; |
||||
import { useRouter } from "vue-router"; |
||||
import md5 from "js-md5"; |
||||
import { Api, LoginForm } from "noob-mengyxu"; |
||||
|
||||
const { state, commit } = useStore(); |
||||
const router = useRouter(); |
||||
|
||||
onBeforeMount(() => { |
||||
state.size.headHeight = '0px'; |
||||
state.size.asideWidth = '0px'; |
||||
commit("initSize"); |
||||
}); |
||||
|
||||
const login = user => { |
||||
const param = JSON.parse(JSON.stringify(user)); |
||||
param.password = md5(param.password); |
||||
Api.pub.login(param).then(rsp => { |
||||
if (rsp) { |
||||
state.size.headHeight = state.size.head + 'px'; |
||||
state.size.asideWidth = state.size.aside + 'px'; |
||||
commit("initSize"); |
||||
router.push('/') |
||||
} |
||||
}) |
||||
}; |
||||
</script> |
||||
<style lang='scss' scoped> |
||||
//@import url(); 引入公共css类 |
||||
.login { |
||||
width: 100%; |
||||
height: 100%; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
} |
||||
|
||||
.canvas { |
||||
position: fixed; |
||||
z-index: -1; // background-color: black; |
||||
} |
||||
|
||||
.logo { |
||||
width: 300px; |
||||
height: 90px; |
||||
} |
||||
</style> |
||||
@ -0,0 +1,136 @@
@@ -0,0 +1,136 @@
|
||||
<template> |
||||
<SearchRow :title="t('permission.title')" :del="false" @query="query" @add="addPermission"> |
||||
<NoobInput v-model="example.code" :placeholder="t('permission.example.0')"></NoobInput> |
||||
</SearchRow> |
||||
<ListTable @query="query" :props="props" :example="example" :page="true" :data="result" rowKey="id" |
||||
:treeProps="{ children: 'children' }"> |
||||
<template #status="{ row }"> |
||||
<div slot="reference" class="name-wrapper"> |
||||
<NoobTag v-if="row.status == 'A'"> |
||||
{{ t('base.active') }} |
||||
</NoobTag> |
||||
<NoobTag v-else type="danger"> |
||||
{{ t('base.inactive') }} |
||||
</NoobTag> |
||||
</div> |
||||
</template> |
||||
<template #action="{ row }"> |
||||
<TableAction :add="row.parent == null" @modify="modify(row)" @del="delate(row)" @add="addPermission(row)" /> |
||||
</template> |
||||
</ListTable> |
||||
|
||||
<el-dialog :title="t('base.add') + t('permission.name')" v-model="flag.modify" :close-on-click-modal="false" top="15vh" |
||||
width="40%" @keydown.enter.native="confirm"> |
||||
<ModifyForm ref="form" :param="permission" :rules="rules" :items="items" @confirm="confirm" :width="100" |
||||
@cancel="flag.modify = false"> |
||||
<template #id> |
||||
<NoobInput v-model="permission.id" full :placeholder="t('rule.pleaseEnter') + t('permission.prop.1')" |
||||
:disabled="!flag.add" /> |
||||
</template> |
||||
<template #perOrder> |
||||
<NoobSelect v-model="permission.perOrder" full :max-value="99" |
||||
:placeholder="t('rule.pleaseSelect') + t('permission.prop.4')" /> |
||||
</template> |
||||
</ModifyForm> |
||||
</el-dialog> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
import { Api, PageExample, PageResult, ListTable, SearchRow, NoobInput, TableAction, NoobTag, NoobSelect, ModifyForm, Element } from "noob-mengyxu"; |
||||
import { useI18n } from "vue3-i18n"; |
||||
const { t } = useI18n(); |
||||
const { SimpleRequired } = Element; |
||||
const { state, dispatch } = useStore(); |
||||
const { list, add, set, del } = Api.dictionary; |
||||
const result = ref(new PageResult()); |
||||
const example = reactive<any>(new PageExample()); |
||||
const flag = reactive({ |
||||
modify: false, |
||||
add: false |
||||
}) |
||||
const permission = ref<any>(); |
||||
const form = ref(); |
||||
const order = 99; |
||||
const nodeLevel = { |
||||
module: 'group', |
||||
group: 'view', |
||||
view: 'action' |
||||
}; |
||||
|
||||
const props = [ |
||||
{ i18n: 'permission.prop.0', code: 'name', width: 200, align: 'left', fixed: "left" }, |
||||
{ i18n: 'permission.prop.1', code: 'id', width: 220 }, |
||||
{ i18n: 'permission.prop.2', code: 'desc', slot: true, width: 80 }, |
||||
{ i18n: 'permission.prop.3', code: 'perLevel', dict: 'per_level', width: 80 }, |
||||
{ i18n: 'permission.prop.4', code: 'perOrder', width: 80 }, |
||||
{ i18n: 'permission.prop.5', code: 'status', dict: 'able_status', width: 80 }, |
||||
{ i18n: 'permission.prop.6', code: 'perContent', width: 230 }, |
||||
{ i18n: 'permission.prop.7', code: 'action', slot: true, type: 'action', width: 180, fixed: 'right' }, |
||||
] |
||||
|
||||
const items = [ |
||||
{ i18n: 'permission.prop.1', code: 'id', slot: true }, |
||||
{ i18n: 'permission.parent', code: 'perParent', disabled: true }, |
||||
{ i18n: 'permission.prop.3', code: 'perLevel', dict: 'per_level', disabled: true }, |
||||
{ i18n: 'permission.prop.0', code: 'name' }, |
||||
{ i18n: 'permission.prop.6', code: 'perContent' }, |
||||
{ i18n: 'permission.prop.2', code: 'desc' }, |
||||
{ i18n: 'permission.prop.4', code: 'perOrder', slot: true }, |
||||
{ i18n: 'permission.prop.5', code: 'perStatus', dict: 'able_status' }, |
||||
] |
||||
|
||||
const rules = { |
||||
id: [new SimpleRequired('dict.prop.1')], |
||||
name: [new SimpleRequired('dict.prop.0')], |
||||
} |
||||
|
||||
const query = () => { |
||||
list(example).then((rsp: any) => result.value = rsp) |
||||
} |
||||
|
||||
const addPermission = (row) => { |
||||
permission.value = { perStatus: 'A' } |
||||
if (row) { |
||||
permission.value.perParent = row.id |
||||
permission.value.perLevel = nodeLevel[row.perLevel] |
||||
} else { |
||||
permission.value.perLevel = 'group'; |
||||
} |
||||
form.value?.clearValidate(); |
||||
flag.modify = true; |
||||
flag.add = true; |
||||
} |
||||
|
||||
const modify = (row) => { |
||||
permission.value = JSON.parse(JSON.stringify(row)); |
||||
form.value?.clearValidate(); |
||||
flag.modify = true; |
||||
flag.add = false; |
||||
} |
||||
|
||||
const delate = (row) => { |
||||
Element.confirm(t('dict.delete.0'), t('dict.delete.1')).then(() => { |
||||
del(row).then(query); |
||||
}) |
||||
} |
||||
|
||||
const confirm = () => { |
||||
const api = flag.add ? add : set; |
||||
api(permission.value).then(rsp => { |
||||
if (rsp) { |
||||
query(); |
||||
flag.modify = false; |
||||
} |
||||
}) |
||||
} |
||||
|
||||
onMounted(() => { |
||||
dispatch('getDictMap', ['per_level', 'able_status']) |
||||
query(); |
||||
}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
</style> |
||||
@ -0,0 +1,14 @@
@@ -0,0 +1,14 @@
|
||||
<template> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
|
||||
const { state, commit, dispatch } = useStore(); |
||||
|
||||
onMounted(() => {}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
</style> |
||||
@ -0,0 +1,14 @@
@@ -0,0 +1,14 @@
|
||||
<template> |
||||
</template> |
||||
|
||||
<script lang="ts" setup> |
||||
import { useStore } from "vuex"; |
||||
import { reactive, onMounted, ref } from "vue"; |
||||
|
||||
const { state, commit, dispatch } = useStore(); |
||||
|
||||
onMounted(() => {}); |
||||
</script> |
||||
<style lang="scss" scoped> |
||||
//@import url(); 引入公共css类 |
||||
</style> |
||||
@ -0,0 +1,66 @@
@@ -0,0 +1,66 @@
|
||||
import { get, post, put, delate } from '../http/axios'; |
||||
const root = 'memory/buffer'; |
||||
|
||||
export const list = () => { |
||||
return new Promise((resolve, reject) => { |
||||
get(root).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve([]); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve([]); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const clean = () => { |
||||
return new Promise((resolve, reject) => { |
||||
delate(root).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const set = (buffer) => { |
||||
return new Promise((resolve, reject) => { |
||||
put(root, buffer).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} |
||||
}, |
||||
(err) => {} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const del = (buffer) => { |
||||
return new Promise((resolve, reject) => { |
||||
delate(root + '/' + buffer.key).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
@ -0,0 +1,72 @@
@@ -0,0 +1,72 @@
|
||||
import { get, post, put, delate } from '../http/axios'; |
||||
import { PageResult } from '../constant'; |
||||
const pageResult = new PageResult(); |
||||
const root = 'dict'; |
||||
|
||||
export const list = (example) => { |
||||
return new Promise((resolve, reject) => { |
||||
get(root, example).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(pageResult); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(pageResult); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const add = (dictionary) => { |
||||
return new Promise((resolve, reject) => { |
||||
post(root, dictionary).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const set = (dictionary) => { |
||||
return new Promise((resolve, reject) => { |
||||
put(root, dictionary).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const del = (dictionary) => { |
||||
return new Promise((resolve, reject) => { |
||||
delate(root, dictionary).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
@ -0,0 +1,5 @@
@@ -0,0 +1,5 @@
|
||||
export * as dictionary from './dictionary'; |
||||
export * as log from './log'; |
||||
export * as permission from './permission'; |
||||
export * as buffer from './buffer'; |
||||
export * as pub from './public'; |
||||
@ -0,0 +1,20 @@
@@ -0,0 +1,20 @@
|
||||
import { get } from '../http/axios'; |
||||
import { PageResult } from '../constant'; |
||||
const pageResult = new PageResult(); |
||||
const root = 'log/action'; |
||||
export const list = (example) => { |
||||
return new Promise((resolve, reject) => { |
||||
get(root, example).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(pageResult); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(pageResult); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
@ -0,0 +1,72 @@
@@ -0,0 +1,72 @@
|
||||
import { get, post, put, delate } from '../http/axios'; |
||||
import { PageResult } from '../constant'; |
||||
const pageResult = new PageResult(); |
||||
const root = 'permission'; |
||||
|
||||
export const list = (example) => { |
||||
return new Promise((resolve, reject) => { |
||||
get(root, example).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(pageResult); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(pageResult); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const add = (dictionary) => { |
||||
return new Promise((resolve, reject) => { |
||||
post(root, dictionary).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const set = (dictionary) => { |
||||
return new Promise((resolve, reject) => { |
||||
put(root, dictionary).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const del = (dictionary) => { |
||||
return new Promise((resolve, reject) => { |
||||
delate(root, dictionary).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
@ -0,0 +1,67 @@
@@ -0,0 +1,67 @@
|
||||
import { get, post, put, delate } from '../http/axios'; |
||||
const urls = { |
||||
dict: 'public/dict', |
||||
info: 'public/info', |
||||
login: 'public/login', |
||||
logout: 'public/logout', |
||||
}; |
||||
|
||||
export const getByCodes = (codes) => { |
||||
return new Promise((resolve, reject) => { |
||||
get(urls.dict, codes).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const getInfo = () => { |
||||
return new Promise((resolve, reject) => { |
||||
get(urls.info, null, true, true).then( |
||||
(rsp: any) => { |
||||
if (rsp) { |
||||
resolve(rsp); |
||||
} else { |
||||
resolve(false); |
||||
} |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const login = (user) => { |
||||
return new Promise((resolve, reject) => { |
||||
post(urls.login, user).then( |
||||
(rsp: any) => { |
||||
resolve(rsp); |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
|
||||
export const logout = () => { |
||||
return new Promise((resolve, reject) => { |
||||
put(urls.logout).then( |
||||
(rsp: any) => { |
||||
resolve(rsp); |
||||
}, |
||||
(err) => { |
||||
resolve(false); |
||||
} |
||||
); |
||||
}); |
||||
}; |
||||
@ -1,3 +1,2 @@
@@ -1,3 +1,2 @@
|
||||
export * as styles from './styles'; |
||||
export * as size from './size'; |
||||
export * as lang from './language'; |
||||
export * as Styles from './styles'; |
||||
export * as Size from './size'; |
||||
|
||||
@ -1,32 +0,0 @@
@@ -1,32 +0,0 @@
|
||||
export default class Chinese { |
||||
title = 'XXX管理系统'; |
||||
language = '语言'; |
||||
confirm = '确认'; |
||||
cancel = '取消'; |
||||
pleaseEnter = '请输入'; |
||||
notBeNull = '这里不能为空'; |
||||
pleaseSelect = '请选择'; |
||||
|
||||
changePwd = '修改密码'; |
||||
pwd = '密码'; |
||||
oldPwd = '旧密码'; |
||||
newPwd = '新密码'; |
||||
rePwd = '确认密码'; |
||||
plsRePwd = '请再次输入新密码'; |
||||
rePwdError = '两次输入密码不一致'; |
||||
|
||||
logout = '退出登录'; |
||||
fullScreen = '切换全屏'; |
||||
changeStyle = '切换主题'; |
||||
default = '默认'; |
||||
light = '明亮'; |
||||
dark = '黑夜'; |
||||
|
||||
color = '颜色'; |
||||
size = '尺寸'; |
||||
normal = '正常'; |
||||
small = '小'; |
||||
large = '大'; |
||||
|
||||
connect = '拼命连接中'; |
||||
} |
||||
@ -1,31 +0,0 @@
@@ -1,31 +0,0 @@
|
||||
export default class English { |
||||
title = 'XXX System'; |
||||
language = 'Language'; |
||||
confirm = 'Confirm'; |
||||
cancel = 'Cancel'; |
||||
pleaseEnter = 'Please enter '; |
||||
notBeNull = 'There cannot be empty'; |
||||
pleaseSelect = 'Please select'; |
||||
|
||||
changePwd = 'Change password'; |
||||
pwd = 'Password'; |
||||
oldPwd = 'Old password'; |
||||
newPwd = 'New password'; |
||||
rePwd = 'Repeat password'; |
||||
plsRePwd = 'Please enter the new password again'; |
||||
rePwdError = 'The password is entered twice inconsistently'; |
||||
|
||||
logout = 'Logout'; |
||||
fullScreen = 'Toggle full screen'; |
||||
changeStyle = 'Switch themes'; |
||||
default = 'Default'; |
||||
light = 'Lignt'; |
||||
dark = 'Dark'; |
||||
color = 'Color'; |
||||
size = 'Size'; |
||||
normal = 'Normal'; |
||||
small = 'Small'; |
||||
large = 'Large'; |
||||
|
||||
connect = 'Desperately connected'; |
||||
} |
||||
@ -1,8 +0,0 @@
@@ -1,8 +0,0 @@
|
||||
import Chinese from './chinese'; |
||||
import English from './english'; |
||||
|
||||
const chinese = new Chinese(); |
||||
const english = new English(); |
||||
|
||||
export { chinese, english }; |
||||
|
||||
@ -1,7 +1,6 @@
@@ -1,7 +1,6 @@
|
||||
import Normal from './normal'; |
||||
import Small from './small'; |
||||
import Large from './large'; |
||||
const normal = new Normal(); |
||||
const small = new Small(); |
||||
const large = new Large(); |
||||
export { normal, small, large }; |
||||
export const normal = new Normal(); |
||||
export const small = new Small(); |
||||
export const large = new Large(); |
||||
|
||||
@ -1,16 +1,19 @@
@@ -1,16 +1,19 @@
|
||||
export default class Small { |
||||
import Normal from './normal'; |
||||
export default class Small extends Normal { |
||||
head = 60; |
||||
aside = 200; |
||||
size = 'large'; //总体尺寸
|
||||
head: Number = 60; |
||||
aside: Number = 200; |
||||
|
||||
fontSize = '18px'; |
||||
titleSize = '20px'; |
||||
headIconSize = '24px'; |
||||
fontSize = '18px'; //总体字体尺寸
|
||||
titleSize = '20px'; //标题字体尺寸
|
||||
headIconSize = '24px'; //头部图标尺寸
|
||||
headHeight = '60px'; //头部高度
|
||||
headMenuWidth = '350px'; //头部右侧菜单宽度
|
||||
asideWidth = '200px'; //左侧菜单宽度
|
||||
mainPad = '8px'; |
||||
|
||||
menuIconSize = '20px'; |
||||
|
||||
searchRowHeight = '45px'; |
||||
searchRowPad = '12px'; |
||||
searchMargin = '15px'; |
||||
searchRowHeight = '45px'; //查询行高
|
||||
searchRowPad = '12px'; //查询行内间距
|
||||
searchWidth = '190px'; //查询元素默认宽度
|
||||
} |
||||
|
||||
@ -1,16 +1,27 @@
@@ -1,16 +1,27 @@
|
||||
export default class Normal { |
||||
head = 50; |
||||
aside = 180; |
||||
size = 'default'; //总体尺寸
|
||||
head: Number = 50; |
||||
aside: Number = 180; |
||||
|
||||
fontSize = '16px'; |
||||
titleSize = '18px'; |
||||
headIconSize = '20px'; |
||||
fontSize = '16px'; //总体字体尺寸
|
||||
titleSize = '18px'; //标题字体尺寸
|
||||
headIconSize = '20px'; //头部图标尺寸
|
||||
headHeight = '50px'; //头部高度
|
||||
headMenuWidth = '300px'; //头部右侧菜单宽度
|
||||
asideWidth = '180px'; //左侧菜单宽度
|
||||
mainHeight = ''; //通用页面组件高度
|
||||
mainPad = '5px'; //通用页面组件内边距
|
||||
|
||||
menuIconSize = '18px'; |
||||
|
||||
loginHeight = '350px'; |
||||
loginWidth = '450px'; |
||||
|
||||
searchRowHeight = '40px'; //查询行高
|
||||
searchRowPad = '10px'; //查询行内间距
|
||||
searchMargin = '15px'; //查询元素水平间距
|
||||
searchWidth = '170px'; //查询元素默认宽度
|
||||
|
||||
searchRowHeight = '40px'; |
||||
searchRowPad = '10px'; |
||||
searchMargin = '15px'; |
||||
tableHeight = 0; //表格默认高度
|
||||
pTableHeight = 0; //带分页表格默认高度
|
||||
pageHeight = 36; //分页插件高度
|
||||
} |
||||
|
||||
@ -1,16 +1,21 @@
@@ -1,16 +1,21 @@
|
||||
export default class Small { |
||||
import Normal from './normal'; |
||||
export default class Small extends Normal { |
||||
head = 45; |
||||
aside = 160; |
||||
size = 'small'; //总体尺寸
|
||||
head: Number = 45; |
||||
aside: Number = 160; |
||||
|
||||
fontSize = '14px'; |
||||
titleSize = '16px'; |
||||
headIconSize = '16px'; |
||||
fontSize = '14px'; //总体字体尺寸
|
||||
titleSize = '16px'; //标题字体尺寸
|
||||
headIconSize = '16px'; //头部图标尺寸
|
||||
headHeight = '45px'; //头部高度
|
||||
headMenuWidth = '250px'; //头部右侧菜单宽度
|
||||
asideWidth = '160px'; //左侧菜单宽度
|
||||
|
||||
searchRowHeight = '35px'; |
||||
searchRowPad = '7px'; |
||||
searchMargin = '10px'; |
||||
menuIconSize = '16px'; |
||||
|
||||
searchRowHeight = '35px'; //表格查询行高
|
||||
searchRowPad = '7px'; //查询行内间距
|
||||
searchMargin = '10px'; //查询元素水平间距
|
||||
searchWidth = '150px'; //查询元素默认宽度
|
||||
|
||||
pageHeight = 28; //分页插件高度
|
||||
} |
||||
|
||||
@ -1,7 +1,6 @@
@@ -1,7 +1,6 @@
|
||||
import NoobStyle from './noob'; |
||||
import Plain from './plain'; |
||||
import Light from './light'; |
||||
import Dark from './dark'; |
||||
const noobStyle = new NoobStyle(); |
||||
const light = new Light(); |
||||
const dark = new Dark(); |
||||
export { noobStyle, light, dark }; |
||||
export const plain = new Plain(); |
||||
export const light = new Light(); |
||||
export const dark = new Dark(); |
||||
|
||||
@ -0,0 +1,8 @@
@@ -0,0 +1,8 @@
|
||||
export class PageResult { |
||||
data = []; |
||||
total = 0; |
||||
} |
||||
export class PageExample { |
||||
page = 1; |
||||
size = 20; |
||||
} |
||||
@ -0,0 +1,29 @@
@@ -0,0 +1,29 @@
|
||||
import { useStore } from 'vuex'; |
||||
|
||||
const { state } = useStore(); |
||||
export const getValue = ( |
||||
row: any, |
||||
column: string, |
||||
value: any, |
||||
index?: number |
||||
) => { |
||||
if ((value == null || value == '') && value !== 0) { |
||||
return '--'; |
||||
} |
||||
return value; |
||||
}; |
||||
|
||||
export const formatter = (row: any, column: any, value: any, index: number) => { |
||||
return formatterByDist(row.scheme + '-' + column.property, value); |
||||
}; |
||||
|
||||
export const formatterByDist = (dictKey, value) => { |
||||
if (!dictKey) { |
||||
return getValue(null, '', value); |
||||
} |
||||
const mapping = state.dict[dictKey]; |
||||
if (mapping == null) { |
||||
return getValue(null, '', value); |
||||
} |
||||
return mapping[value] == null ? value : mapping[value]; |
||||
}; |
||||
@ -0,0 +1,226 @@
@@ -0,0 +1,226 @@
|
||||
/* eslint-disable */ |
||||
import axios from 'axios'; |
||||
import { loading, close, showMessage } from '../element'; |
||||
import { i18n } from '../i18n'; |
||||
const t = i18n.t; |
||||
|
||||
const config = { |
||||
baseURL: process.env.VUE_APP_BASE_URL ? '/api' : '', |
||||
timeout: 60 * 1000, |
||||
withCredentials: true, // Check cross-site Access-Control
|
||||
}; |
||||
|
||||
const _axios = axios.create(config); |
||||
_axios.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8'; |
||||
_axios.defaults.headers.put['Content-Type'] = 'application/json;charset=UTF-8'; |
||||
_axios.defaults.headers.delete['Content-Type'] = |
||||
'application/json;charset=UTF-8'; |
||||
|
||||
export const registerBaseUrl = (url) => { |
||||
_axios.defaults.baseURL = url; |
||||
}; |
||||
|
||||
// Add a request interceptor
|
||||
_axios.interceptors.request.use( |
||||
function (config) { |
||||
const time = new Date().getTime().toString(); |
||||
const params = config.params; |
||||
if (params) { |
||||
delEmpty(params); |
||||
params.t = time; |
||||
} |
||||
const data = config.data; |
||||
if (data != null && typeof data === 'object') { |
||||
delEmpty(data); |
||||
data.t = time; |
||||
} |
||||
return config; |
||||
}, |
||||
function (error) { |
||||
return Promise.reject(error); |
||||
} |
||||
); |
||||
|
||||
function delEmpty(data) { |
||||
if (data) { |
||||
for (const item in data) { |
||||
if (data.hasOwnProperty(item)) { |
||||
const val = data[item]; |
||||
if ((val == null || val == 'null' || val == '') && val !== 0) { |
||||
delete data[item]; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
|
||||
// Add a response interceptor
|
||||
_axios.interceptors.response.use( |
||||
function (response) { |
||||
return response.data; |
||||
}, |
||||
function (error) { |
||||
return Promise.reject(error); |
||||
} |
||||
); |
||||
|
||||
export function post(url, data?, noMsg?, noLoading?) { |
||||
return new Promise((resolve, reject) => { |
||||
if (!noLoading) { |
||||
loading(); |
||||
} |
||||
_axios.post(url, data).then( |
||||
(response: any) => { |
||||
handResponse(response, resolve, noMsg, noLoading); |
||||
}, |
||||
(err) => { |
||||
handError(err, reject, noMsg, noLoading); |
||||
} |
||||
); |
||||
}); |
||||
} |
||||
|
||||
export function get(url, data?, noMsg?, noLoading?) { |
||||
return new Promise((resolve, reject) => { |
||||
if (!noLoading) { |
||||
loading(); |
||||
} |
||||
_axios.get(url, { params: data }).then( |
||||
(response: any) => { |
||||
handResponse(response, resolve, noMsg, noLoading); |
||||
}, |
||||
(err) => { |
||||
handError(err, reject, noMsg, noLoading); |
||||
} |
||||
); |
||||
}); |
||||
} |
||||
|
||||
export function put(url, data?, noMsg?, noLoading?) { |
||||
return new Promise((resolve, reject) => { |
||||
if (!noLoading) { |
||||
loading(); |
||||
} |
||||
_axios.put(url, data).then( |
||||
(response: any) => { |
||||
handResponse(response, resolve, noMsg, noLoading); |
||||
}, |
||||
(err) => { |
||||
handError(err, reject, noMsg, noLoading); |
||||
} |
||||
); |
||||
}); |
||||
} |
||||
|
||||
export function delate(url, data?, noMsg?, noLoading?) { |
||||
return new Promise((resolve, reject) => { |
||||
if (!noLoading) { |
||||
loading(); |
||||
} |
||||
_axios({ |
||||
method: 'delete', |
||||
url: url, |
||||
data: data, |
||||
}).then( |
||||
(response: any) => { |
||||
handResponse(response, resolve, noMsg, noLoading); |
||||
}, |
||||
(err) => { |
||||
handError(err, reject, noMsg, noLoading); |
||||
} |
||||
); |
||||
}); |
||||
} |
||||
|
||||
function handResponse(response, resolve, noMsg, noLoading) { |
||||
if (!noLoading) { |
||||
close(); |
||||
} |
||||
resolve(response); |
||||
} |
||||
|
||||
function handError(err, reject, noMsg, noLoading) { |
||||
if (!noLoading) { |
||||
close(); |
||||
} |
||||
if (!noMsg) { |
||||
showMessage('error', t('http.error'), false); |
||||
} |
||||
reject(err); |
||||
} |
||||
|
||||
export function upload(file, url, data) { |
||||
return new Promise((resolve, reject) => { |
||||
let param = new FormData(); // 创建form对象
|
||||
param.append('file', file); // 通过append向form对象添加数据
|
||||
if (data) { |
||||
for (const item in data) { |
||||
if (data.hasOwnProperty(item)) { |
||||
param.append(item, data[item]); // 添加form表单中其他数据
|
||||
} |
||||
} |
||||
} |
||||
let config = { |
||||
headers: { 'Content-Type': 'multipart/form-data' }, |
||||
}; |
||||
_axios.post(url, param, config).then( |
||||
(response) => { |
||||
handResponse(response, resolve, false, false); |
||||
}, |
||||
(err) => { |
||||
handError(err, reject, false, false); |
||||
} |
||||
); |
||||
}); |
||||
} |
||||
|
||||
export function download(fileName, url, data = {}, callBack?) { |
||||
loading(); |
||||
_axios({ |
||||
method: 'get', |
||||
url: url, // 请求地址
|
||||
params: data, // 参数
|
||||
responseType: 'blob', // 表明返回服务器返回的数据类型
|
||||
}).then( |
||||
(response: any) => { |
||||
close(); |
||||
const reader = new FileReader() as any; |
||||
reader.readAsText(response); |
||||
reader.onload = function () { |
||||
try { |
||||
const result = JSON.parse(reader.result); |
||||
if (typeof result === 'object') { |
||||
showMessage('error', result.message, false); |
||||
if (callBack != null) { |
||||
callBack(false); |
||||
} |
||||
return; |
||||
} |
||||
} catch (err) {} |
||||
const blob = new Blob([response], { |
||||
type: 'application/octet-stream', |
||||
}); |
||||
const navigator = window.navigator as any; |
||||
if (navigator.msSaveOrOpenBlob) { |
||||
navigator.msSaveBlob(blob, fileName); |
||||
} else { |
||||
const link = document.createElement('a'); |
||||
link.href = window.URL.createObjectURL(blob); |
||||
link.download = fileName; |
||||
link.click(); |
||||
window.URL.revokeObjectURL(link.href); |
||||
} |
||||
if (callBack != null) { |
||||
callBack(true); |
||||
} |
||||
}; |
||||
}, |
||||
(err) => { |
||||
close(); |
||||
showMessage('error', t('http.downFail')); |
||||
if (callBack != null) { |
||||
callBack(false); |
||||
} |
||||
} |
||||
); |
||||
} |
||||
@ -0,0 +1,2 @@
@@ -0,0 +1,2 @@
|
||||
export * as Axios from './axios'; |
||||
export * as Axios2 from './axios2'; |
||||
@ -0,0 +1,150 @@
@@ -0,0 +1,150 @@
|
||||
export default class English { |
||||
title = 'XXX SYSTEM'; |
||||
|
||||
base = { |
||||
color: 'Color', |
||||
add: 'Add', |
||||
delete: 'Delete', |
||||
modify: 'Modify', |
||||
stop: 'Stop', |
||||
select: 'Select', |
||||
confirm: 'Confirm', |
||||
cancel: 'Cancel', |
||||
loading: 'Loading...', |
||||
active: 'Active', |
||||
inactive: 'Inactive', |
||||
key: 'Key', |
||||
value: 'Value', |
||||
}; |
||||
|
||||
pwd = { |
||||
login: 'login', |
||||
userId: 'User name', |
||||
changePwd: 'Change password', |
||||
pwd: 'Password', |
||||
oldPwd: 'Old password', |
||||
newPwd: 'New password', |
||||
rePwd: 'Repeat password', |
||||
plsRePwd: 'Please enter the new password again', |
||||
rePwdError: 'The password is entered twice inconsistently', |
||||
length: 'The password length is: {0}~{1} characters', |
||||
noSpace: 'The password cannot contain spaces', |
||||
required: |
||||
'The password contains at least uppercase and lowercase letters and numbers', |
||||
}; |
||||
|
||||
head = { |
||||
center: 'Personal center', |
||||
logout: 'Logout', |
||||
fullScreen: 'Toggle full screen', |
||||
changeStyle: 'Switch themes', |
||||
default: 'Default', |
||||
light: 'Lignt', |
||||
dark: 'Dark', |
||||
language: 'Language', |
||||
zh: 'Chinese', |
||||
en: 'English', |
||||
size: 'Size', |
||||
normal: 'Normal', |
||||
small: 'Small', |
||||
large: 'Large', |
||||
}; |
||||
|
||||
tool = { |
||||
colorCpar: 'Color Comparator', |
||||
connect: 'Desperately connected', |
||||
}; |
||||
|
||||
rule = { |
||||
pleaseEnter: 'Please enter ', |
||||
notNull: 'There cannot be empty', |
||||
pleaseSelect: 'Please select', |
||||
formatErr: 'The input format is incorrect', |
||||
int: 'Number', |
||||
max: 'The max value is {0}', |
||||
min: 'The min value is {0}', |
||||
maxLen: 'Enter up to {0} character', |
||||
minLen: 'Enter a minimum of {0} character', |
||||
hexadecimal: 'Please enter hexadecimal digits', |
||||
idCard: { |
||||
format: 'The ID card is wrong in length or format', |
||||
area: 'The ID area is illegal', |
||||
birth: 'The date of birth on the ID card is illegal', |
||||
error: 'The ID number is illegal', |
||||
}, |
||||
}; |
||||
|
||||
http = { |
||||
unPermission: |
||||
'You do not have access yet, please contact your administrator to add it', |
||||
noPermission: |
||||
'This permission is not yet open, do not access without permission', |
||||
error: 'Network error', |
||||
downFail: 'Download failed with network abnormality！', |
||||
}; |
||||
|
||||
preMenu = { |
||||
operator: [ |
||||
'Buffer', |
||||
'Config', |
||||
'Dictionary', |
||||
'Permission', |
||||
'Role', |
||||
'Status', |
||||
'Log', |
||||
], |
||||
}; |
||||
|
||||
log = { |
||||
title: 'Action log list', |
||||
prop: [ |
||||
'Sequence', |
||||
'Action user', |
||||
'Log module', |
||||
'Action type', |
||||
'Action time', |
||||
'Login IP', |
||||
'Log content', |
||||
], |
||||
start: 'Start time', |
||||
stop: 'Stop time', |
||||
}; |
||||
|
||||
dict = { |
||||
title: 'Dictionary manage', |
||||
name: ' type/dictionary', |
||||
prop: ['Name', 'Code', 'Description', 'Status', 'Action'], |
||||
example: ['Type name(Fuzzy queries)', 'Type code', 'Status'], |
||||
delete: [ |
||||
'Confirm whether to delete the dictionary/dictionary type (deleting a dictionary type deletes all dictionaries under that type)?', |
||||
'Tips', |
||||
], |
||||
}; |
||||
|
||||
permission = { |
||||
title: 'Permission manage', |
||||
name: 'permission', |
||||
parent: 'Permission parent', |
||||
prop: [ |
||||
'Name', |
||||
'Code', |
||||
'Icon', |
||||
'Level', |
||||
'Priority', |
||||
'Status', |
||||
'Content', |
||||
'Action', |
||||
], |
||||
example: ['Permission code'], |
||||
delete: ['Are you sure you want to remove the permission?', 'Tips'], |
||||
}; |
||||
|
||||
buffer = { |
||||
title: '缓存管理', |
||||
clean: '清空失效缓存', |
||||
modify: '修改有效期', |
||||
prop: ['缓存值', '唯一键', '是否有效', '失效时间', '操作'], |
||||
delete: ['确定要删除此条缓存吗？', '提示'], |
||||
delay: ['请输入失效时间(yyyy-MM-dd HH:mm:ss)', '修改'], |
||||
}; |
||||
} |
||||
@ -0,0 +1,17 @@
@@ -0,0 +1,17 @@
|
||||
import { createI18n } from 'vue3-i18n'; |
||||
import Zh from './zh'; |
||||
import En from './en'; |
||||
|
||||
const messages = { |
||||
zh: new Zh(), |
||||
en: new En(), |
||||
}; |
||||
const i18n = createI18n({ |
||||
locale: 'zh', |
||||
messages, |
||||
}); |
||||
const registerLang = (name, data) => { |
||||
messages[name] = data; |
||||
}; |
||||
|
||||
export { i18n, Zh, En, registerLang }; |
||||
@ -0,0 +1,147 @@
@@ -0,0 +1,147 @@
|
||||
export default class Zh { |
||||
title = 'XXX管理系统'; |
||||
|
||||
base = { |
||||
color: '颜色', |
||||
add: '添加', |
||||
delete: '删除', |
||||
modify: '修改', |
||||
stop: '停止', |
||||
select: '查询', |
||||
confirm: '确认', |
||||
cancel: '取消', |
||||
loading: '加载中...', |
||||
active: '生效', |
||||
inactive: '无效', |
||||
key: '键', |
||||
value: '值', |
||||
}; |
||||
|
||||
pwd = { |
||||
login: '登 录', |
||||
changePwd: '修改密码', |
||||
userId: '用户名', |
||||
pwd: '密码', |
||||
oldPwd: '旧密码', |
||||
newPwd: '新密码', |
||||
rePwd: '确认密码', |
||||
plsRePwd: '请再次输入新密码', |
||||
rePwdError: '两次输入密码不一致', |
||||
length: '密码长度为：{0}~{1}位', |
||||
noSpace: '密码不能包含空格', |
||||
required: '密码至少包含大小写字母和数字', |
||||
}; |
||||
|
||||
head = { |
||||
center: '个人中心', |
||||
logout: '退出登录', |
||||
fullScreen: '切换全屏', |
||||
changeStyle: '切换主题', |
||||
default: '默认', |
||||
light: '明亮', |
||||
dark: '黑夜', |
||||
language: '语言', |
||||
zh: '中文', |
||||
en: '英文', |
||||
size: '尺寸', |
||||
normal: '正常', |
||||
small: '小', |
||||
large: '大', |
||||
}; |
||||
|
||||
tool = { |
||||
colorCpar: '颜色对比器', |
||||
connect: '拼命连接中', |
||||
}; |
||||
|
||||
rule = { |
||||
pleaseEnter: '请输入', |
||||
notNull: '这里不能为空', |
||||
pleaseSelect: '请选择', |
||||
formatErr: '输入格式不正确', |
||||
int: '整数', |
||||
max: '最大值为{0}', |
||||
min: '最小值为{0}', |
||||
maxLen: '最多输入{0}个字符', |
||||
minLen: '最少输入{0}个字符', |
||||
hexadecimal: '请输入十六进制数字', |
||||
idCard: { |
||||
format: '你输入的身份证长度或格式错误', |
||||
area: '你输入的身份证地区非法', |
||||
birth: '你输入的身份证出生日期非法', |
||||
error: '你输入的身份证号非法', |
||||
}, |
||||
}; |
||||
|
||||
http = { |
||||
unPermission: '您暂无权访问，请联系管理员添加', |
||||
noPermission: '此权限尚未开放，请勿越权访问', |
||||
error: '网络错误', |
||||
downFail: '下载失败，网络异常！', |
||||
}; |
||||
|
||||
preMenu = { |
||||
operator: [ |
||||
'缓存管理', |
||||
'系统配置', |
||||
'数据字典', |
||||
'权限管理', |
||||
'角色管理', |
||||
'状态管理', |
||||
'接口日志', |
||||
], |
||||
}; |
||||
|
||||
log = { |
||||
title: '接口日志查询', |
||||
prop: [ |
||||
'序号', |
||||
'操作用户', |
||||
'日志模块', |
||||
'操作类型', |
||||
'操作时间', |
||||
'登录IP', |
||||
'日志信息', |
||||
], |
||||
start: '开始时间', |
||||
stop: '结束时间', |
||||
}; |
||||
|
||||
dict = { |
||||
title: '数据字典管理', |
||||
name: '类型/字典', |
||||
prop: ['字典名称', '字典编码', '字典说明', '字典状态', '操作'], |
||||
example: ['字典类型名称(模糊查询)', '字典类型编码', '状态'], |
||||
delete: [ |
||||
'确认是否删除该字典/字典类型(删除字典类型将删除该类型下所有字典)?', |
||||
'提示', |
||||
], |
||||
}; |
||||
|
||||
permission = { |
||||
title: '权限管理', |
||||
name: '权限', |
||||
parent: '父权限', |
||||
prop: [ |
||||
'权限名称', |
||||
'权限编号', |
||||
'菜单图标', |
||||
'权限级别', |
||||
'排序优先级', |
||||
'权限状态', |
||||
'权限内容', |
||||
'操作', |
||||
], |
||||
example: ['权限编号'], |
||||
delete: ['确定要删除该权限吗?', '提示'], |
||||
}; |
||||
|
||||
buffer = { |
||||
title: '缓存管理', |
||||
clean: '清空失效缓存', |
||||
modify: '修改有效期', |
||||
prop: ['缓存值', '唯一键', '是否有效', '失效时间', '操作'], |
||||
delete: ['确定要删除此条缓存吗？', '提示'], |
||||
delay: ['请输入失效时间(yyyy-MM-dd HH:mm:ss)', '修改'], |
||||
}; |
||||
} |
||||
@ -1,4 +1,7 @@
@@ -1,4 +1,7 @@
|
||||
export * from './element'; |
||||
export * from './store'; |
||||
export * from './axios'; |
||||
export * from './config'; |
||||
export * as Element from './element'; |
||||
export * as Store from './store'; |
||||
export * as Http from './http'; |
||||
export * as Lang from './i18n'; |
||||
export * as Api from './api'; |
||||
export * from './constant'; |
||||
|
||||
@ -1,21 +1,89 @@
@@ -1,21 +1,89 @@
|
||||
import { createStore as create } from 'vuex'; |
||||
import { styles, lang, size } from '../config'; |
||||
import { setLang } from '../element'; |
||||
import { Styles, Size } from '../config'; |
||||
import { getByCodes, getInfo } from '../api/public'; |
||||
|
||||
const state = { |
||||
style: styles.noobStyle, |
||||
lang: lang.chinese, |
||||
size: size.small, |
||||
export class State { |
||||
dict = { |
||||
active_status: { |
||||
A: '启用', |
||||
B: '禁用', |
||||
}, |
||||
test: { |
||||
a: 'A', |
||||
b: 'B', |
||||
c: 'C', |
||||
}, |
||||
}; |
||||
setLang(lang.chinese); |
||||
style = Styles.plain; |
||||
size = Size.normal; |
||||
} |
||||
|
||||
const mutations = { |
||||
updateState(state, param) { |
||||
state[param.prop] = param.value; |
||||
}, |
||||
export class Actions { |
||||
getDictMap = ({ state, commit }, codes) => { |
||||
if (codes == null) { |
||||
return; |
||||
} |
||||
const arr: Array<any> = []; |
||||
for (let i = 0; i < codes.length; i++) { |
||||
const code = codes[i]; |
||||
state.dict[code] || arr.push(code); |
||||
} |
||||
if (arr.length == 0) { |
||||
return; |
||||
} |
||||
getByCodes({ codes: arr.join() }).then((rsp: any) => { |
||||
if (rsp) { |
||||
for (let i = 0; i < arr.length; i++) { |
||||
const key = arr[i]; |
||||
const dict = {}; |
||||
if (rsp[key]) { |
||||
rsp[key].forEach((item) => { |
||||
dict[item.code] = item.name; |
||||
}); |
||||
} |
||||
commit('updateDict', [key, dict]); |
||||
} |
||||
} |
||||
}); |
||||
}; |
||||
} |
||||
|
||||
export class Mutations { |
||||
updateState = (state, param) => { |
||||
state[param[0]] = param[1]; |
||||
}; |
||||
initSize = (state, height) => { |
||||
const size = state.size; |
||||
const head = parseInt(size.headHeight); |
||||
const mainPad = parseInt(size.mainPad); |
||||
const searchRow = parseInt(size.searchRowHeight); |
||||
const searchRowPad = parseInt(size.searchRowPad); |
||||
if (height) { |
||||
size.height = height; |
||||
} else { |
||||
height = size.height; |
||||
} |
||||
size.mainHeight = Math.floor(height - head) + 'px'; |
||||
size.tableHeight = |
||||
height - 2 * (mainPad + searchRowPad) - 3 - searchRow - head; |
||||
size.pTableHeight = size.tableHeight - size.pageHeight; |
||||
}; |
||||
updateDict = (state, param) => { |
||||
state.dict[param[0]] = param[1]; |
||||
}; |
||||
} |
||||
|
||||
export interface StoreOptions { |
||||
state?: State; |
||||
getters?; |
||||
actions?; |
||||
mutations?: Mutations; |
||||
modules?; |
||||
plugins?; |
||||
strict?: boolean; |
||||
devtools?: boolean; |
||||
} |
||||
|
||||
export const createStore = (options) => { |
||||
Object.assign(options.state, state); |
||||
Object.assign(options.mutations, mutations); |
||||
return create(options); |
||||
}; |
||||
|
||||
Loading…
Reference in new issue