@things-factory/board-ui 9.0.0-beta.76 → 9.0.0-beta.77
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist-client/pages/board-list-page.d.ts +6 -20
- package/dist-client/pages/board-list-page.js +3 -1
- package/dist-client/pages/board-list-page.js.map +1 -1
- package/dist-client/pages/board-template/board-template-list-page.d.ts +3 -1
- package/dist-client/pages/board-template/board-template-list-page.js +27 -1
- package/dist-client/pages/board-template/board-template-list-page.js.map +1 -1
- package/dist-client/tsconfig.tsbuildinfo +1 -1
- package/dist-client/viewparts/board-template-info.d.ts +22 -0
- package/dist-client/viewparts/board-template-info.js +250 -0
- package/dist-client/viewparts/board-template-info.js.map +1 -0
- package/package.json +2 -2
- package/translations/en.json +2 -0
- package/translations/ja.json +2 -0
- package/translations/ko.json +2 -0
- package/translations/ms.json +2 -0
- package/translations/zh.json +2 -0
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { LitElement } from 'lit';
|
|
2
|
+
declare const BoardTemplateInfo_base: (new (...args: any[]) => {
|
|
3
|
+
_storeUnsubscribe: import("redux").Unsubscribe;
|
|
4
|
+
connectedCallback(): void;
|
|
5
|
+
disconnectedCallback(): void;
|
|
6
|
+
stateChanged(_state: unknown): void;
|
|
7
|
+
readonly isConnected: boolean;
|
|
8
|
+
}) & typeof LitElement;
|
|
9
|
+
export declare class BoardTemplateInfo extends BoardTemplateInfo_base {
|
|
10
|
+
static styles: import("lit").CSSResult[];
|
|
11
|
+
constructor();
|
|
12
|
+
template: any;
|
|
13
|
+
username: string;
|
|
14
|
+
form: HTMLFormElement;
|
|
15
|
+
stateChanged(state: any): void;
|
|
16
|
+
get isMine(): boolean;
|
|
17
|
+
render(): import("lit-html").TemplateResult<1>;
|
|
18
|
+
onUpdate(): Promise<void>;
|
|
19
|
+
onDelete(): Promise<void>;
|
|
20
|
+
notify(level: any, message: any, ex?: Error | any): void;
|
|
21
|
+
}
|
|
22
|
+
export {};
|
|
@@ -0,0 +1,250 @@
|
|
|
1
|
+
import { __decorate, __metadata } from "tslib";
|
|
2
|
+
import { html, css, LitElement } from 'lit';
|
|
3
|
+
import { customElement, property, query, state } from 'lit/decorators.js';
|
|
4
|
+
import gql from 'graphql-tag';
|
|
5
|
+
import { connect } from 'pwa-helpers/connect-mixin';
|
|
6
|
+
import { store } from '@operato/shell';
|
|
7
|
+
import { client } from '@operato/graphql';
|
|
8
|
+
import { i18next } from '@operato/i18n';
|
|
9
|
+
import { OxPrompt } from '@operato/popup';
|
|
10
|
+
import { ScrollbarStyles } from '@operato/styles';
|
|
11
|
+
let BoardTemplateInfo = class BoardTemplateInfo extends connect(store)(LitElement) {
|
|
12
|
+
constructor() {
|
|
13
|
+
super();
|
|
14
|
+
this.username = '';
|
|
15
|
+
this.template = {
|
|
16
|
+
name: '',
|
|
17
|
+
description: '',
|
|
18
|
+
visibility: 'private'
|
|
19
|
+
};
|
|
20
|
+
}
|
|
21
|
+
stateChanged(state) {
|
|
22
|
+
var _a, _b;
|
|
23
|
+
this.username = ((_b = (_a = state.auth) === null || _a === void 0 ? void 0 : _a.user) === null || _b === void 0 ? void 0 : _b.username) || '';
|
|
24
|
+
}
|
|
25
|
+
get isMine() {
|
|
26
|
+
var _a, _b;
|
|
27
|
+
return ((_b = (_a = this.template) === null || _a === void 0 ? void 0 : _a.creator) === null || _b === void 0 ? void 0 : _b.username) === this.username;
|
|
28
|
+
}
|
|
29
|
+
render() {
|
|
30
|
+
return html `
|
|
31
|
+
<form>
|
|
32
|
+
<fieldset>
|
|
33
|
+
<legend>${i18next.t('label.board-template')}</legend>
|
|
34
|
+
<label>${i18next.t('field.name')}</label>
|
|
35
|
+
<input
|
|
36
|
+
name="name"
|
|
37
|
+
.value=${this.template.name}
|
|
38
|
+
@input=${e => (this.template.name = e.target.value)}
|
|
39
|
+
?disabled=${!this.isMine}
|
|
40
|
+
/>
|
|
41
|
+
<label>${i18next.t('field.description')}</label>
|
|
42
|
+
<textarea
|
|
43
|
+
name="description"
|
|
44
|
+
.value=${this.template.description}
|
|
45
|
+
@input=${e => (this.template.description = e.target.value)}
|
|
46
|
+
?disabled=${!this.isMine}
|
|
47
|
+
></textarea>
|
|
48
|
+
<label>${i18next.t('field.visibility')}</label>
|
|
49
|
+
<select
|
|
50
|
+
name="visibility"
|
|
51
|
+
.value=${this.template.visibility}
|
|
52
|
+
@change=${e => (this.template.visibility = e.target.value)}
|
|
53
|
+
?disabled=${!this.isMine}
|
|
54
|
+
>
|
|
55
|
+
<option value="private">${i18next.t('label.visibility-private')}</option>
|
|
56
|
+
<option value="domain">${i18next.t('label.visibility-domain')}</option>
|
|
57
|
+
<option value="public">${i18next.t('label.visibility-public')}</option>
|
|
58
|
+
</select>
|
|
59
|
+
<div buttons>
|
|
60
|
+
${this.isMine
|
|
61
|
+
? html `
|
|
62
|
+
<button type="button" @click=${this.onUpdate}>${i18next.t('button.save')}</button>
|
|
63
|
+
<button type="button" @click=${this.onDelete}>${i18next.t('button.delete')}</button>
|
|
64
|
+
`
|
|
65
|
+
: ''}
|
|
66
|
+
</div>
|
|
67
|
+
</fieldset>
|
|
68
|
+
</form>
|
|
69
|
+
`;
|
|
70
|
+
}
|
|
71
|
+
async onUpdate() {
|
|
72
|
+
const formData = new FormData(this.form);
|
|
73
|
+
const patch = {};
|
|
74
|
+
for (const [key, value] of formData.entries()) {
|
|
75
|
+
patch[key] = value;
|
|
76
|
+
}
|
|
77
|
+
try {
|
|
78
|
+
await client.mutate({
|
|
79
|
+
mutation: gql `
|
|
80
|
+
mutation ($id: String!, $patch: BoardTemplatePatch!) {
|
|
81
|
+
updateBoardTemplate(id: $id, patch: $patch) {
|
|
82
|
+
id
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
`,
|
|
86
|
+
variables: {
|
|
87
|
+
id: this.template.id,
|
|
88
|
+
patch
|
|
89
|
+
}
|
|
90
|
+
});
|
|
91
|
+
this.notify('info', i18next.t('text.board-template updated'));
|
|
92
|
+
this.dispatchEvent(new CustomEvent('updated', { bubbles: true, composed: true }));
|
|
93
|
+
}
|
|
94
|
+
catch (ex) {
|
|
95
|
+
this.notify('error', ex, ex);
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
async onDelete() {
|
|
99
|
+
if (await OxPrompt.open({
|
|
100
|
+
title: i18next.t('text.are_you_sure'),
|
|
101
|
+
text: i18next.t('text.sure_to_x', { x: i18next.t('text.delete') }),
|
|
102
|
+
confirmButton: { text: i18next.t('button.confirm') },
|
|
103
|
+
cancelButton: { text: i18next.t('button.cancel') }
|
|
104
|
+
})) {
|
|
105
|
+
try {
|
|
106
|
+
await client.mutate({
|
|
107
|
+
mutation: gql `
|
|
108
|
+
mutation ($id: String!) {
|
|
109
|
+
deleteBoardTemplate(id: $id)
|
|
110
|
+
}
|
|
111
|
+
`,
|
|
112
|
+
variables: { id: this.template.id }
|
|
113
|
+
});
|
|
114
|
+
this.notify('info', i18next.t('text.board-template deleted'));
|
|
115
|
+
this.dispatchEvent(new CustomEvent('deleted', { bubbles: true, composed: true }));
|
|
116
|
+
}
|
|
117
|
+
catch (ex) {
|
|
118
|
+
this.notify('error', ex, ex);
|
|
119
|
+
}
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
notify(level, message, ex) {
|
|
123
|
+
document.dispatchEvent(new CustomEvent('notify', {
|
|
124
|
+
detail: {
|
|
125
|
+
level,
|
|
126
|
+
message,
|
|
127
|
+
ex
|
|
128
|
+
}
|
|
129
|
+
}));
|
|
130
|
+
}
|
|
131
|
+
};
|
|
132
|
+
BoardTemplateInfo.styles = [
|
|
133
|
+
ScrollbarStyles,
|
|
134
|
+
css `
|
|
135
|
+
:host {
|
|
136
|
+
height: 100%;
|
|
137
|
+
min-width: 360px;
|
|
138
|
+
|
|
139
|
+
display: flex;
|
|
140
|
+
flex-direction: column;
|
|
141
|
+
position: relative;
|
|
142
|
+
background-color: var(--md-sys-color-surface);
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
form {
|
|
146
|
+
display: grid;
|
|
147
|
+
grid-template-columns: repeat(12, 1fr);
|
|
148
|
+
grid-gap: var(--form-grid-gap);
|
|
149
|
+
grid-auto-rows: minmax(24px, auto);
|
|
150
|
+
padding: var(--padding-wide);
|
|
151
|
+
align-items: center;
|
|
152
|
+
|
|
153
|
+
--form-grid-gap: 2px 0;
|
|
154
|
+
--input-field-padding: var(--padding-default);
|
|
155
|
+
--legend-padding: var(--padding-default) 0 var(--padding-narrow) 0;
|
|
156
|
+
--mdc-button-horizontal-padding: var(--padding-default);
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
[buttons] {
|
|
160
|
+
grid-column: span 12;
|
|
161
|
+
padding: var(--padding-default) 0;
|
|
162
|
+
text-align: right;
|
|
163
|
+
}
|
|
164
|
+
|
|
165
|
+
[buttons] * {
|
|
166
|
+
margin: 0 0 0 var(--margin-narrow);
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
[danger] {
|
|
170
|
+
--md-assist-chip-elevated-container-color: var(--md-sys-color-error);
|
|
171
|
+
--md-assist-chip-label-text-color: var(--md-sys-color-on-error);
|
|
172
|
+
--md-assist-chip-leading-icon-color: var(--md-sys-color-on-error);
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
fieldset {
|
|
176
|
+
display: contents;
|
|
177
|
+
}
|
|
178
|
+
legend {
|
|
179
|
+
grid-column: span 12;
|
|
180
|
+
padding: var(--legend-padding);
|
|
181
|
+
font: var(--legend-font);
|
|
182
|
+
color: var(--primary-color);
|
|
183
|
+
text-transform: capitalize;
|
|
184
|
+
}
|
|
185
|
+
label {
|
|
186
|
+
grid-column: span 12;
|
|
187
|
+
text-transform: capitalize;
|
|
188
|
+
color: var(--label-color);
|
|
189
|
+
font: var(--label-font);
|
|
190
|
+
}
|
|
191
|
+
|
|
192
|
+
input,
|
|
193
|
+
textarea,
|
|
194
|
+
select {
|
|
195
|
+
grid-column: span 12;
|
|
196
|
+
border: 1px solid #ccc;
|
|
197
|
+
border-radius: 4px;
|
|
198
|
+
padding: 6px 8px;
|
|
199
|
+
font-size: 1rem;
|
|
200
|
+
margin-bottom: 8px;
|
|
201
|
+
}
|
|
202
|
+
textarea {
|
|
203
|
+
min-height: 100px;
|
|
204
|
+
resize: none;
|
|
205
|
+
}
|
|
206
|
+
div[buttons] {
|
|
207
|
+
grid-column: span 12;
|
|
208
|
+
text-align: right;
|
|
209
|
+
margin-top: 12px;
|
|
210
|
+
}
|
|
211
|
+
button {
|
|
212
|
+
margin-left: 8px;
|
|
213
|
+
padding: 6px 16px;
|
|
214
|
+
border-radius: 4px;
|
|
215
|
+
border: none;
|
|
216
|
+
background: var(--md-sys-color-tertiary, #1976d2);
|
|
217
|
+
color: #fff;
|
|
218
|
+
font-weight: 500;
|
|
219
|
+
cursor: pointer;
|
|
220
|
+
}
|
|
221
|
+
button[disabled] {
|
|
222
|
+
background: #ccc;
|
|
223
|
+
cursor: not-allowed;
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
@media screen and (max-width: 460px) {
|
|
227
|
+
:host {
|
|
228
|
+
width: 100vw;
|
|
229
|
+
}
|
|
230
|
+
}
|
|
231
|
+
`
|
|
232
|
+
];
|
|
233
|
+
__decorate([
|
|
234
|
+
property({ type: Object }),
|
|
235
|
+
__metadata("design:type", Object)
|
|
236
|
+
], BoardTemplateInfo.prototype, "template", void 0);
|
|
237
|
+
__decorate([
|
|
238
|
+
state(),
|
|
239
|
+
__metadata("design:type", String)
|
|
240
|
+
], BoardTemplateInfo.prototype, "username", void 0);
|
|
241
|
+
__decorate([
|
|
242
|
+
query('form'),
|
|
243
|
+
__metadata("design:type", HTMLFormElement)
|
|
244
|
+
], BoardTemplateInfo.prototype, "form", void 0);
|
|
245
|
+
BoardTemplateInfo = __decorate([
|
|
246
|
+
customElement('board-template-info'),
|
|
247
|
+
__metadata("design:paramtypes", [])
|
|
248
|
+
], BoardTemplateInfo);
|
|
249
|
+
export { BoardTemplateInfo };
|
|
250
|
+
//# sourceMappingURL=board-template-info.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"board-template-info.js","sourceRoot":"","sources":["../../client/viewparts/board-template-info.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, css, LitElement } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport gql from 'graphql-tag'\nimport { connect } from 'pwa-helpers/connect-mixin'\n\nimport { store } from '@operato/shell'\nimport { client } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { OxPrompt } from '@operato/popup'\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('board-template-info')\nexport class BoardTemplateInfo extends connect(store)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n height: 100%;\n min-width: 360px;\n\n display: flex;\n flex-direction: column;\n position: relative;\n background-color: var(--md-sys-color-surface);\n }\n\n form {\n display: grid;\n grid-template-columns: repeat(12, 1fr);\n grid-gap: var(--form-grid-gap);\n grid-auto-rows: minmax(24px, auto);\n padding: var(--padding-wide);\n align-items: center;\n\n --form-grid-gap: 2px 0;\n --input-field-padding: var(--padding-default);\n --legend-padding: var(--padding-default) 0 var(--padding-narrow) 0;\n --mdc-button-horizontal-padding: var(--padding-default);\n }\n\n [buttons] {\n grid-column: span 12;\n padding: var(--padding-default) 0;\n text-align: right;\n }\n\n [buttons] * {\n margin: 0 0 0 var(--margin-narrow);\n }\n\n [danger] {\n --md-assist-chip-elevated-container-color: var(--md-sys-color-error);\n --md-assist-chip-label-text-color: var(--md-sys-color-on-error);\n --md-assist-chip-leading-icon-color: var(--md-sys-color-on-error);\n }\n\n fieldset {\n display: contents;\n }\n legend {\n grid-column: span 12;\n padding: var(--legend-padding);\n font: var(--legend-font);\n color: var(--primary-color);\n text-transform: capitalize;\n }\n label {\n grid-column: span 12;\n text-transform: capitalize;\n color: var(--label-color);\n font: var(--label-font);\n }\n\n input,\n textarea,\n select {\n grid-column: span 12;\n border: 1px solid #ccc;\n border-radius: 4px;\n padding: 6px 8px;\n font-size: 1rem;\n margin-bottom: 8px;\n }\n textarea {\n min-height: 100px;\n resize: none;\n }\n div[buttons] {\n grid-column: span 12;\n text-align: right;\n margin-top: 12px;\n }\n button {\n margin-left: 8px;\n padding: 6px 16px;\n border-radius: 4px;\n border: none;\n background: var(--md-sys-color-tertiary, #1976d2);\n color: #fff;\n font-weight: 500;\n cursor: pointer;\n }\n button[disabled] {\n background: #ccc;\n cursor: not-allowed;\n }\n\n @media screen and (max-width: 460px) {\n :host {\n width: 100vw;\n }\n }\n `\n ]\n\n constructor() {\n super()\n this.template = {\n name: '',\n description: '',\n visibility: 'private'\n }\n }\n\n @property({ type: Object }) template: any\n @state() username: string = ''\n\n @query('form') form!: HTMLFormElement\n\n stateChanged(state: any) {\n this.username = state.auth?.user?.username || ''\n }\n\n get isMine() {\n return this.template?.creator?.username === this.username\n }\n\n render() {\n return html`\n <form>\n <fieldset>\n <legend>${i18next.t('label.board-template')}</legend>\n <label>${i18next.t('field.name')}</label>\n <input\n name=\"name\"\n .value=${this.template.name}\n @input=${e => (this.template.name = e.target.value)}\n ?disabled=${!this.isMine}\n />\n <label>${i18next.t('field.description')}</label>\n <textarea\n name=\"description\"\n .value=${this.template.description}\n @input=${e => (this.template.description = e.target.value)}\n ?disabled=${!this.isMine}\n ></textarea>\n <label>${i18next.t('field.visibility')}</label>\n <select\n name=\"visibility\"\n .value=${this.template.visibility}\n @change=${e => (this.template.visibility = e.target.value)}\n ?disabled=${!this.isMine}\n >\n <option value=\"private\">${i18next.t('label.visibility-private')}</option>\n <option value=\"domain\">${i18next.t('label.visibility-domain')}</option>\n <option value=\"public\">${i18next.t('label.visibility-public')}</option>\n </select>\n <div buttons>\n ${this.isMine\n ? html`\n <button type=\"button\" @click=${this.onUpdate}>${i18next.t('button.save')}</button>\n <button type=\"button\" @click=${this.onDelete}>${i18next.t('button.delete')}</button>\n `\n : ''}\n </div>\n </fieldset>\n </form>\n `\n }\n\n async onUpdate() {\n const formData = new FormData(this.form)\n const patch: any = {}\n for (const [key, value] of formData.entries()) {\n patch[key] = value\n }\n\n try {\n await client.mutate({\n mutation: gql`\n mutation ($id: String!, $patch: BoardTemplatePatch!) {\n updateBoardTemplate(id: $id, patch: $patch) {\n id\n }\n }\n `,\n variables: {\n id: this.template.id,\n patch\n }\n })\n this.notify('info', i18next.t('text.board-template updated'))\n this.dispatchEvent(new CustomEvent('updated', { bubbles: true, composed: true }))\n } catch (ex) {\n this.notify('error', ex, ex)\n }\n }\n\n async onDelete() {\n if (\n await OxPrompt.open({\n title: i18next.t('text.are_you_sure'),\n text: i18next.t('text.sure_to_x', { x: i18next.t('text.delete') }),\n confirmButton: { text: i18next.t('button.confirm') },\n cancelButton: { text: i18next.t('button.cancel') }\n })\n ) {\n try {\n await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n deleteBoardTemplate(id: $id)\n }\n `,\n variables: { id: this.template.id }\n })\n this.notify('info', i18next.t('text.board-template deleted'))\n this.dispatchEvent(new CustomEvent('deleted', { bubbles: true, composed: true }))\n } catch (ex) {\n this.notify('error', ex, ex)\n }\n }\n }\n\n notify(level, message, ex?: Error | any) {\n document.dispatchEvent(\n new CustomEvent('notify', {\n detail: {\n level,\n message,\n ex\n }\n })\n )\n }\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@things-factory/board-ui",
|
|
3
|
-
"version": "9.0.0-beta.
|
|
3
|
+
"version": "9.0.0-beta.77",
|
|
4
4
|
"main": "dist-server/index.js",
|
|
5
5
|
"browser": "dist-client/index.js",
|
|
6
6
|
"things-factory": true,
|
|
@@ -46,5 +46,5 @@
|
|
|
46
46
|
"@things-factory/fav-base": "^9.0.0-beta.76",
|
|
47
47
|
"@things-factory/utils": "^9.0.0-beta.71"
|
|
48
48
|
},
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "9d48627144cb6ca2644a6ecb4ed991b83252e516"
|
|
50
50
|
}
|
package/translations/en.json
CHANGED
|
@@ -633,6 +633,8 @@
|
|
|
633
633
|
"text.board released": "board '{board}' is released successfully",
|
|
634
634
|
"text.board reverted": "board '{board}' is reverted to version-'{version}' successfully",
|
|
635
635
|
"text.board updated": "board '{board}' is updated successfully",
|
|
636
|
+
"text.board-template deleted": "board template is deleted successfully",
|
|
637
|
+
"text.board-template updated": "board template is updated successfully",
|
|
636
638
|
"text.boards imported": "{count} boards are imported into group {group}",
|
|
637
639
|
"text.can-not-change-group": "You don't have authority to change group information!",
|
|
638
640
|
"text.can-not-version-up": "There exists not released version, can not create new version.",
|
package/translations/ja.json
CHANGED
|
@@ -636,6 +636,8 @@
|
|
|
636
636
|
"text.board released": "ボード'{board}'は正常にリリースされました",
|
|
637
637
|
"text.board reverted": "ボード '{board}' がバージョン '{version}' に正常に戻されました",
|
|
638
638
|
"text.board updated": "ボード'{board}'が修正されました",
|
|
639
|
+
"text.board-template deleted": "ボード テンプレートが正常に削除されました",
|
|
640
|
+
"text.board-template updated": "ボード テンプレートが正常に修正されました",
|
|
639
641
|
"text.boards imported": "{count} つのボードがグループ {group} にインポートされました",
|
|
640
642
|
"text.can-not-change-group": "グループ修正権限がありません.",
|
|
641
643
|
"text.can-not-version-up": "配布されていないバージョンがあるため, 新しいバージョンを作成できません.",
|
package/translations/ko.json
CHANGED
|
@@ -636,6 +636,8 @@
|
|
|
636
636
|
"text.board released": "보드 '{board}'이 배포되었습니다",
|
|
637
637
|
"text.board reverted": "보드 '{board}'이 버전-'{version}'으로 되돌려졌습니다",
|
|
638
638
|
"text.board updated": "보드 '{board}'이 수정되었습니다",
|
|
639
|
+
"text.board-template deleted": "보드 템플릿이 삭제되었습니다",
|
|
640
|
+
"text.board-template updated": "보드 템플릿이 수정되었습니다",
|
|
639
641
|
"text.boards imported": "{count}개의 보드를 그룹'{group}'으로 가져왔습니다",
|
|
640
642
|
"text.can-not-change-group": "그룹 수정 권한이 없습니다.",
|
|
641
643
|
"text.can-not-version-up": "배포되지 않은 버전이 있으므로, 새 버전을 생성할 수 없습니다.",
|
package/translations/ms.json
CHANGED
|
@@ -524,6 +524,8 @@
|
|
|
524
524
|
"text.board released": "papan '{board}' telah berjaya dikeluarkan",
|
|
525
525
|
"text.board reverted": "Papan '{board}' telah berjaya dikembalikan kepada versi '{version}'",
|
|
526
526
|
"text.board updated": "papan '{board}' berjaya dikemaskini",
|
|
527
|
+
"text.board-template deleted": "templat papan berjaya dipadam",
|
|
528
|
+
"text.board-template updated": "templat papan berjaya dikemaskini",
|
|
527
529
|
"text.boards imported": "{count} papan telah diimport ke dalam kumpulan {group}",
|
|
528
530
|
"text.cancel": "Batal",
|
|
529
531
|
"text.clear_changes": "Kosongkan Perubahan",
|
package/translations/zh.json
CHANGED
|
@@ -635,6 +635,8 @@
|
|
|
635
635
|
"text.board released": "看板 '{board}' 成功发布",
|
|
636
636
|
"text.board reverted": "面板 '{board}' 已成功还原至版本 '{version}'",
|
|
637
637
|
"text.board updated": "看板 '{board}' 更新成功",
|
|
638
|
+
"text.board-template deleted": "看板模版已删除",
|
|
639
|
+
"text.board-template updated": "看板模版已更新",
|
|
638
640
|
"text.boards imported": "已导入 {count} 个板块到群组 {group}",
|
|
639
641
|
"text.can-not-change-group": "无权更改组信息！",
|
|
640
642
|
"text.can-not-version-up": "当前存在未发布版本，无法创建新版本。",
|