mirror of
https://github.com/mayswind/ezbookkeeping.git
synced 2026-05-14 06:57:35 +08:00
support account color
This commit is contained in:
@@ -74,6 +74,7 @@ func startWebServer(c *cli.Context) error {
|
||||
_ = v.RegisterValidation("validUsername", validators.ValidUsername)
|
||||
_ = v.RegisterValidation("validEmail", validators.ValidEmail)
|
||||
_ = v.RegisterValidation("validCurrency", validators.ValidCurrency)
|
||||
_ = v.RegisterValidation("validRGBColor", validators.ValidRGBColor)
|
||||
}
|
||||
|
||||
router.NoRoute(bindApi(api.Default.ApiNotFound))
|
||||
|
||||
@@ -343,6 +343,7 @@ func (a *AccountsApi) createNewAccount(uid int64, accountCreateReq *models.Accou
|
||||
Category: accountCreateReq.Category,
|
||||
Type: accountCreateReq.Type,
|
||||
Icon: accountCreateReq.Icon,
|
||||
Color: accountCreateReq.Color,
|
||||
Currency: accountCreateReq.Currency,
|
||||
Comment: accountCreateReq.Comment,
|
||||
}
|
||||
@@ -369,6 +370,7 @@ func (a *AccountsApi) getToUpdateAccount(uid int64, accountModifyReq *models.Acc
|
||||
Name: accountModifyReq.Name,
|
||||
Category: accountModifyReq.Category,
|
||||
Icon: accountModifyReq.Icon,
|
||||
Color: accountModifyReq.Color,
|
||||
Comment: accountModifyReq.Comment,
|
||||
Hidden: accountModifyReq.Hidden,
|
||||
}
|
||||
@@ -376,6 +378,7 @@ func (a *AccountsApi) getToUpdateAccount(uid int64, accountModifyReq *models.Acc
|
||||
if newAccount.Name != oldAccount.Name ||
|
||||
newAccount.Category != oldAccount.Category ||
|
||||
newAccount.Icon != oldAccount.Icon ||
|
||||
newAccount.Color != oldAccount.Color ||
|
||||
newAccount.Comment != oldAccount.Comment ||
|
||||
newAccount.Hidden != oldAccount.Hidden {
|
||||
return newAccount
|
||||
|
||||
@@ -32,6 +32,7 @@ type Account struct {
|
||||
Name string `xorm:"VARCHAR(32) NOT NULL"`
|
||||
DisplayOrder int `xorm:"INDEX(IDX_account_uid_deleted_parent_account_id_order) NOT NULL"`
|
||||
Icon int64 `xorm:"NOT NULL"`
|
||||
Color string `xorm:"VARCHAR(6) NOT NULL"`
|
||||
Currency string `xorm:"VARCHAR(3) NOT NULL"`
|
||||
Balance int64 `xorm:"NOT NULL"`
|
||||
Comment string `xorm:"VARCHAR(255) NOT NULL"`
|
||||
@@ -46,6 +47,7 @@ type AccountCreateRequest struct {
|
||||
Category AccountCategory `json:"category" binding:"required"`
|
||||
Type AccountType `json:"type" binding:"required"`
|
||||
Icon int64 `json:"icon,string" binding:"required,min=1"`
|
||||
Color string `json:"color" binding:"required,len=6,validRGBColor"`
|
||||
Currency string `json:"currency" binding:"required,len=3,validCurrency"`
|
||||
Comment string `json:"comment" binding:"max=255"`
|
||||
SubAccounts []*AccountCreateRequest `json:"subAccounts" binding:"omitempty"`
|
||||
@@ -60,6 +62,7 @@ type AccountModifyRequest struct {
|
||||
Name string `json:"name" binding:"required,notBlank,max=32"`
|
||||
Category AccountCategory `json:"category" binding:"required"`
|
||||
Icon int64 `json:"icon,string" binding:"min=1"`
|
||||
Color string `json:"color" binding:"required,len=6,validRGBColor"`
|
||||
Comment string `json:"comment" binding:"max=255"`
|
||||
Hidden bool `json:"hidden"`
|
||||
SubAccounts []*AccountModifyRequest `json:"subAccounts" binding:"omitempty"`
|
||||
@@ -90,6 +93,7 @@ type AccountInfoResponse struct {
|
||||
Category AccountCategory `json:"category"`
|
||||
Type AccountType `json:"type"`
|
||||
Icon int64 `json:"icon,string"`
|
||||
Color string `json:"color"`
|
||||
Currency string `json:"currency"`
|
||||
Balance int64 `json:"balance"`
|
||||
Comment string `json:"comment"`
|
||||
@@ -106,6 +110,7 @@ func (a *Account) ToAccountInfoResponse() *AccountInfoResponse {
|
||||
Category: a.Category,
|
||||
Type: a.Type,
|
||||
Icon: a.Icon,
|
||||
Color: a.Color,
|
||||
Currency: a.Currency,
|
||||
Balance: a.Balance,
|
||||
Comment: a.Comment,
|
||||
|
||||
@@ -151,7 +151,7 @@ func (s *AccountService) ModifyAccounts(uid int64, accounts []*models.Account) e
|
||||
return s.UserDataDB(uid).DoTransaction(func(sess *xorm.Session) error {
|
||||
for i := 0; i < len(accounts); i++ {
|
||||
account := accounts[i]
|
||||
_, err := sess.Cols("name", "category", "icon", "comment", "hidden", "updated_unix_time").Where("account_id=? AND uid=? AND deleted=?", account.AccountId, uid, false).Update(account)
|
||||
_, err := sess.Cols("name", "category", "icon", "color", "comment", "hidden", "updated_unix_time").Where("account_id=? AND uid=? AND deleted=?", account.AccountId, uid, false).Update(account)
|
||||
|
||||
if err != nil {
|
||||
return err
|
||||
|
||||
@@ -5,6 +5,7 @@ import "regexp"
|
||||
var (
|
||||
UsernamePattern = regexp.MustCompile("^(?i)[a-z0-9_-]+$")
|
||||
EmailPattern = regexp.MustCompile("^(?i)(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|\"(?:[\\x01-\\x08\\x0b\\x0c\\x0e-\\x1f\\x21\\x23-\\x5b\\x5d-\\x7f]|\\\\[\\x01-\\x09\\x0b\\x0c\\x0e-\\x7f])*\")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\\[(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?|[a-z0-9-]*[a-z0-9]:(?:[\\x01-\\x08\\x0b\\x0c\\x0e-\\x1f\\x21-\\x5a\\x53-\\x7f]|\\\\[\\x01-\\x09\\x0b\\x0c\\x0e-\\x7f])+)\\])$")
|
||||
RGBColorPattern = regexp.MustCompile("^(?i)([0-9a-f]{6}|[0-9a-f]{3})$")
|
||||
)
|
||||
|
||||
func IsValidUsername(username string) bool {
|
||||
@@ -14,3 +15,7 @@ func IsValidUsername(username string) bool {
|
||||
func IsValidEmail(email string) bool {
|
||||
return EmailPattern.MatchString(email)
|
||||
}
|
||||
|
||||
func IsValidRGBColor(color string) bool {
|
||||
return RGBColorPattern.MatchString(color)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
package validators
|
||||
|
||||
import (
|
||||
"github.com/go-playground/validator/v10"
|
||||
|
||||
"github.com/mayswind/lab/pkg/utils"
|
||||
)
|
||||
|
||||
func ValidRGBColor(fl validator.FieldLevel) bool {
|
||||
if value, ok := fl.Field().Interface().(string); ok {
|
||||
if utils.IsValidRGBColor(value) {
|
||||
return true
|
||||
}
|
||||
}
|
||||
|
||||
return false
|
||||
}
|
||||
@@ -0,0 +1,22 @@
|
||||
const defaultAccountColor = '000000';
|
||||
const allAccountColors = [
|
||||
'000000', // black
|
||||
'8e8e93', // gray
|
||||
'ff3b30', // red
|
||||
'ff2d55', // pink
|
||||
'ff6b22', // deep orange
|
||||
'ff9500', // orange
|
||||
'ffcc00', // yellow
|
||||
'cddc39', // lime
|
||||
'009688', // teal
|
||||
'4cd964', // green
|
||||
'5ac8fa', // light blue
|
||||
'2196f3', // blue
|
||||
'673ab7', // deep purple
|
||||
'9c27b0', // purple
|
||||
];
|
||||
|
||||
export default {
|
||||
allAccountColors: allAccountColors,
|
||||
defaultAccountColor: defaultAccountColor,
|
||||
};
|
||||
+4
-2
@@ -169,23 +169,25 @@ export default {
|
||||
getAccount: ({ id }) => {
|
||||
return axios.get('v1/accounts/get.json?id=' + id);
|
||||
},
|
||||
addAccount: ({ category, type, name, icon, currency, comment, subAccounts }) => {
|
||||
addAccount: ({ category, type, name, icon, color, currency, comment, subAccounts }) => {
|
||||
return axios.post('v1/accounts/add.json', {
|
||||
category,
|
||||
type,
|
||||
name,
|
||||
icon,
|
||||
color,
|
||||
currency,
|
||||
comment,
|
||||
subAccounts
|
||||
});
|
||||
},
|
||||
modifyAccount: ({ id, category, name, icon, comment, hidden, subAccounts }) => {
|
||||
modifyAccount: ({ id, category, name, icon, color, comment, hidden, subAccounts }) => {
|
||||
return axios.post('v1/accounts/modify.json', {
|
||||
id,
|
||||
category,
|
||||
name,
|
||||
icon,
|
||||
color,
|
||||
comment,
|
||||
hidden,
|
||||
subAccounts
|
||||
|
||||
@@ -224,6 +224,7 @@ export default {
|
||||
'nickname': 'Nickname',
|
||||
'oldPassword': 'Current Password',
|
||||
'defaultCurrency': 'Default Currency',
|
||||
'color': 'Color',
|
||||
},
|
||||
'parameterizedError': {
|
||||
'parameter invalid': '{parameter} is invalid',
|
||||
@@ -328,6 +329,8 @@ export default {
|
||||
'Your sub account name': 'Your sub account name',
|
||||
'Account Icon': 'Account Icon',
|
||||
'Sub Account Icon': 'Sub Account Icon',
|
||||
'Account Color': 'Account Color',
|
||||
'Sub Account Color': 'Sub Account Color',
|
||||
'Currency': 'Currency',
|
||||
'Description': 'Description',
|
||||
'Your account description (optional)': 'Your account description (optional)',
|
||||
|
||||
@@ -224,6 +224,7 @@ export default {
|
||||
'nickname': '昵称',
|
||||
'oldPassword': '当前密码',
|
||||
'defaultCurrency': '默认货币',
|
||||
'color': '颜色',
|
||||
},
|
||||
'parameterizedError': {
|
||||
'parameter invalid': '{parameter}无效',
|
||||
@@ -328,6 +329,8 @@ export default {
|
||||
'Your sub account name': '你的子账户名称',
|
||||
'Account Icon': '账户图标',
|
||||
'Sub Account Icon': '子账户图标',
|
||||
'Account Color': '账户颜色',
|
||||
'Sub Account Color': '子账户颜色',
|
||||
'Currency': '货币',
|
||||
'Description': '描述',
|
||||
'Your account description (optional)': '你的账户描述 (可选)',
|
||||
|
||||
@@ -14,6 +14,7 @@ import 'framework7-icons';
|
||||
|
||||
import { getAllLanguages, getLanguage, getDefaultLanguage, getI18nOptions, getLocalizedError, getLocalizedErrorParameters } from './lib/i18n.js';
|
||||
import currency from './consts/currency.js';
|
||||
import colors from './consts/color.js';
|
||||
import icons from './consts/icon.js';
|
||||
import account from './consts/account.js';
|
||||
import version from './lib/version.js';
|
||||
@@ -36,6 +37,7 @@ const i18n = new VueI18n(getI18nOptions());
|
||||
Vue.prototype.$version = version.getVersion;
|
||||
Vue.prototype.$constants = {
|
||||
currency: currency,
|
||||
colors: colors,
|
||||
icons: icons,
|
||||
account: account,
|
||||
};
|
||||
|
||||
@@ -50,6 +50,7 @@
|
||||
<f7-list>
|
||||
<f7-list-input label="Account Name" placeholder="Your account name"></f7-list-input>
|
||||
<f7-list-item header="Account Icon" after="Icon"></f7-list-item>
|
||||
<f7-list-item header="Account Color" after="Color"></f7-list-item>
|
||||
<f7-list-input label="Currency" placeholder="Currency"></f7-list-input>
|
||||
<f7-list-input type="textarea" label="Description" placeholder="Your account description (optional)"></f7-list-input>
|
||||
</f7-list>
|
||||
@@ -70,7 +71,12 @@
|
||||
|
||||
<f7-list-item :header="$t('Account Icon')" key="singleTypeAccountIconSelection" link="#"
|
||||
@click="showIconSelectionSheet(account)">
|
||||
<f7-icon slot="after" :f7="account.icon | accountIcon"></f7-icon>
|
||||
<f7-icon slot="after" :f7="account.icon | accountIcon" :style="{ color: '#' + account.color }"></f7-icon>
|
||||
</f7-list-item>
|
||||
|
||||
<f7-list-item :header="$t('Account Color')" key="singleTypeAccountColorSelection" link="#"
|
||||
@click="showColorSelectionSheet(account)">
|
||||
<f7-icon slot="after" f7="app_fill" :style="{ color: '#' + account.color }"></f7-icon>
|
||||
</f7-list-item>
|
||||
|
||||
<f7-list-input
|
||||
@@ -114,7 +120,12 @@
|
||||
|
||||
<f7-list-item :header="$t('Account Icon')" key="multiTypeAccountIconSelection" link="#"
|
||||
@click="showIconSelectionSheet(account)">
|
||||
<f7-icon slot="after" :f7="account.icon | accountIcon"></f7-icon>
|
||||
<f7-icon slot="after" :f7="account.icon | accountIcon" :style="{ color: '#' + account.color }"></f7-icon>
|
||||
</f7-list-item>
|
||||
|
||||
<f7-list-item :header="$t('Account Color')" key="multiTypeAccountColorSelection" link="#"
|
||||
@click="showColorSelectionSheet(account)">
|
||||
<f7-icon slot="after" f7="app_fill" :style="{ color: '#' + account.color }"></f7-icon>
|
||||
</f7-list-item>
|
||||
|
||||
<f7-list-input
|
||||
@@ -151,7 +162,12 @@
|
||||
|
||||
<f7-list-item :header="$t('Sub Account Icon')" key="subAccountIconSelection" link="#"
|
||||
@click="showIconSelectionSheet(subAccount)">
|
||||
<f7-icon slot="after" :f7="subAccount.icon | accountIcon"></f7-icon>
|
||||
<f7-icon slot="after" :f7="subAccount.icon | accountIcon" :style="{ color: '#' + subAccount.color }"></f7-icon>
|
||||
</f7-list-item>
|
||||
|
||||
<f7-list-item :header="$t('Sub Account Color')" key="subAccountColorSelection" link="#"
|
||||
@click="showColorSelectionSheet(subAccount)">
|
||||
<f7-icon slot="after" f7="app_fill" :style="{ color: '#' + subAccount.color }"></f7-icon>
|
||||
</f7-list-item>
|
||||
|
||||
<f7-list-input
|
||||
@@ -207,6 +223,28 @@
|
||||
</f7-block>
|
||||
</f7-page-content>
|
||||
</f7-sheet>
|
||||
|
||||
<f7-sheet :opened="showColorSelection" @sheet:closed="hideColorSelectionSheet">
|
||||
<f7-toolbar>
|
||||
<div class="left"></div>
|
||||
<div class="right">
|
||||
<f7-link sheet-close :text="$t('Done')"></f7-link>
|
||||
</div>
|
||||
</f7-toolbar>
|
||||
<f7-page-content>
|
||||
<f7-block>
|
||||
<f7-row class="padding-vertical padding-horizontal-half" v-for="(row, idx) in allAccountColorRows" :key="idx">
|
||||
<f7-col v-for="accountColor in row" :key="accountColor.color">
|
||||
<f7-icon f7="app_fill" :style="{ color: '#' + accountColor.color }" @click.native="setSelectedColor(accountColor.color)">
|
||||
<f7-badge color="default" class="right-bottom-icon" v-if="accountChoosingColor && accountChoosingColor.color === accountColor.color">
|
||||
<f7-icon f7="checkmark_alt"></f7-icon>
|
||||
</f7-badge>
|
||||
</f7-icon>
|
||||
</f7-col>
|
||||
</f7-row>
|
||||
</f7-block>
|
||||
</f7-page-content>
|
||||
</f7-sheet>
|
||||
</f7-page>
|
||||
</template>
|
||||
|
||||
@@ -223,14 +261,17 @@ export default {
|
||||
type: self.$constants.account.allAccountTypes.SingleAccount.toString(),
|
||||
name: '',
|
||||
icon: self.$constants.icons.defaultAccountIconId,
|
||||
color: self.$constants.colors.defaultAccountColor,
|
||||
currency: self.$user.getUserInfo() ? self.$user.getUserInfo().defaultCurrency : self.$t('default.currency'),
|
||||
comment: '',
|
||||
visible: true
|
||||
},
|
||||
subAccounts: [],
|
||||
accountChoosingIcon: null,
|
||||
accountChoosingColor: null,
|
||||
submitting: false,
|
||||
showIconSelection: false
|
||||
showIconSelection: false,
|
||||
showColorSelection: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
@@ -279,6 +320,24 @@ export default {
|
||||
|
||||
return ret;
|
||||
},
|
||||
allAccountColorRows() {
|
||||
const allAccountColors = this.$constants.colors.allAccountColors;
|
||||
const colorPerRow = 7;
|
||||
const ret = [];
|
||||
let rowCount = -1;
|
||||
|
||||
for (let i = 0; i < allAccountColors.length; i++) {
|
||||
if (i % colorPerRow === 0) {
|
||||
ret[++rowCount] = [];
|
||||
}
|
||||
|
||||
ret[rowCount].push({
|
||||
color: allAccountColors[i]
|
||||
});
|
||||
}
|
||||
|
||||
return ret;
|
||||
},
|
||||
allCurrencies() {
|
||||
return this.$getAllCurrencies();
|
||||
}
|
||||
@@ -310,6 +369,7 @@ export default {
|
||||
self.account.type = account.type.toString();
|
||||
self.account.name = account.name;
|
||||
self.account.icon = account.icon;
|
||||
self.account.color = account.color;
|
||||
self.account.currency = account.currency;
|
||||
self.account.comment = account.comment;
|
||||
self.account.visible = !account.hidden;
|
||||
@@ -324,6 +384,7 @@ export default {
|
||||
type: subAccount.type.toString(),
|
||||
name: subAccount.name,
|
||||
icon: subAccount.icon,
|
||||
color: subAccount.color,
|
||||
currency: subAccount.currency,
|
||||
comment: subAccount.comment,
|
||||
visible: !subAccount.hidden
|
||||
@@ -360,6 +421,7 @@ export default {
|
||||
type: null,
|
||||
name: '',
|
||||
icon: this.account.icon,
|
||||
color: this.account.color,
|
||||
currency: self.$user.getUserInfo() ? self.$user.getUserInfo().defaultCurrency : self.$t('default.currency'),
|
||||
comment: ''
|
||||
});
|
||||
@@ -388,6 +450,23 @@ export default {
|
||||
this.accountChoosingIcon = null;
|
||||
this.showIconSelection = false;
|
||||
},
|
||||
showColorSelectionSheet(account) {
|
||||
this.accountChoosingColor = account;
|
||||
this.showColorSelection = true;
|
||||
},
|
||||
setSelectedColor(color) {
|
||||
if (!this.accountChoosingColor) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.accountChoosingColor.color = color;
|
||||
this.accountChoosingColor = null;
|
||||
this.showColorSelection = false;
|
||||
},
|
||||
hideColorSelectionSheet() {
|
||||
this.accountChoosingColor = null;
|
||||
this.showColorSelection = false;
|
||||
},
|
||||
save() {
|
||||
const self = this;
|
||||
const router = self.$f7router;
|
||||
@@ -412,6 +491,7 @@ export default {
|
||||
type: self.$constants.account.allAccountTypes.SingleAccount,
|
||||
name: subAccount.name,
|
||||
icon: subAccount.icon,
|
||||
color: subAccount.color,
|
||||
currency: subAccount.currency,
|
||||
comment: subAccount.comment
|
||||
};
|
||||
@@ -430,6 +510,7 @@ export default {
|
||||
type: parseInt(self.account.type),
|
||||
name: self.account.name,
|
||||
icon: self.account.icon,
|
||||
color: self.account.color,
|
||||
currency: self.account.type === self.$constants.account.allAccountTypes.SingleAccount.toString() ? self.account.currency : self.$constants.currency.parentAccountCurrencyPlacehodler,
|
||||
comment: self.account.comment,
|
||||
subAccounts: self.account.type === self.$constants.account.allAccountTypes.SingleAccount.toString() ? null : subAccounts,
|
||||
|
||||
@@ -82,7 +82,7 @@
|
||||
>
|
||||
<f7-block slot="title" class="no-padding">
|
||||
<div class="display-flex">
|
||||
<f7-icon slot="media" :f7="account.icon | accountIcon">
|
||||
<f7-icon slot="media" :f7="account.icon | accountIcon" :style="{ color: '#' + account.color }">
|
||||
<f7-badge color="gray" class="right-bottom-icon" v-if="account.hidden">
|
||||
<f7-icon f7="eye_slash_fill"></f7-icon>
|
||||
</f7-badge>
|
||||
@@ -96,7 +96,7 @@
|
||||
:title="subAccount.name" :after="accountBalance(subAccount) | currency(subAccount.currency)"
|
||||
link="#"
|
||||
>
|
||||
<f7-icon slot="media" :f7="subAccount.icon | accountIcon">
|
||||
<f7-icon slot="media" :f7="subAccount.icon | accountIcon" :style="{ color: '#' + subAccount.color }">
|
||||
<f7-badge color="gray" class="right-bottom-icon" v-if="subAccount.hidden">
|
||||
<f7-icon f7="eye_slash_fill"></f7-icon>
|
||||
</f7-badge>
|
||||
|
||||
Reference in New Issue
Block a user