import templat and data for testing done
This commit is contained in:
parent
edd3ce61b4
commit
d5fb8b135b
@ -1,4 +1,5 @@
|
||||
{
|
||||
"singleQuote": true,
|
||||
"trailingComma": "all"
|
||||
"trailingComma": "all",
|
||||
"arrowParens": "always"
|
||||
}
|
||||
|
@ -1,8 +1,7 @@
|
||||
|
||||
const data = {
|
||||
orderNo: '101808023922',
|
||||
clientName: 'SongQingyang3',
|
||||
soldData: '2018-08-23',
|
||||
soldDate: '2018-08-23',
|
||||
contactName: 'K01',
|
||||
contactNo: '12345678901',
|
||||
deliveryAddress: 'D01',
|
||||
@ -10,12 +9,12 @@ const data = {
|
||||
boards: [
|
||||
{
|
||||
id: 1234,
|
||||
matierial: '颗粒板',
|
||||
material: '颗粒板',
|
||||
color: '暖白',
|
||||
boardInfos: [
|
||||
{
|
||||
houseName: 'F01',
|
||||
closetName: 'F01',
|
||||
closetName: 'G01',
|
||||
boardNo: 'B1816478862',
|
||||
boardName: '背板',
|
||||
length: 944,
|
||||
@ -26,12 +25,12 @@ const data = {
|
||||
mutation: '',
|
||||
shape: '',
|
||||
direction: '1/1/1/1 ',
|
||||
strip: '正纹',
|
||||
addOn: '',
|
||||
stripe: '正纹',
|
||||
boardAddOn: '',
|
||||
},
|
||||
{
|
||||
houseName: 'F01',
|
||||
closetName: 'F01',
|
||||
closetName: 'G01',
|
||||
boardNo: 'B1816478862',
|
||||
boardName: '层板',
|
||||
length: 944,
|
||||
@ -42,12 +41,12 @@ const data = {
|
||||
mutation: '',
|
||||
shape: '造型',
|
||||
direction: '1/1/1/1 ',
|
||||
strip: '正纹',
|
||||
addOn: '',
|
||||
stripe: '正纹',
|
||||
boardAddOn: '',
|
||||
},
|
||||
{
|
||||
houseName: 'F01',
|
||||
closetName: 'F01',
|
||||
closetName: 'G01',
|
||||
boardNo: 'B1816478875',
|
||||
boardName: '右侧板',
|
||||
length: 1198,
|
||||
@ -58,19 +57,24 @@ const data = {
|
||||
mutation: '',
|
||||
shape: '造型',
|
||||
direction: '1/1/1/1 ',
|
||||
strip: '正纹',
|
||||
addOn: '',
|
||||
stripe: '正纹',
|
||||
boardAddOn: '',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
],
|
||||
};
|
||||
|
||||
export default data;
|
||||
/*
|
||||
{
|
||||
id: 1235,
|
||||
matierial: '生态板 ',
|
||||
color: '暖白',
|
||||
boardInfos: [
|
||||
{
|
||||
houseName: 'F01',
|
||||
closetName: 'F01',
|
||||
closetName: 'G01',
|
||||
boardNo: 'B1816478862',
|
||||
boardName: '背板',
|
||||
length: 944,
|
||||
@ -81,13 +85,14 @@ const data = {
|
||||
mutation: '',
|
||||
shape: '',
|
||||
direction: '1/1/1/1 ',
|
||||
strip: '正纹',
|
||||
addOn: '',
|
||||
stripe: '正纹',
|
||||
boardAddOn: '',
|
||||
},
|
||||
{
|
||||
houseName: 'F01',
|
||||
closetName: 'F01',
|
||||
closetName: 'G01',
|
||||
boardNo: 'B1816478861',
|
||||
|
||||
boardName: '背板',
|
||||
length: 944,
|
||||
width: 598,
|
||||
@ -97,12 +102,10 @@ const data = {
|
||||
mutation: '',
|
||||
shape: '',
|
||||
direction: '1/1/1/1 ',
|
||||
strip: '正纹',
|
||||
addOn: '',
|
||||
stripe: '正纹',
|
||||
boardAddOn: '',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export default data;
|
||||
*/
|
||||
|
391
src/assets/startUpRowColumn.ts
Normal file
391
src/assets/startUpRowColumn.ts
Normal file
@ -0,0 +1,391 @@
|
||||
const startUpRowColumn = [
|
||||
{
|
||||
rowId: 0,
|
||||
rowTitle: 0,
|
||||
cells: [
|
||||
{
|
||||
cellId: 1,
|
||||
title: '1',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 2,
|
||||
title: '2',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 3,
|
||||
title: '3',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 4,
|
||||
title: '4',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 5,
|
||||
title: '5',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 6,
|
||||
title: '6',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 7,
|
||||
title: '7',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 8,
|
||||
title: '8',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 9,
|
||||
title: '9',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 10,
|
||||
title: '10',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 11,
|
||||
title: '11',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 12,
|
||||
title: '12',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 13,
|
||||
title: '13',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 14,
|
||||
title: '14',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 15,
|
||||
title: '15',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 16,
|
||||
title: '16',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 17,
|
||||
title: '17',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 18,
|
||||
title: '18',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 19,
|
||||
title: '19',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 20,
|
||||
title: '20',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 21,
|
||||
title: '21',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 22,
|
||||
title: '22',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 23,
|
||||
title: '23',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 24,
|
||||
title: '24',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
rowId: 1,
|
||||
|
||||
rowTitle: 1,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 2,
|
||||
|
||||
rowTitle: 2,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 3,
|
||||
|
||||
rowTitle: 3,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 4,
|
||||
|
||||
rowTitle: 4,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 6,
|
||||
|
||||
rowTitle: 6,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 8,
|
||||
|
||||
rowTitle: 8,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 9,
|
||||
rowTitle: 9,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 10,
|
||||
rowTitle: 10,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 11,
|
||||
rowTitle: 11,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 12,
|
||||
rowTitle: 12,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 13,
|
||||
rowTitle: 13,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 14,
|
||||
rowTitle: 14,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 15,
|
||||
rowTitle: 15,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 16,
|
||||
rowTitle: 16,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 17,
|
||||
rowTitle: 17,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 18,
|
||||
rowTitle: 18,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 19,
|
||||
rowTitle: 19,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 20,
|
||||
rowTitle: 20,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 21,
|
||||
rowTitle: 21,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 22,
|
||||
rowTitle: 22,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 23,
|
||||
rowTitle: 23,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 24,
|
||||
rowTitle: 24,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 25,
|
||||
rowTitle: 25,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 26,
|
||||
rowTitle: 26,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 27,
|
||||
rowTitle: 27,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 28,
|
||||
rowTitle: 28,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 29,
|
||||
rowTitle: 29,
|
||||
cells: [],
|
||||
},
|
||||
];
|
||||
|
||||
export default startUpRowColumn;
|
647
src/assets/templateInitialData.ts
Normal file
647
src/assets/templateInitialData.ts
Normal file
@ -0,0 +1,647 @@
|
||||
const initialTemplateData = [
|
||||
{
|
||||
rowId: 0,
|
||||
rowTitle: 0,
|
||||
cells: [
|
||||
{
|
||||
cellId: 1,
|
||||
title: '1',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 2,
|
||||
title: '2',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 3,
|
||||
title: '3',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 4,
|
||||
title: '4',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 5,
|
||||
title: '5',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 6,
|
||||
title: '6',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 7,
|
||||
title: '7',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 8,
|
||||
title: '8',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 9,
|
||||
title: '9',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 10,
|
||||
title: '10',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 11,
|
||||
title: '11',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 12,
|
||||
title: '12',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 13,
|
||||
title: '13',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 14,
|
||||
title: '14',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 15,
|
||||
title: '15',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 16,
|
||||
title: '16',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 17,
|
||||
title: '17',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 18,
|
||||
title: '18',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 19,
|
||||
title: '19',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 20,
|
||||
title: '20',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 21,
|
||||
title: '21',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 22,
|
||||
title: '22',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 23,
|
||||
title: '23',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 24,
|
||||
title: '24',
|
||||
colspan: 1,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
rowId: 1,
|
||||
|
||||
rowTitle: 1,
|
||||
cells: [
|
||||
{
|
||||
cellId: 9001,
|
||||
title: '板材明细单',
|
||||
colspan: 24,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
rowId: 2,
|
||||
|
||||
rowTitle: 2,
|
||||
cells: [
|
||||
{
|
||||
cellId: 9002,
|
||||
title: 'orderNo:',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 9003,
|
||||
title: 'clientName:',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 9004,
|
||||
title: 'soldDate:',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
rowId: 3,
|
||||
|
||||
rowTitle: 3,
|
||||
cells: [
|
||||
{
|
||||
cellId: 9005,
|
||||
title: 'contactName:',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 9006,
|
||||
title: 'contactNo:',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
{
|
||||
cellId: 9007,
|
||||
title: 'deliveryAddress:',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
rowId: 4,
|
||||
|
||||
rowTitle: 4,
|
||||
cells: [
|
||||
{
|
||||
cellId: 9008,
|
||||
title: 'addOn:',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
rowId: 6,
|
||||
|
||||
rowTitle: 6,
|
||||
cells: [
|
||||
{
|
||||
cellId: 9009,
|
||||
title: 'material:',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'left',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9010,
|
||||
title: 'color:',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'left',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9011,
|
||||
title: '共15条记录',
|
||||
colspan: 8,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'left',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
rowId: 8,
|
||||
|
||||
rowTitle: 8,
|
||||
cells: [
|
||||
{
|
||||
cellId: 9012,
|
||||
title: 'houseName',
|
||||
colspan: 2,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9013,
|
||||
title: 'closetName',
|
||||
colspan: 0,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9014,
|
||||
title: 'boardNo',
|
||||
colspan: 2,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9015,
|
||||
title: 'boardName',
|
||||
colspan: 2,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9016,
|
||||
title: 'length',
|
||||
colspan: 0,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9017,
|
||||
title: 'width',
|
||||
colspan: 0,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9018,
|
||||
title: 'thickness',
|
||||
colspan: 0,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9019,
|
||||
title: 'quantity',
|
||||
colspan: 0,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9020,
|
||||
title: 'area',
|
||||
colspan: 0,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9021,
|
||||
title: 'mutation',
|
||||
colspan: 0,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9022,
|
||||
title: 'shape',
|
||||
colspan: 0,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9023,
|
||||
title: 'direction',
|
||||
colspan: 3,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9024,
|
||||
title: 'stripe',
|
||||
colspan: 2,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
{
|
||||
cellId: 9025,
|
||||
title: 'boardAddOn',
|
||||
colspan: 5,
|
||||
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'bold',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
rowId: 9,
|
||||
rowTitle: 9,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 10,
|
||||
rowTitle: 10,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 11,
|
||||
rowTitle: 11,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 12,
|
||||
rowTitle: 12,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 13,
|
||||
rowTitle: 13,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 14,
|
||||
rowTitle: 14,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 15,
|
||||
rowTitle: 15,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 16,
|
||||
rowTitle: 16,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 17,
|
||||
rowTitle: 17,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 18,
|
||||
rowTitle: 18,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 19,
|
||||
rowTitle: 19,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 20,
|
||||
rowTitle: 20,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 21,
|
||||
rowTitle: 21,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 22,
|
||||
rowTitle: 22,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 23,
|
||||
rowTitle: 23,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 24,
|
||||
rowTitle: 24,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 25,
|
||||
rowTitle: 25,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 26,
|
||||
rowTitle: 26,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 27,
|
||||
rowTitle: 27,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 28,
|
||||
rowTitle: 28,
|
||||
cells: [],
|
||||
},
|
||||
{
|
||||
rowId: 29,
|
||||
rowTitle: 29,
|
||||
cells: [],
|
||||
},
|
||||
];
|
||||
|
||||
export default initialTemplateData;
|
@ -2,39 +2,25 @@
|
||||
<div class='main'>
|
||||
<div class='empty'></div>
|
||||
<div class='content'>
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<input class='row-counter' type="button" value="行0">
|
||||
|
||||
<td class='cell-counter' v-for="cell in initialCells">{{cell.title}}</td>
|
||||
</tr>
|
||||
<tr v-for="row in rows" :key="row.rowId" :cells="row.cells" v-bind:class="{active:row.rowId===selectedRow}">
|
||||
<tr v-for="row in rows" :key="row.rowId" :cells="row.cells">
|
||||
<input class='row-counter' type="button" :value='row.rowId' @click="rowClickHandler(row)">
|
||||
|
||||
<reportCell v-for="cell in row.cells" :cell="cell" v-on:cellIdFromChild="getCellFromChildren" :key="cell.cellId" v-bind:class="{active:cell.cellId===selectedCell}"></reportCell>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class='side'>
|
||||
<div>
|
||||
<span>
|
||||
<strong>现在列:</strong>
|
||||
</span>{{selectedRow}}
|
||||
<span>
|
||||
<strong>现在行:</strong>
|
||||
</span>{{selectedCell}}
|
||||
|
||||
</div>
|
||||
<div class='row-tool'>
|
||||
<button @click="addRow">添加行</button>
|
||||
<button @click="deleteRow">删除行</button>
|
||||
</div>
|
||||
<div class='td-tool'>
|
||||
<button @click="addCell(selectedRow)">添加列</button>
|
||||
<button @click="deleteCell(selectedCell)">删除列</button>
|
||||
<button @click="addCell()">添加列</button>
|
||||
<button @click="deleteCell()">删除列</button>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
<label>表头:</label><input type="text" v-model="inputTitle"><br>
|
||||
|
||||
<label>宽度:</label><input type="number" v-model="inputColspan"><br>
|
||||
@ -60,54 +46,57 @@
|
||||
<label for="three">居右</label>
|
||||
<br>
|
||||
<button @click="undoHandler">undo</button>
|
||||
<button @click="redoHandler">redo</button><br>
|
||||
<div>
|
||||
<p style="
|
||||
color: blue">以下功能用于测试使用</p>
|
||||
<!-- <button @click="importTemplate">导入设计模板</button> -->
|
||||
<button @click="importTemplate">导入设计样式</button>
|
||||
<button @click="importData">导入数据</button><br>
|
||||
<label>单元ID:</label>
|
||||
<span>{{selectedCell}}</span><br>
|
||||
<label>行ID:</label>
|
||||
<span>{{selectedRow}}</span><br>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{{inputColspan}} {{infos}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import Vue from 'vue';
|
||||
import initialTemplateData from '@/assets/templateInitialData'; // report template for testing
|
||||
import startUpRowColumn from '@/assets/startUpRowColumn'; // report template for testing
|
||||
import data from '@/assets/data'; // userdata for testing use
|
||||
import reportCell from './reportCell.vue';
|
||||
const infosFormat: Array<{
|
||||
rowId: string;
|
||||
cells: Array<{ cellId: number; title: string }>;
|
||||
}> = [];
|
||||
rowId: number;
|
||||
cells: Array<{
|
||||
cellId: number;
|
||||
title: string;
|
||||
colspan: number;
|
||||
height: number;
|
||||
textAlign: string;
|
||||
fontSize: number;
|
||||
fontStyle: string;
|
||||
}>;
|
||||
}> = startUpRowColumn;
|
||||
const selectedRowFormat: number = 0;
|
||||
const selectedCellFormat: number = 9000;
|
||||
const inputTitleFormat: string = '';
|
||||
const inputColspanFormat: number = 0;
|
||||
const initialCellsFormat: Array<{ cellId: number; title: string }> = [
|
||||
{ cellId: 1, title: '1' },
|
||||
{ cellId: 2, title: '2' },
|
||||
{ cellId: 3, title: '3' },
|
||||
{ cellId: 4, title: '4' },
|
||||
{ cellId: 5, title: '5' },
|
||||
{ cellId: 6, title: '6' },
|
||||
{ cellId: 7, title: '7' },
|
||||
{ cellId: 8, title: '8' },
|
||||
{ cellId: 9, title: '9' },
|
||||
{ cellId: 10, title: '10' },
|
||||
{ cellId: 11, title: '11' },
|
||||
{ cellId: 12, title: '12' },
|
||||
{ cellId: 13, title: '13' },
|
||||
{ cellId: 14, title: '14' },
|
||||
{ cellId: 15, title: '15' },
|
||||
{ cellId: 16, title: '16' },
|
||||
{ cellId: 17, title: '17' },
|
||||
{ cellId: 18, title: '18' },
|
||||
{ cellId: 19, title: '19' },
|
||||
{ cellId: 20, title: '20' },
|
||||
{ cellId: 21, title: '21' },
|
||||
{ cellId: 22, title: '22' },
|
||||
{ cellId: 23, title: '23' },
|
||||
{ cellId: 24, title: '24' },
|
||||
];
|
||||
let rowId = 0;
|
||||
let cellId = 9000;
|
||||
let initialInputColspan = 0;
|
||||
let initialInputHeight = 30;
|
||||
let pointer = 0;
|
||||
const recordHistoryFormat: string[] = [];
|
||||
const textAlignFormat: string = '';
|
||||
const fontSizeFormat: number = 0;
|
||||
const fontStyleFormat: string = '';
|
||||
const importedDataFormat: any = data;
|
||||
let rowId = 29;
|
||||
let cellId = 9025;
|
||||
const initialInputColspan = 0;
|
||||
const initialInputHeight = 30;
|
||||
let undoRodoPointer = -1;
|
||||
export default Vue.extend({
|
||||
components: { reportCell },
|
||||
data() {
|
||||
@ -118,23 +107,22 @@ export default Vue.extend({
|
||||
inputTitle: inputTitleFormat,
|
||||
inputColspan: inputColspanFormat,
|
||||
inputHeight: initialInputHeight,
|
||||
initialCells: initialCellsFormat,
|
||||
textAlign: '',
|
||||
fontSize: '',
|
||||
fontStyle: '',
|
||||
recordHistory: [],
|
||||
textAlign: textAlignFormat,
|
||||
fontSize: fontSizeFormat,
|
||||
fontStyle: fontStyleFormat,
|
||||
recordHistory: recordHistoryFormat,
|
||||
importedData: importedDataFormat,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
rows(): any {
|
||||
// Array<{rowId: string;cells: Array<{ cellId: number; title: string }>;}>
|
||||
for (const row of this.infos) {
|
||||
for (const cellIndex in row.cells) {
|
||||
if (row.cells[cellIndex].cellId === this.selectedCell) {
|
||||
row.cells.splice(Number(cellIndex), 1, {
|
||||
for (const cellKey in row.cells) {
|
||||
if (row.cells[cellKey].cellId === this.selectedCell) {
|
||||
row.cells.splice(Number(cellKey), 1, {
|
||||
cellId: this.selectedCell,
|
||||
title: this.inputTitle,
|
||||
colspan: this.inputColspan,
|
||||
cellId: this.selectedCell,
|
||||
height: this.inputHeight,
|
||||
textAlign: this.textAlign,
|
||||
fontSize: this.fontSize,
|
||||
@ -144,12 +132,15 @@ export default Vue.extend({
|
||||
}
|
||||
}
|
||||
|
||||
this.recordHistory.push(JSON.parse(JSON.stringify(this.infos)));
|
||||
pointer += 1;
|
||||
if (
|
||||
this.recordHistory[this.recordHistory.length - 1] !==
|
||||
JSON.stringify(this.infos)
|
||||
) {
|
||||
this.recordHistory.push(JSON.stringify(this.infos));
|
||||
}
|
||||
|
||||
return this.infos;
|
||||
},
|
||||
styled() {},
|
||||
},
|
||||
methods: {
|
||||
getCellFromChildren(cell: {
|
||||
@ -157,6 +148,9 @@ export default Vue.extend({
|
||||
title: string;
|
||||
colspan: number;
|
||||
height: number;
|
||||
textAlign: string;
|
||||
fontSize: number;
|
||||
fontStyle: string;
|
||||
}): void {
|
||||
this.selectedCell = cell.cellId;
|
||||
this.inputTitle = cell.title;
|
||||
@ -167,58 +161,131 @@ export default Vue.extend({
|
||||
this.fontStyle = cell.fontStyle;
|
||||
},
|
||||
addRow() {
|
||||
this.infos.push({
|
||||
rowId: '行' + (rowId += 1),
|
||||
cells: [],
|
||||
});
|
||||
if (this.selectedRow) {
|
||||
for (const index in this.infos) {
|
||||
if (this.selectedRow === this.infos[index].rowId) {
|
||||
this.infos.splice(Number(index), 0, {
|
||||
rowId: (this.selectedRow += 0.1),
|
||||
cells: [],
|
||||
});
|
||||
this.selectedRow = 0;
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.infos.push({
|
||||
rowId: (rowId += 1),
|
||||
cells: [],
|
||||
});
|
||||
}
|
||||
},
|
||||
deleteRow() {
|
||||
this.infos = this.infos.filter(item => item.rowId !== this.selectedRow);
|
||||
if (!this.selectedRow) {
|
||||
return alert('请选择要删除行');
|
||||
}
|
||||
this.infos = this.infos.filter((item) => item.rowId !== this.selectedRow);
|
||||
},
|
||||
addCell(id: string) {
|
||||
addCell() {
|
||||
if (!this.selectedRow) {
|
||||
return alert('请选择要添加单元的行');
|
||||
}
|
||||
for (const row of this.infos) {
|
||||
if (id === row.rowId) {
|
||||
if (this.selectedRow === row.rowId) {
|
||||
row.cells.push({
|
||||
cellId: (cellId += 1),
|
||||
title: '列' + cellId,
|
||||
colspan: initialInputColspan,
|
||||
height: initialInputHeight,
|
||||
textAlign: 'center',
|
||||
fontSize: '16',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
deleteCell(id: number) {
|
||||
deleteCell() {
|
||||
if (!this.selectedCell) {
|
||||
return alert('请选择要删除的单元');
|
||||
}
|
||||
for (const row of this.infos) {
|
||||
for (const cell in row.cells) {
|
||||
if (row.cells[cell].cellId === id) {
|
||||
if (row.cells[cell].cellId === this.selectedCell) {
|
||||
row.cells.splice(Number(cell), 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
// <button @click="updateUserInput">更新</button>
|
||||
// updateUserInput() {
|
||||
// for (const row of this.infos) {
|
||||
// for (const cellIndex in row.cells) {
|
||||
// if (row.cells[cellIndex].cellId === this.selectedCell) {
|
||||
// row.cells.splice(Number(cellIndex), 1, {
|
||||
// title: this.inputTitle,
|
||||
// colspan: this.inputColspan,
|
||||
// cellId: this.selectedCell,
|
||||
// height: this.inputHeight,
|
||||
// textAlign: this.textAlign,
|
||||
// });
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
rowClickHandler(row): void {
|
||||
rowClickHandler(row: any): void {
|
||||
this.selectedRow = row.rowId;
|
||||
},
|
||||
undoHandler() {},
|
||||
undoHandler() {
|
||||
if (undoRodoPointer < 0) {
|
||||
undoRodoPointer = this.recordHistory.length - 1;
|
||||
}
|
||||
this.infos = JSON.parse(this.recordHistory[undoRodoPointer - 1]);
|
||||
undoRodoPointer -= 1;
|
||||
},
|
||||
|
||||
redoHandler() {
|
||||
if (undoRodoPointer < 0) {
|
||||
undoRodoPointer = this.recordHistory.length - 1;
|
||||
}
|
||||
this.infos = JSON.parse(this.recordHistory[undoRodoPointer + 1]);
|
||||
undoRodoPointer += 1;
|
||||
},
|
||||
importData() {
|
||||
for (const row of this.infos) {
|
||||
for (const cell of row.cells) {
|
||||
// userdata for loop
|
||||
for (const userData in this.importedData) {
|
||||
if (userData + ':' === cell.title) {
|
||||
cell.title += this.importedData[userData];
|
||||
}
|
||||
}
|
||||
for (const boards of this.importedData.boards) {
|
||||
for (const board in boards) {
|
||||
if (board + ':' === cell.title) {
|
||||
cell.title += boards[board];
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
for (const row of this.infos) {
|
||||
// get each cell
|
||||
|
||||
const borderInfo: any = this.importedData.boards[0].boardInfos;
|
||||
for (const details of borderInfo) {
|
||||
const tem: any[] = [];
|
||||
for (const each of Object.keys(details)) {
|
||||
for (const cell of row.cells) {
|
||||
if (each === cell.title) {
|
||||
tem.push({
|
||||
cellId: (cellId += 1),
|
||||
title: details[each],
|
||||
colspan: cell.colspan,
|
||||
height: 30,
|
||||
textAlign: 'center',
|
||||
fontSize: 16,
|
||||
fontStyle: 'normal',
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
if (tem.length) {
|
||||
for (const eachRow of this.infos) {
|
||||
if (!eachRow.cells.length) {
|
||||
eachRow.cells = eachRow.cells.concat(tem);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
importTemplate() {
|
||||
this.infos = initialTemplateData;
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
@ -237,18 +304,15 @@ export default Vue.extend({
|
||||
|
||||
.side {
|
||||
background-color: lightgray;
|
||||
height: 300px;
|
||||
height: 100hv;
|
||||
width: 20%;
|
||||
}
|
||||
}
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
|
||||
margin-top: 22px;
|
||||
border: 1px black solid;
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
// text-align: center;
|
||||
tr {
|
||||
border: 1px black solid;
|
||||
}
|
||||
@ -273,7 +337,6 @@ table {
|
||||
}
|
||||
|
||||
.active {
|
||||
width: 100%;
|
||||
background-color: lightgray;
|
||||
}
|
||||
</style>
|
||||
|
256
temdata.txt
Normal file
256
temdata.txt
Normal file
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user