opencode/vben-app
1
0
Fork 0
forked from gitee/vben-app
Code Pull Requests Activity

~~

Browse Source
This commit is contained in:
zsvg
2022-05-23 17:01:19 +08:00
parent ed5eb18c14
commit ed95d50b18
21 changed files with 944 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env.development
+1 -1
View File
@@ -14,7 +14,7 @@ VITE_DROP_CONSOLE = false
# Basic interface address SPA
#VITE_GLOB_API_URL=/basic-api
VITE_GLOB_API_URL=http://localhost:5000
VITE_GLOB_API_URL=http://localhost:5301
# File upload address， optional
src/components/registerGlobComp.ts
+5 -4
View File
@@ -1,7 +1,8 @@
import type { App } from 'vue';
import { Button } from './Button';
import { Input, Layout } from 'ant-design-vue';
import type {App} from 'vue';
import {Button} from './Button';
import {Input, Layout, Row, Col, Form, FormItem} from 'ant-design-vue';
export function registerGlobComp(app: App) {
app.use(Input).use(Button).use(Layout);
app.use(Input).use(Button).use(Layout);
app.use(Row).use(Col).use(Form).use(FormItem);//vboot
}
src/comps/page/edit.ts
+29
View File
@@ -0,0 +1,29 @@
import {useRoute} from "vue-router";
import {defHttp} from "/@/utils/http/axios";
export const editInit=async (state)=>{
const route = useRoute();
const id=route.query?.id;
if (id) {
state.form = await defHttp.get({url: state.url + '/one/' + id});
} else {
state.form.avtag = true;
}
}
export const tabSave=async (state,formRef,tabClose)=>{
try {
const values = await formRef.validateFields();
console.log('Success:', values);
} catch (errorInfo) {
console.log('Failed:', errorInfo);
return false;
}
if (!state.form.crtim) {
await defHttp.post({url: state.url, data: state.form});
} else {
await defHttp.put({url:state.url, data: state.form});
}
tabClose();
}
src/comps/page/index.ts
+55
View File
@@ -0,0 +1,55 @@
import {defHttp} from "/@/utils/http/axios";
import {VXETable} from "vxe-table";
import { buildUUID } from '/@/utils/uuid';
export const listInit = (state, gridOptions) => {
gridOptions.highlightHoverRow = true;
gridOptions.checkboxConfig = {};
gridOptions.height = 600;
gridOptions.pagerConfig = {pageSize: 10};
gridOptions.proxyConfig = {
ajax: {
query: ({page}) => {
const qparams: any = Object.assign({}, state.form)
qparams.page = `${page.currentPage}`;
qparams.pageSize = `${page.pageSize}`;
return defHttp.get({
url: state.url,
params: qparams
})
},
}
};
}
export const listQuery = (gridRef) => {
gridRef.commitProxy('query');
}
export async function listDelete(url,gridRef) {
const selectRecords = gridRef.getCheckboxRecords();
if (selectRecords.length == 0) {
await VXETable.modal.message({content: '请选择后再进行删除', status: 'warning'})
return;
}
let ids = '';
for (const selectRecord of selectRecords) {
ids += selectRecord.id + ',';
}
const type = await VXETable.modal.confirm('您确定要删除吗？');
if (type === 'confirm') {
await defHttp.delete({url: url + '/' + ids.substr(0, ids.length - 1)});
await gridRef.commitProxy('query');
}
}
export const tabAdd=(go,url)=>{
go(url+'/edit?uuid='+buildUUID());
}
export const tabEdit=(go,url,param)=>{
go(url+'/edit'+param);
}
src/pages/ps/proj/cate/edit.vue → src/pages/pm/proj/cate/edit.vue
+2 -2
View File
@@ -51,7 +51,7 @@ const xTree = ref({} as any);
const vform = reactive({
loadingText: "",
url: "/ps/proj/cate",
url: "/pm/proj/cate",
data: {} as any,
rules: {
name: [{ required: true, message: "请输入名称" }],
@@ -80,7 +80,7 @@ const [registerDrawer, { setDrawerProps, changeLoading, closeDrawer }] = useDraw
function selectParent() {
xTree.value.open({ url: "/ps/proj/cate/tree" });
xTree.value.open({ url: "/pm/proj/cate/tree" });
}
function parentSelect(data) {
src/pages/ps/proj/cate/index.vue → src/pages/pm/proj/cate/index.vue
+3 -3
View File
@@ -37,7 +37,7 @@
</PageWrapper>
</template>
<script lang="ts">
export default {name: 'WfTemCate', inheritAttrs: false, customOptions: {}}
export default {name: 'PmProjCate', inheritAttrs: false, customOptions: {}}
</script>
<script lang="ts" setup>
import {DeleteOutlined, FormOutlined, PlusSquareOutlined} from '@ant-design/icons-vue';
@@ -84,7 +84,7 @@ const searchEvent = XEUtils.debounce(function () {
}, 500, {leading: false, trailing: true})
async function fetch() {
tdata.originData = await defHttp.get({url: '/ps/proj/cate'});
tdata.originData = await defHttp.get({url: '/pm/proj/cate'});
handleSearch()
}
@@ -108,7 +108,7 @@ onMounted(async () => {
async function removeEvent(id){
const type = await VXETable.modal.confirm('您确定要删除吗？');
if (type === 'confirm') {
await defHttp.delete({url: '/ps/proj/cate/' + id});
await defHttp.delete({url: '/pm/proj/cate/' + id});
await fetch();
}
}
src/pages/ps/proj/main/CateTree.vue → src/pages/pm/proj/main/CateTree.vue
+1 -1
View File
@@ -97,7 +97,7 @@ const searchEvent = XEUtils.debounce(function () {
async function fetch() {
demo1.originData = await defHttp.get({url: '/ps/proj/cate/tree'});
demo1.originData = await defHttp.get({url: '/pm/proj/cate/tree'});
handleSearch()
}
src/pages/ps/proj/main/edit.vue → src/pages/pm/proj/main/edit.vue
+2 -2
View File
@@ -57,7 +57,7 @@ const [registerModal, {openModal}] = useModal();
const vform = reactive({
loadingText: '',
url: '/ps/proj/main',
url: '/pm/proj/main',
data: {} as any,
rules: {
name: [
@@ -92,7 +92,7 @@ const [registerDrawer, {setDrawerProps,changeLoading, closeDrawer}] = useDrawerI
});
function selectCate() {
xTree.value.open({url:"/ps/proj/cate/tree"});
xTree.value.open({url:"/pm/proj/cate/tree"});
}
function cateSelect(data) {
src/pages/ps/proj/main/index.vue → src/pages/pm/proj/main/index.vue
+3 -3
View File
@@ -22,7 +22,7 @@
</PageWrapper>
</template>
<script lang="ts">
export default {name: 'PsProjMain', inheritAttrs: false, customOptions: {}}
export default {name: 'PmProjMain', inheritAttrs: false, customOptions: {}}
</script>
<script lang="ts" setup>
import {PageWrapper} from '/@/components/Page';
@@ -42,7 +42,7 @@ const formData = reactive({
catename: '',
})
const gridOptions = reactive<VxeGridProps>(createOption('/ps/proj/main', {}, formData, [
const gridOptions = reactive<VxeGridProps>(createOption('/pm/proj/main', {}, formData, [
{type: 'checkbox', align: 'center', width: 42, fixed: 'left'},
{type: 'seq', align: 'center', width: 50, fixed: 'left'},
{field: 'name', title: '项目名称', width: 300, fixed: 'left', slots: {default: 'name_default'}},
@@ -69,7 +69,7 @@ function handleSelect(node) {
const go = useGo();
const goTask= (id)=>{
go('/ps/task/main/'+id);
go('/pm/task/main/'+id);
}
//--------------------------------------------------------------------------------------------------
src/pages/ps/task/item/edit.vue → src/pages/pm/task/item/edit.vue
View File
src/pages/ps/task/item/index.vue → src/pages/pm/task/item/index.vue
View File
src/pages/ps/task/main/edit.vue → src/pages/pm/task/main/edit.vue
+2 -2
View File
@@ -52,7 +52,7 @@ const [registerModal, {openModal}] = useModal();
const vform = reactive({
loadingText: '',
url: '/ps/task/main',
url: '/pm/task/main',
data: {} as any,
rules: {
name: [
@@ -87,7 +87,7 @@ const [registerDrawer, {setDrawerProps,changeLoading, closeDrawer}] = useDrawerI
});
function selectCate() {
xTree.value.open({url:"/ps/proj/cate/tree"});
xTree.value.open({url:"/pm/proj/cate/tree"});
}
function cateSelect(data) {
src/pages/ps/task/main/index.vue → src/pages/pm/task/main/index.vue
+26 -26
View File
@@ -11,12 +11,12 @@
<vxe-button @click="insertEvent(-1)">新 增</vxe-button>
<vxe-button @click="$refs.xTable.setAllTreeExpand(true)">展 开</vxe-button>
<vxe-button @click="$refs.xTable.clearTreeExpand()">折 叠</vxe-button>
<!-- <vxe-button @click="$refs.xTable.toggleTreeExpand(tableData[0], true)">切换第一个</vxe-button>-->
<!-- <vxe-button @click="$refs.xTable.setTreeExpand(tableData[2], true)">展开第三个</vxe-button>-->
<!-- <vxe-button @click="$refs.xTable.toggleTreeExpand(tableData[0], true)">切换第一个</vxe-button>-->
<!-- <vxe-button @click="$refs.xTable.setTreeExpand(tableData[2], true)">展开第三个</vxe-button>-->
</template>
<template #tools>
<!-- <vxe-button type="text" icon="vxe-icon&#45;&#45;question" class="tool-btn"></vxe-button>-->
<!-- <vxe-button type="text" icon="vxe-icon&#45;&#45;funnel" class="tool-btn" @click="alert(1)"></vxe-button>-->
<!-- <vxe-button type="text" icon="vxe-icon&#45;&#45;question" class="tool-btn"></vxe-button>-->
<!-- <vxe-button type="text" icon="vxe-icon&#45;&#45;funnel" class="tool-btn" @click="alert(1)"></vxe-button>-->
<button style="margin-right: 10px" @click="importEvent" class="vxe-button type--button size--small is--circle" type="button" title="导入">
<i class="vxe-button--icon vxe-icon--upload"></i>
</button>
@@ -24,25 +24,25 @@
</vxe-toolbar>
<vxe-table
resizable
show-overflow
ref="xTable"
:export-config="exportConfig"
:tree-config="{transform: true}"
:edit-config="{trigger: 'click', mode: 'row'}"
:checkbox-config="{labelField: 'id'}"
:data="taskTable.tableData">
resizable
show-overflow
ref="xTable"
:export-config="exportConfig"
:tree-config="{transform: true}"
:edit-config="{trigger: 'click', mode: 'row'}"
:checkbox-config="{labelField: 'id'}"
:data="taskTable.tableData">
<vxe-column width="35">
<template #default>
<span class="drag-btn" style="text-align: center">
<i class="vxe-icon--menu"></i>
</span>
</template>
<!-- <template #header>-->
<!-- <vxe-tooltip v-model="taskTable.showHelpTip" content="按住后可以上下拖动排序！" enterable>-->
<!-- <i class="vxe-icon&#45;&#45;question" @click="taskTable.showHelpTip = !taskTable.showHelpTip"></i>-->
<!-- </vxe-tooltip>-->
<!-- </template>-->
<!-- <template #header>-->
<!-- <vxe-tooltip v-model="taskTable.showHelpTip" content="按住后可以上下拖动排序！" enterable>-->
<!-- <i class="vxe-icon&#45;&#45;question" @click="taskTable.showHelpTip = !taskTable.showHelpTip"></i>-->
<!-- </vxe-tooltip>-->
<!-- </template>-->
</vxe-column>
<vxe-column field="name" tree-node title="任务名称" :edit-render="{}">
<template #edit="{ row }">
@@ -62,7 +62,7 @@
<vxe-column title="操作" width="100" show-overflow header-align="center" align="right">
<template #default="{ row }">
<!-- <PlusSquareOutlined @click="addEvent({pid:row.id,pname:row.name},openDrawer)" style="font-size: 15px;margin-left: 10px;color: #52C41A"/>-->
<!-- <PlusSquareOutlined @click="addEvent({pid:row.id,pname:row.name},openDrawer)" style="font-size: 15px;margin-left: 10px;color: #52C41A"/>-->
<PlusSquareOutlined @click="insertRow(row, 'bottom')" style="font-size: 15px;margin-left: 10px;color: #52C41A"/>
<FormOutlined @click="editEvent({id:row.id},openDrawer)" style="font-size: 15px;margin-left: 11px;color: #2874C5"/>
<DeleteOutlined @click="removeEvent(row)" style="font-size: 15px;margin-left: 10px;color: #ED6F6F"/>
@@ -126,7 +126,7 @@
</PageWrapper>
</template>
<script lang="ts">
export default { name: "PsTaskMain", inheritAttrs: false, customOptions: {} };
export default { name: "PmTaskMain", inheritAttrs: false, customOptions: {} };
</script>
<script lang="ts" setup>
import {DeleteOutlined, FormOutlined, PlusSquareOutlined} from '@ant-design/icons-vue';
@@ -233,7 +233,7 @@ async function handleSelect(node) {
console.log(node)
if(node&&node.id){
stageid=node.id
taskTable.tableData=await defHttp.get({url:"/ps/task/main?stageid="+node.id});
taskTable.tableData=await defHttp.get({url:"/pm/task/main?stageid="+node.id});
}else{
stageid='';
}
@@ -285,7 +285,7 @@ const exportConfig = {
// 自定义服务端导出
exportMethod({ options }) {
defHttp.getAxios().request({
url: apiUrl+"/ps/task/main/exp/11",
url: apiUrl+"/pm/task/main/exp/11",
method: "get",
data: {},
responseType: "blob"
@@ -322,13 +322,13 @@ const importEvent =async () => {
formBody.append('file', file)
await defHttp.uploadFile<UploadApiResult>(
{
url: apiUrl+'/ps/task/main/imp',
},
{file:file},
{
url: apiUrl+'/pm/task/main/imp',
},
{file:file},
)
// return defHttp.post({url:'/ps/task/main/imp',data:formBody}).then(data => {
// return defHttp.post({url:'/pm/task/main/imp',data:formBody}).then(data => {
// VXETable.modal.message({ content: `成功导入 条记录！`, status: 'success' })
// // 导入完成，刷新表格
// }).catch(() => {
src/pages/pm/task/main/index2.vue
+478
View File
@@ -0,0 +1,478 @@
<template>
<PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
<List @select="handleSelect" style="margin: 6px 0 6px 6px;flex:0 0 280px;" />
<div class="ztable" style="flex: 1">
<vxe-toolbar ref="xToolbar" export refresh custom >
<template #buttons>
<vxe-input v-model="taskTable.filterName" placeholder="请输入名称" @keyup="searchEvent"></vxe-input>
<vxe-button status="primary">查 询</vxe-button>
<vxe-button @click="insertEvent(-1)">新 增</vxe-button>
<vxe-button @click="$refs.xTable.setAllTreeExpand(true)">展 开</vxe-button>
<vxe-button @click="$refs.xTable.clearTreeExpand()">折 叠</vxe-button>
<!-- <vxe-button @click="$refs.xTable.toggleTreeExpand(tableData[0], true)">切换第一个</vxe-button>-->
<!-- <vxe-button @click="$refs.xTable.setTreeExpand(tableData[2], true)">展开第三个</vxe-button>-->
</template>
<template #tools>
<!-- <vxe-button type="text" icon="vxe-icon&#45;&#45;question" class="tool-btn"></vxe-button>-->
<!-- <vxe-button type="text" icon="vxe-icon&#45;&#45;funnel" class="tool-btn" @click="alert(1)"></vxe-button>-->
<button style="margin-right: 10px" @click="importEvent" class="vxe-button type--button size--small is--circle" type="button" title="导入">
<i class="vxe-button--icon vxe-icon--upload"></i>
</button>
</template>
</vxe-toolbar>
<vxe-table
resizable
show-overflow
ref="xTable"
:export-config="exportConfig"
:tree-config="{transform: true}"
:edit-config="{trigger: 'click', mode: 'row'}"
:checkbox-config="{labelField: 'id'}"
:data="taskTable.tableData">
<vxe-column width="35">
<template #default>
<span class="drag-btn" style="text-align: center">
<i class="vxe-icon--menu"></i>
</span>
</template>
<!-- <template #header>-->
<!-- <vxe-tooltip v-model="taskTable.showHelpTip" content="按住后可以上下拖动排序！" enterable>-->
<!-- <i class="vxe-icon&#45;&#45;question" @click="taskTable.showHelpTip = !taskTable.showHelpTip"></i>-->
<!-- </vxe-tooltip>-->
<!-- </template>-->
</vxe-column>
<vxe-column field="name" tree-node title="任务名称" :edit-render="{}">
<template #edit="{ row }">
<vxe-input v-model="row.name" type="text"></vxe-input>
</template>
</vxe-column>
<vxe-column field="size" title="负责人" :edit-render="{}">
<template #edit="{ row }">
<vxe-input v-model="row.size" type="text"></vxe-input>
</template>
</vxe-column>
<vxe-column field="date" title="截止时间" :edit-render="{}">
<template #edit="{ row }">
<vxe-input v-model="row.date" type="date" transfer></vxe-input>
</template>
</vxe-column>
<vxe-column title="操作" width="100" show-overflow header-align="center" align="right">
<template #default="{ row }">
<!-- <PlusSquareOutlined @click="addEvent({pid:row.id,pname:row.name},openDrawer)" style="font-size: 15px;margin-left: 10px;color: #52C41A"/>-->
<PlusSquareOutlined @click="insertRow(row, 'bottom')" style="font-size: 15px;margin-left: 10px;color: #52C41A"/>
<FormOutlined @click="editEvent({id:row.id},openDrawer)" style="font-size: 15px;margin-left: 11px;color: #2874C5"/>
<DeleteOutlined @click="removeEvent(row)" style="font-size: 15px;margin-left: 10px;color: #ED6F6F"/>
</template>
</vxe-column>
</vxe-table>
<!-- <vxe-table-->
<!-- ref="xCate"-->
<!-- resizable-->
<!-- show-overflow-->
<!-- row-key-->
<!-- height="auto"-->
<!-- highlight-current-row-->
<!-- highlight-hover-row-->
<!-- @cell-click="cellClickEvent"-->
<!-- :edit-config="{trigger: 'click', mode: 'row'}"-->
<!-- :tree-config="taskTable.tableTreeConfig"-->
<!-- :data="taskTable.tableData">-->
<!-- <vxe-column field="name" title="Name" tree-node :edit-render="{}">-->
<!-- <template #default="{ row }">-->
<!-- <vxe-input v-model="row.name" type="text"></vxe-input>-->
<!-- </template>-->
<!-- </vxe-column>-->
<!-- <vxe-column field="size" title="Size" :edit-render="{}">-->
<!-- <template #edit="{ row }">-->
<!-- <vxe-input v-model="row.size" type="text"></vxe-input>-->
<!-- </template>-->
<!-- </vxe-column>-->
<!-- <vxe-column field="type" title="Type" :edit-render="{}">-->
<!-- <template #edit="{ row }">-->
<!-- <vxe-input v-model="row.type" type="text"></vxe-input>-->
<!-- </template>-->
<!-- </vxe-column>-->
<!-- <vxe-column field="date" title="Date" :edit-render="{}">-->
<!-- <template #edit="{ row }">-->
<!-- <vxe-input v-model="row.date" type="date" transfer></vxe-input>-->
<!-- </template>-->
<!-- </vxe-column>-->
<!-- </vxe-table>-->
<!-- -->
<!-- <vxe-grid ref='xGrid' v-bind="gridOptions">-->
<!-- <template #tbtns>-->
<!-- <vxe-input v-model="formData.name" placeholder="输入名称查询"></vxe-input>-->
<!-- <vxe-button @click="searchEvent" status="primary">查 询</vxe-button>-->
<!-- <vxe-button @click="addEvent({ cate:{id:formData.cateid,name:formData.catename}},openDrawer)">新 增</vxe-button>-->
<!-- <vxe-button @click="deleteEvent($refs.xGrid)">删 除</vxe-button>-->
<!-- </template>-->
<!-- <template #name_default="{ row }">-->
<!-- <span style="cursor:pointer;color: #3e9ece"-->
<!-- @click="editEvent({id:row.id},openDrawer)">{{ row.name }}</span>-->
<!-- </template>-->
<!-- </vxe-grid>-->
<!-- -->
</div>
<Edit @register="registerDrawer" @success="handleSuccess" />
</PageWrapper>
</template>
<script lang="ts">
export default { name: "PmTaskMain", inheritAttrs: false, customOptions: {} };
</script>
<script lang="ts" setup>
import {DeleteOutlined, FormOutlined, PlusSquareOutlined} from '@ant-design/icons-vue';
import { PageWrapper } from "/@/components/Page";
import List from "./list.vue";
import { nextTick, onMounted, onUnmounted, reactive, ref } from "vue";
import { VxeToolbarInstance, VxeTableInstance, VXETable } from "vxe-table";
import Edit from "./edit.vue";
import { useDrawer } from "/@/components/Drawer";
import { deleteEvent, addEvent, editEvent, createOption } from "/@/comps/vxe/list";
import Sortable from "sortablejs";
import { defHttp } from "/@/utils/http/axios";
import { useGlobSetting } from "/@/hooks/setting";
import { UploadApiResult } from "/@/api/sys/model/uploadModel";
import XEUtils from "xe-utils";
const taskTable = reactive({
filterName: "",
tableData: [
{ id: 10000, parentId: null, name: "test abc1", type: "mp3", size: 1024, date: "2020-08-01" },
{ id: 10050, parentId: null, name: "Test2", type: "mp4", size: null, date: "2021-04-01" },
{ id: 24300, parentId: 10050, name: "Test3", type: "avi", size: 1024, date: "2020-03-01" },
{ id: 20045, parentId: 24300, name: "test abc4", type: "html", size: 600, date: "2021-04-01" },
{ id: 10053, parentId: 24300, name: "test abc96", type: "avi", size: null, date: "2021-04-01" },
{ id: 24330, parentId: 10053, name: "test abc5", type: "txt", size: 25, date: "2021-10-01" },
{ id: 21011, parentId: 10053, name: "Test6", type: "pdf", size: 512, date: "2020-01-01" },
{ id: 22200, parentId: 10053, name: "Test7", type: "js", size: 1024, date: "2021-06-01" },
{ id: 23666, parentId: null, name: "Test8", type: "xlsx", size: 2048, date: "2020-11-01" },
{ id: 23677, parentId: 23666, name: "Test7", type: "js", size: 1024, date: "2021-06-01" },
{ id: 23671, parentId: 23677, name: "Test7", type: "js", size: 1024, date: "2021-06-01" },
{ id: 23672, parentId: 23677, name: "Test7", type: "js", size: 1024, date: "2021-06-01" },
{ id: 23688, parentId: 23666, name: "Test7", type: "js", size: 1024, date: "2021-06-01" },
{ id: 23681, parentId: 23688, name: "Test7", type: "js", size: 1024, date: "2021-06-01" },
{ id: 23682, parentId: 23688, name: "Test7", type: "js", size: 1024, date: "2021-06-01" }
],
originData: [] as any[],
tableTreeConfig: {
transform: true,
children: "children",
rowKey: "id",
indent: 15,
parentKey: "parentId",
iconOpen: "vxe-icon--arrow-bottom",
iconClose: "vxe-icon--arrow-right"
}
});
//
// const taskTable = reactive({
// tableData: [
// { id: 10000, parentId: null, name: 'test abc1', type: 'mp3', size: 1024, date: '2020-08-01' },
// { id: 10050, parentId: null, name: 'Test2', type: 'mp4', size: null, date: '2021-04-01' },
// { id: 24300, parentId: 10050, name: 'Test3', type: 'avi', size: 1024, date: '2020-03-01' },
// { id: 20045, parentId: 24300, name: 'test abc4', type: 'html', size: 600, date: '2021-04-01' },
// { id: 10053, parentId: 24300, name: 'test abc96', type: 'avi', size: null, date: '2021-04-01' },
// { id: 24330, parentId: 10053, name: 'test abc5', type: 'txt', size: 25, date: '2021-10-01' },
// { id: 21011, parentId: 10053, name: 'Test6', type: 'pdf', size: 512, date: '2020-01-01' },
// { id: 22200, parentId: 10053, name: 'Test7', type: 'js', size: 1024, date: '2021-06-01' },
// { id: 23666, parentId: null, name: 'Test8', type: 'xlsx', size: 2048, date: '2020-11-01' },
// { id: 23677, parentId: 23666, name: 'Test7', type: 'js', size: 1024, date: '2021-06-01' },
// { id: 23671, parentId: 23677, name: 'Test7', type: 'js', size: 1024, date: '2021-06-01' },
// { id: 23672, parentId: 23677, name: 'Test7', type: 'js', size: 1024, date: '2021-06-01' },
// { id: 23688, parentId: 23666, name: 'Test7', type: 'js', size: 1024, date: '2021-06-01' },
// { id: 23681, parentId: 23688, name: 'Test7', type: 'js', size: 1024, date: '2021-06-01' },
// { id: 23682, parentId: 23688, name: 'Test7', type: 'js', size: 1024, date: '2021-06-01' },
// { id: 24555, parentId: null, name: 'test abc9', type: 'avi', size: 224, date: '2020-10-01' },
// { id: 24566, parentId: 24555, name: 'Test7', type: 'js', size: 1024, date: '2021-06-01' },
// { id: 24577, parentId: 24555, name: 'Test7', type: 'js', size: 1024, date: '2021-06-01' }
// ],
// tableTreeConfig: {
// children: 'children',
// rowKey: 'id',
// indent: 15,
// parentKey: 'parentId',
// iconOpen: 'vxe-icon--arrow-bottom',
// iconClose: 'vxe-icon--arrow-right'
// }
// })
//
// const xGrid = ref({} as VxeGridInstance)
// const formData = reactive({
// name: '',
// listid: '',
// listname: '',
// })
//
// const gridOptions = reactive<VxeGridProps>(createOption('/ps/task/main', {}, formData, [
// {type: 'checkbox', align: 'center', width: 42, fixed: 'left'},
// {type: 'seq', align: 'center', width: 50, fixed: 'left'},
// {field: 'name', title: '任务名称', width: 300, fixed: 'left', slots: {default: 'name_default'}},
// {field: 'notes', title: '备注'},
// {field: 'crtim', title: '创建时间', width: 140},
// {field: 'uptim', title: '更新时间', width: 140},
// ]));
//
// const searchEvent = () => {
// xGrid.value.commitProxy('query')
// }
//
let stageid = '';
async function handleSelect(node) {
console.log(node)
if(node&&node.id){
stageid=node.id
taskTable.tableData=await defHttp.get({url:"/pm/task/main?stageid="+node.id});
}else{
stageid='';
}
// if(node!=null){
// formData.listid = node.id;
// formData.listname = node.name;
// }else{
// formData.listid = '';
// formData.listname = '';
// }
// searchEvent();
}
//--------------------------------------------------------------------------------------------------
const [registerDrawer, {openDrawer}] = useDrawer();
//
function handleSuccess(item) {
console.log(item);
searchEvent();
}
const xTable = ref({} as VxeTableInstance);
const xToolbar = ref({} as VxeToolbarInstance);
let sortable1: any;
const rowDrop = () => {
const $table = xTable.value;
sortable1 = Sortable.create($table.$el.querySelector(".body--wrapper>.vxe-table--body tbody"), {
handle: ".drag-btn",
onEnd: (sortableEvent) => {
const newIndex = sortableEvent.newIndex as number;
const oldIndex = sortableEvent.oldIndex as number;
const currRow = taskTable.tableData.splice(oldIndex, 1)[0];
taskTable.tableData.splice(newIndex, 0, currRow);
}
});
};
// const xtools={
// name:'11'
// }
const { apiUrl } = useGlobSetting();
const exportConfig = {
remote: true,
types: ["xlsx"],
modes: ["current", "selected", "all"],
// 自定义服务端导出
exportMethod({ options }) {
defHttp.getAxios().request({
url: apiUrl+"/pm/task/main/exp/11",
method: "get",
data: {},
responseType: "blob"
}).then(res => {
let blob = new Blob([Object.prototype.toString.call(res.data).toLowerCase() === "[object object]" ? JSON.stringify(res.data) : res.data]);
VXETable.saveFile({ filename: options.filename, type: options.type, content: blob });
}).catch(() => {
VXETable.modal.message({ content: "导出失败！", status: "error" });
});
}
};
const importConfig={
remote: true,
types: ['xlsx'],
modes: ['insert'],
// 自定义服务端导入
importMethod ({ file }) {
const formBody = new FormData()
formBody.append('file', file)
return defHttp.post('https://api.xuliangzhan.com:10443/demo/api/pub/import', formBody).then(data => {
VXETable.modal.message({ content: `成功导入 ${data.result.insertRows} 条记录！`, status: 'success' })
// 导入完成，刷新表格
// $grid.commitProxy('query')
}).catch(() => {
VXETable.modal.message({ content: '导入失败，请检查数据是否正确！', status: 'error' })
})
}
}
const importEvent =async () => {
const { file } = await VXETable.readFile();
const formBody = new FormData()
formBody.append('file', file)
await defHttp.uploadFile<UploadApiResult>(
{
url: apiUrl+'/pm/task/main/imp',
},
{file:file},
)
// return defHttp.post({url:'/pm/task/main/imp',data:formBody}).then(data => {
// VXETable.modal.message({ content: `成功导入 条记录！`, status: 'success' })
// // 导入完成，刷新表格
// }).catch(() => {
// VXETable.modal.message({ content: '导入失败，请检查数据是否正确！', status: 'error' })
// })
}
let initTime: any;
nextTick(() => {
// 加载完成之后在绑定拖动事件
initTime = setTimeout(() => {
rowDrop();
}, 500);
});
onMounted(()=>{
const $table = xTable.value;
const $toolbar = xToolbar.value;
$table.connect($toolbar);
})
onUnmounted(() => {
clearTimeout(initTime);
if (sortable1) {
sortable1.destroy();
}
});
const handleSearch = () => {
const filterName = XEUtils.toValueString(taskTable.filterName).trim()
if (filterName) {
const options = {children: 'children'}
const searchProps = ['name']
taskTable.tableData = XEUtils.searchTree(taskTable.originData, item => searchProps.some(key => XEUtils.toValueString(item[key]).indexOf(filterName) > -1), options)
nextTick(() => {
const $table = xTable.value
$table.setAllTreeExpand(true)
})
} else {
taskTable.tableData = taskTable.originData
}
}
const searchEvent = XEUtils.debounce(function () {
handleSearch()
}, 500, {leading: false, trailing: true})
async function fetch() {
taskTable.originData = await defHttp.get({url: '/sys/auth/menu/tree'});
handleSearch()
}
const insertEvent = async (row: any) => {
if (stageid == '') {
await VXETable.modal.message({content: '请先选择阶段', status: 'warning'});
return;
}
const $table = xTable.value;
const record = {
id: guid().replaceAll("-",""),
name: '',
type:'new',
stageid: stageid,
parentId:null
}
const {row: newRow} = await $table.insertAt(record, row)
await $table.setActiveCell(newRow, 'name');
}
const insertEvent2 = async (row: any) => {
console.log(row)
const $table = xTable.value;
const record = {
id: guid().replaceAll("-",""),
name: '',
type:'new',
stageid: stageid,
parentId:row.id
}
const {row: newRow} = await $table.insertAt(record, -1);
await $table.setRowExpand(newRow, true);
await $table.setActiveCell(newRow, 'name')
}
const insertRow = async (currRow: any, locat: string) => {
const $table = xTable.value
// 如果 null 则插入到目标节点顶部
// 如果 -1 则插入到目标节点底部
// 如果 row 则有插入到效的目标节点该行的位置
if (locat === 'current') {
const record = {
name: '新数据',
id: Date.now(),
parentId: currRow.parentId, // 父节点必须与当前行一致
date: XEUtils.toDateString(new Date(), 'yyyy-MM-dd')
}
const { row: newRow } = await $table.insertAt(record, currRow)
await $table.setActiveRow(newRow) // 插入子节点
} else if (locat === 'top') {
const record = {
name: '新数据',
id: Date.now(),
parentId: currRow.id, // 需要指定父节点，自动插入该节点中
date: XEUtils.toDateString(new Date(), 'yyyy-MM-dd')
}
const { row: newRow } = await $table.insert(record)
await $table.setTreeExpand(currRow, true) // 将父节点展开
await $table.setActiveRow(newRow) // 插入子节点
} else if (locat === 'bottom') {
const record = {
name: '新数据',
id: Date.now(),
stageid: stageid,
parentId: currRow.id, // 需要指定父节点，自动插入该节点中
date: XEUtils.toDateString(new Date(), 'yyyy-MM-dd')
}
const { row: newRow } = await $table.insertAt(record, -1)
await $table.setTreeExpand(currRow, true) // 将父节点展开
// await $table.setActiveRow(newRow) // 插入子节点
await $table.setActiveCell(newRow, 'name')
}
}
const removeEvent = async (row: any) => {
const type = await VXETable.modal.confirm('您确定要删除该数据?')
if (type === 'confirm') {
const $table = xTable.value
await $table.remove(row)
}
}
function guid() {
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
let r = Math.random() * 16 | 0,
v = c == 'x' ? r : (r & 0x3 | 0x8);
return v.toString(16);
});
}
</script>
src/pages/ps/task/main/list.vue → src/pages/pm/task/main/list.vue
+5 -5
View File
@@ -174,7 +174,7 @@ onUnmounted(() => {
// const xTree = ref({} as any)
//
// function selectProj() {
// xTree.value.open({url:"/ps/proj/main/tree"});
// xTree.value.open({url:"/pm/proj/main/tree"});
// }
//
// function projSelect(data) {
@@ -193,7 +193,7 @@ onUnmounted(() => {
// }
async function fetch() {
taskTree.projs = await defHttp.get({url: "/ps/proj/main/list"});
taskTree.projs = await defHttp.get({url: "/pm/proj/main/list"});
}
onMounted(() => {
@@ -205,7 +205,7 @@ let projid = '';
async function projChange(item) {
console.log(item.value);
projid = item.value;
taskTree.stages = await defHttp.get({url: "/ps/proj/stage/list?projid=" + projid});
taskTree.stages = await defHttp.get({url: "/pm/proj/stage/list?projid=" + projid});
}
const insertEvent = async (row: any) => {
@@ -236,13 +236,13 @@ const editClosedEvent: VxeTableEvents.EditClosed = async ({row, column}) => {
const cellValue = row[field];
if (row.type == 'new') {
console.log("新增的每次都去更新")
await defHttp.post({url: "/ps/proj/stage", data: row});
await defHttp.post({url: "/pm/proj/stage", data: row});
// row.type='old';
}
// 判断单元格值是否被修改
else if ($table.isUpdateByRow(row, field)) {
console.log("修改");
await defHttp.put({url: "/ps/proj/stage", data: row});
await defHttp.put({url: "/pm/proj/stage", data: row});
// setTimeout(() => {
// VXETable.modal.message({
// content: `局部保存成功！ ${field}=${cellValue}`,
src/pages/sa/agent/main/edit.vue
+138
View File
@@ -0,0 +1,138 @@
<template>
<div class="v-edit">
<div class="v-edit-head">
<a-row>
<a-col :span="10">
<div style='line-height: 32px'>代理商维护</div>
</a-col>
<a-col :span="14" style='text-align: right'>
<a-button @click="tabSave(state,$refs.formRef,closeCurrent)" class="v-btn-success" style="margin-right: 8px;">保存</a-button>
<a-button @click="closeCurrent">关闭</a-button>
</a-col>
</a-row>
</div>
<div class="v-edit-body">
<div class="zform-div">
<a-form ref="formRef" :model="form" class='zform' layout="inline" :label-col="{style: {width: '180px'}}">
<a-form-item label="代理商名称" name="name" style="width: 50%" :rules="[{ required: true, message: '名称不能为空' }]">
<a-input v-model:value="form.name"/>
</a-form-item>
<a-form-item label="Activity form" style="width: 50%">
<a-input v-model:value="form.desc"/>
</a-form-item>
<a-form-item label="Activity form" style="width: 50%">
<a-input v-model:value="form.desc"/>
</a-form-item>
<a-form-item label="Activity form" style="width: 50%">
<a-input v-model:value="form.desc"/>
</a-form-item>
<a-form-item label="Activity form" style="width: 25%">
<a-input v-model:value="form.desc"/>
</a-form-item>
<a-form-item label="Activity form" style="width: 25%">
<a-input v-model:value="form.desc"/>
</a-form-item>
<a-form-item label="Activity form" style="width: 50%">
<a-input v-model:value="form.desc"/>
</a-form-item>
</a-form>
</div>
</div>
</div>
</template>
<script lang="ts" setup>
import {onMounted, reactive, toRefs,ref} from 'vue'
import {useTabs} from "/@/hooks/web/useTabs";
import {editInit,tabSave} from '/@/comps/page/edit';
const { closeCurrent} = useTabs();
const state = reactive({
url: '/sa/agent/main',
form: {} as any,
});
const {form} = toRefs(state);
onMounted(() => {
editInit(state);
});
</script>
<style>
.v-edit {
background-color: white;
margin: 6px;
}
.v-edit-head {
border-left: 1px solid #e4e7ed;
border-right: 1px solid #e4e7ed;
border-top: 1px solid #e4e7ed;
height: 49px;
padding: 8px;
}
.v-edit-body {
border: 1px solid #e4e7ed;
padding: 8px;
}
.v-btn-primary {
color: #409eff;
border: 1px solid #9fceff;
background: #ebf5f5
}
.v-btn-success {
color: #67c23a;
border: 1px solid #b3e19d;
background: #f0f9eb
}
.v-btn-success:hover {
color: green;
border: 1px solid green;
background: #f0f9eb
}
.v-btn-danger {
color: #f56c6c;
border: 1px solid #fab6b6;
background: #fef0f0
}
.v-btn-danger:hover {
color: #e53838;
border: 1px solid #e53838;
background: #fef0f0
}
.zform-div {
border-top: 1px solid #d2d2d2;
border-right: 1px solid #d2d2d2
}
.zform .ant-row {
border-bottom: 1px solid #d2d2d2;
border-left: 1px solid #d2d2d2;
background-color: #f6f6f6;
padding: 0;
}
.zform .ant-form-item {
line-height: 38px;
margin: 0;
}
.zform .ant-form-item-label {
border-right: 1px solid #d2d2d2;
}
.zform .ant-form-item-control {
padding-left: 5px;
padding-right: 5px;
}
</style>
src/pages/sa/agent/main/index.vue
+99 -51
View File
@@ -1,62 +1,110 @@
<template>
<PageWrapper class="ztable" contentFullHeight>
<vxe-grid ref='xGrid' v-bind="gridOptions">
<template #tbtns>
<vxe-input v-model="formData.name" placeholder="输入名称查询"></vxe-input>
<vxe-button @click="searchEvent" status="primary">查 询</vxe-button>
<vxe-button @click="addEvent({},openDrawer)">新 增</vxe-button>
<vxe-button @click="deleteEvent($refs.xGrid)">删 除</vxe-button>
<!-- <vxe-button @click="test()">同时使用JPA与mybatis-plus的事务测试</vxe-button>-->
</template>
<template #name_default="{ row }">
<span style="cursor:pointer;color: #3e9ece"
@click="editEvent({id:row.id},openDrawer)">{{ row.name }}</span>
</template>
</vxe-grid>
<AgentMainDrawer @register="registerDrawer" @success="handleSuccess"/>
</PageWrapper>
<div class="v-list">
<div class="v-list-head">
<a-row>
<a-col :span="14">
<a-input @keyup.enter="listQuery($refs.gridRef)" v-model:value="state.form.name" placeholder="输入名称回车查询" class='list-search'/>
<a-button @click="listQuery($refs.gridRef)" class="v-btn-primary">查询</a-button>
</a-col>
<a-col :span="10" style='text-align: right'>
<a-button @click="tabAdd(go,state.url)" class="v-btn-success" style="margin-right: 8px;">新增</a-button>
<a-button @click="listDelete(state.url,$refs.gridRef)" class="v-btn-danger" >删除</a-button>
</a-col>
</a-row>
</div>
<div class="v-list-body">
<vxe-grid ref='gridRef' v-bind="gridOptions">
<template #name_default="{ row }">
<span @click="tabEdit(go,state.url,'?id='+row.id)" style="cursor:pointer;color: #3e9ece">
{{ row.name }}
</span>
</template>
</vxe-grid>
</div>
</div>
</template>
<script lang="ts">
export default {name: 'SaAgentMain', inheritAttrs: false}
</script>
<script lang="ts" setup>
import {PageWrapper} from '/@/components/Page';
import {reactive, ref} from 'vue'
import {VxeGridInstance, VxeGridProps} from 'vxe-table'
import AgentMainDrawer from './AgentMainDrawer.vue';
import {useDrawer} from '/@/components/Drawer';
import {deleteEvent, addEvent, editEvent, createOption} from '/@/comps/vxe/list';
import { defHttp } from "/@/utils/http/axios";
import {VXETable} from 'vxe-table'
import {onMounted, reactive} from 'vue'
import {VxeGridProps} from 'vxe-table'
import {listInit, listQuery,listDelete, tabAdd,tabEdit} from '/@/comps/page/index';
import {useGo} from "/@/hooks/web/usePage";
const xGrid = ref({} as VxeGridInstance)
const formData = reactive({name: ''})
const go = useGo();
const gridOptions = reactive<VxeGridProps>(createOption('/sa/agent/main', {}, formData, [
{type: 'checkbox', align: 'center', width: 42, fixed: 'left'},
{type: 'seq', align: 'center', width: 50, fixed: 'left'},
{field: 'name', title: '代理商名称', width: 300, fixed: 'left', slots: {default: 'name_default'}},
{field: 'crtim', title: '创建时间', width: 160},
{field: 'notes', title: '备注'}
]));
const state = reactive({
url: '/sa/agent/main',
form: {},
});
const searchEvent = () => {
xGrid.value.commitProxy('query')
}
const gridOptions = reactive<VxeGridProps>({
columns: [
{type: 'checkbox', align: 'center', width: 42, fixed: 'left'},
{type: 'seq', align: 'center', width: 50, fixed: 'left'},
{field: 'name', title: '代理商名称', width: 300, fixed: 'left', slots: {default: 'name_default'}},
{field: 'crtim', title: '创建时间', width: 160},
{field: 'notes', title: '备注'}
],
});
const test=async ()=>{
alert("检查后台事务是否回滚");
await defHttp.post({url: '/sa/agent/main/test'});
// alert("检查后台事务是否回滚");
// VXETable.modal.message({ content: `检查后台事务是否回滚`, status: 'success' })
}
onMounted(() => {
listInit(state, gridOptions);
});
//--------------------------------------------------------------------------------------------------
const [registerDrawer, {openDrawer}] = useDrawer();
function handleSuccess() {
searchEvent();
}
</script>
<style>
.v-list {
background-color: white;
margin: 6px;
}
.v-list-head {
border-left: 1px solid #e4e7ed;
border-right: 1px solid #e4e7ed;
border-top: 1px solid #e4e7ed;
height: 49px;
padding: 8px;
}
.v-list-body {
border: 1px solid #e4e7ed;
padding: 8px;
}
.list-search {
width: 200px;
margin-right: 10px;
}
.v-btn-primary {
color: #409eff;
border: 1px solid #9fceff;
background: #ebf5f5
}
.v-btn-success {
color: #67c23a;
border: 1px solid #b3e19d;
background: #f0f9eb
}
.v-btn-success:hover {
color: green;
border: 1px solid green;
background: #f0f9eb
}
.v-btn-danger {
color: #f56c6c;
border: 1px solid #fab6b6;
background: #fef0f0
}
.v-btn-danger:hover {
color: #e53838;
border: 1px solid #e53838;
background: #fef0f0
}
</style>
src/pages/sa/agent/main/index2.vue
+62
View File
@@ -0,0 +1,62 @@
<template>
<PageWrapper class="ztable" contentFullHeight>
<vxe-grid ref='xGrid' v-bind="gridOptions">
<template #tbtns>
<vxe-input v-model="formData.name" placeholder="输入名称查询"></vxe-input>
<vxe-button @click="searchEvent" status="primary">查 询</vxe-button>
<vxe-button @click="addEvent({},openDrawer)">新 增</vxe-button>
<vxe-button @click="deleteEvent($refs.xGrid)">删 除</vxe-button>
<!-- <vxe-button @click="test()">同时使用JPA与mybatis-plus的事务测试</vxe-button>-->
</template>
<template #name_default="{ row }">
<span style="cursor:pointer;color: #3e9ece"
@click="editEvent({id:row.id},openDrawer)">{{ row.name }}</span>
</template>
</vxe-grid>
<AgentMainDrawer @register="registerDrawer" @success="handleSuccess"/>
</PageWrapper>
</template>
<script lang="ts">
export default {name: 'SaAgentMain', inheritAttrs: false}
</script>
<script lang="ts" setup>
import {PageWrapper} from '/@/components/Page';
import {reactive, ref} from 'vue'
import {VxeGridInstance, VxeGridProps} from 'vxe-table'
import AgentMainDrawer from './AgentMainDrawer.vue';
import {useDrawer} from '/@/components/Drawer';
import {deleteEvent, addEvent, editEvent, createOption} from '/@/comps/vxe/list';
import { defHttp } from "/@/utils/http/axios";
import {VXETable} from 'vxe-table'
const xGrid = ref({} as VxeGridInstance)
const formData = reactive({name: ''})
const gridOptions = reactive<VxeGridProps>(createOption('/sa/agent/main', {}, formData, [
{type: 'checkbox', align: 'center', width: 42, fixed: 'left'},
{type: 'seq', align: 'center', width: 50, fixed: 'left'},
{field: 'name', title: '代理商名称', width: 300, fixed: 'left', slots: {default: 'name_default'}},
{field: 'crtim', title: '创建时间', width: 160},
{field: 'notes', title: '备注'}
]));
const searchEvent = () => {
xGrid.value.commitProxy('query')
}
const test=async ()=>{
alert("检查后台事务是否回滚");
await defHttp.post({url: '/sa/agent/main/test'});
// alert("检查后台事务是否回滚");
// VXETable.modal.message({ content: `检查后台事务是否回滚`, status: 'success' })
}
//--------------------------------------------------------------------------------------------------
const [registerDrawer, {openDrawer}] = useDrawer();
function handleSuccess() {
searchEvent();
}
</script>
src/pages/wf/tem/main/edit.vue
+1 -1
View File
@@ -10,7 +10,7 @@
<div style="border-top: 1px solid #cccccc;border-right: 1px solid #cccccc; ">
<Row>
<Col :span="12" class="zitem">
<div class="zitem-title"><span style="color: red">* </span>模板名称</div>
<div class="zitem-title"><span style="color: red">* </span>模板名称模板名称模板名称模板名称模板名称模板名称模板名称</div>
<div class="zitem-input">
<vxe-input v-model="vform.data.name" />
</div>
src/router/routes/index.ts
+10
View File
@@ -37,9 +37,19 @@ export const LoginRoute: AppRouteRecordRaw = {
},
};
export const LoginRoute2: AppRouteRecordRaw = {
path: '/login2',
name: 'Login2',
component: () => import('/@/pages/sa/agent/main/index.vue'),
meta: {
title: t('routes.basic.login'),
},
};
// Basic routing without permission
export const basicRoutes = [
LoginRoute,
LoginRoute2,
RootRoute,
...mainOutRoutes,
REDIRECT_ROUTE,
src/router/routes/vboot/sa.ts
+22
View File
@@ -1,6 +1,7 @@
import type { AppRouteModule } from '/@/router/types';
import { LAYOUT } from '/@/router/constant';
import {t} from "/@/hooks/web/useI18n";
const dashboard: AppRouteModule = {
path: '/sa',
@@ -25,6 +26,27 @@ const dashboard: AppRouteModule = {
// hideMenu: true,
},
},
{
path: 'agent/main/edit',
name: 'SaAgentMainEdit',
component: () => import('/@/pages/sa/agent/main/edit.vue'),
meta: {
title: '代理商编辑',
ignoreKeepAlive: false,
hideMenu: true,
},
},
{
path: 'agent/main2',
name: 'SaAgentMain2',
component: () => import('/@/pages/sa/agent/main/index2.vue'),
meta: {
title: '代理商清单2',
ignoreKeepAlive: false,
// icon: 'simple-icons:about-dot-me',
// hideMenu: true,
},
},
],
};