5 changed files with 547 additions and 239 deletions
@ -1,148 +1,452 @@ |
|||||
<template> |
<template> |
||||
<div> |
<q-splitter :model-value="65" class="w-full h-full"> |
||||
<q-table title="Treats" table-style="height: 500px;" :rows="rows" :columns="columns" row-key="name" :flat="true" :selection="'single'" :separator="'cell'"> |
<template #before> |
||||
<template #body="bodyProps"> |
<div class="px-1"> |
||||
<TableRow :cols="bodyProps.cols" :data="bodyProps.row"></TableRow> |
<w-grid |
||||
</template> |
ref="userGridRef" |
||||
</q-table> |
:title="$t('system.user.grid.title')" |
||||
</div> |
selection="multiple" |
||||
</template> |
:query-form-fields="[ |
||||
|
{ name: 'loginName', label: $t('loginName'), type: 'text' }, |
||||
|
{ name: 'userName', label: $t('userName'), type: 'text' }, |
||||
|
{ name: 'enable', label: $t('isEnable'), type: 'select', options: Options.yesNo() }, |
||||
|
{ name: 'dataComeFrom', label: $t('dataComeFrom'), type: 'select', options: Options.enum(DataComeFromEnum) }, |
||||
|
]" |
||||
|
:toolbar-configure="{ noIcon: false }" |
||||
|
:toolbar-actions="[ |
||||
|
'query', |
||||
|
'refresh', |
||||
|
'separator', |
||||
|
'add', |
||||
|
'clone', |
||||
|
'edit', |
||||
|
'remove', |
||||
|
'separator', |
||||
|
{ |
||||
|
name: 'setPassword', |
||||
|
label: t('system.user.action.setPassword'), |
||||
|
icon: 'bi-shield-check', |
||||
|
enableIf: function (selecteds) { |
||||
|
return selecteds.length > 0; |
||||
|
}, |
||||
|
click: function (selecteds) { |
||||
|
setPasswordDialogRef.open('setPassword', selecteds); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
name: 'setAllPassword', |
||||
|
label: t('system.user.action.setAllPassword'), |
||||
|
icon: 'bi-shield', |
||||
|
enableIf: function (selecteds) { |
||||
|
return true; |
||||
|
}, |
||||
|
click: function () { |
||||
|
setPasswordDialogRef.open('setAllPassword'); |
||||
|
}, |
||||
|
}, |
||||
|
'separator', |
||||
|
{ |
||||
|
name: 'resetPassword', |
||||
|
label: t('system.user.action.resetPassword'), |
||||
|
icon: 'bi-shield-fill-check', |
||||
|
enableIf: function (selecteds) { |
||||
|
return selecteds.length > 0; |
||||
|
}, |
||||
|
click: function (selecteds) { |
||||
|
DialogManager.confirm(t('system.user.confirm.resetPassword'), () => { |
||||
|
const userIds = Tools.extractProperties(selecteds, 'id'); |
||||
|
axios.post(Environment.apiContextPath('/api/system/user/resetPassword'), userIds).then(() => { |
||||
|
NotifyManager.info(t('operationSuccess')); |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
name: 'resetAllPassword', |
||||
|
label: t('system.user.action.resetAllPassword'), |
||||
|
icon: 'bi-shield-fill', |
||||
|
enableIf: function (selecteds) { |
||||
|
return true; |
||||
|
}, |
||||
|
click: function () { |
||||
|
DialogManager.confirm(t('system.user.confirm.resetAllPassword'), () => { |
||||
|
axios.post(Environment.apiContextPath('/api/system/user/resetAllPassword')).then(() => { |
||||
|
setPasswordDialogRef.value.hide(); |
||||
|
NotifyManager.info(t('operationSuccess')); |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
}, |
||||
|
'separator', |
||||
|
'view', |
||||
|
'export', |
||||
|
]" |
||||
|
:data-url="Environment.apiContextPath('/api/system/user')" |
||||
|
row-key="id" |
||||
|
:columns="[ |
||||
|
{ name: 'loginName', label: t('loginName') }, |
||||
|
{ name: 'userName', label: t('userName') }, |
||||
|
{ |
||||
|
name: 'status', |
||||
|
label: t('status'), |
||||
|
format: (value, row) => { |
||||
|
return { |
||||
|
componentType: UserStatusTag, |
||||
|
attrs: row, |
||||
|
}; |
||||
|
}, |
||||
|
}, |
||||
|
{ name: 'dataComeFrom', label: t('dataComeFrom'), format: Formater.enum(DataComeFromEnum) }, |
||||
|
{ name: 'lastModifier', label: t('lastModifier') }, |
||||
|
{ name: 'lastModifyDate', label: t('lastModifyDate'), format: Formater.dateOnly() }, |
||||
|
]" |
||||
|
:editor="{ |
||||
|
dialog: { |
||||
|
width: '600px', |
||||
|
height: '610px', |
||||
|
}, |
||||
|
form: { |
||||
|
colsNum: 4, |
||||
|
fields: [ |
||||
|
{ name: 'loginName', label: t('loginName'), type: 'text', required: true, colspan: 4 }, |
||||
|
{ name: 'userName', label: t('userName'), type: 'text', required: true, colspan: 4 }, |
||||
|
{ name: 'description', label: t('description'), type: 'textarea', rows: 1, colspan: 4 }, |
||||
|
{ name: 'password', label: t('password'), type: 'password', colspan: 4 }, |
||||
|
{ |
||||
|
name: 'confirmPassword', |
||||
|
label: t('confirmPassword'), |
||||
|
type: 'password', |
||||
|
colspan: 4, |
||||
|
rules: [ |
||||
|
(value) => { |
||||
|
return Tools.stringEquals(userGridRef.getAddEditFormRef().value.getData().password, value) |
||||
|
? true |
||||
|
: t('passwordAndConfirmPasswordMustEqual'); |
||||
|
}, |
||||
|
], |
||||
|
}, |
||||
|
{ name: 'mobile', label: t('mobile'), type: 'text', colsFirst: true, colspan: 4 }, |
||||
|
{ name: 'phone', label: t('phone'), type: 'text', colsFirst: true, colspan: 4 }, |
||||
|
{ name: 'email', label: t('email'), type: 'text', colsFirst: true, colspan: 4 }, |
||||
|
{ name: 'weixin', label: t('weixin'), type: 'text', colsFirst: true, colspan: 4 }, |
||||
|
{ name: 'qq', label: t('qq'), type: 'text', colsFirst: true, colspan: 4 }, |
||||
|
|
||||
|
{ name: 'enable', label: t('enable'), type: 'checkbox', defaultValue: true }, |
||||
|
{ name: 'accountExpired', label: t('accountExpired'), type: 'checkbox', defaultValue: false }, |
||||
|
{ name: 'accountLocked', label: t('accountLocked'), type: 'checkbox', defaultValue: false }, |
||||
|
{ name: 'credentialsExpired', label: t('credentialsExpired'), type: 'checkbox', defaultValue: false }, |
||||
|
], |
||||
|
}, |
||||
|
}" |
||||
|
:viewer="{ |
||||
|
panel: { |
||||
|
columnNum: 1, |
||||
|
fields: [ |
||||
|
{ name: 'id', label: t('id') }, |
||||
|
{ name: 'loginName', label: t('loginName') }, |
||||
|
{ name: 'userName', label: t('userName') }, |
||||
|
{ name: 'description', label: t('description') }, |
||||
|
{ name: 'enable', label: t('enable'), format: Formater.yesNo() }, |
||||
|
{ name: 'accountExpired', label: t('accountExpired'), format: Formater.yesNo() }, |
||||
|
{ name: 'accountLocked', label: t('accountLocked'), format: Formater.yesNo() }, |
||||
|
{ name: 'credentialsExpired', label: t('credentialsExpired'), format: Formater.yesNo() }, |
||||
|
{ name: 'email', label: t('email') }, |
||||
|
{ name: 'phone', label: t('phone') }, |
||||
|
{ name: 'mobile', label: t('mobile') }, |
||||
|
{ name: 'weixin', label: t('weixin') }, |
||||
|
{ name: 'qq', label: t('qq') }, |
||||
|
{ name: 'dataComeFrom', label: t('dataComeFrom'), format: Formater.enum(DataComeFromEnum) }, |
||||
|
{ name: 'creator', label: t('creator') }, |
||||
|
{ name: 'createDate', label: t('createDate') }, |
||||
|
{ name: 'lastModifier', label: t('lastModifier') }, |
||||
|
{ name: 'lastModifyDate', label: t('lastModifyDate') }, |
||||
|
{ name: 'corporationCode', label: t('corporationCode') }, |
||||
|
], |
||||
|
}, |
||||
|
}" |
||||
|
@row-click=" |
||||
|
(evt, row, index) => { |
||||
|
currentSelectedUserId = row.id; |
||||
|
if (roleGridRef) { |
||||
|
roleGridRef.setFetchDataUrl(Environment.apiContextPath('/api/system/role/queryRolesByUser?userId=') + row.id); |
||||
|
roleGridRef.refresh(); |
||||
|
} |
||||
|
if (orgTreeGridRef) { |
||||
|
orgTreeGridRef.setFetchDataUrl(Environment.apiContextPath('/api/system/org/listAllOrgsWithSelectedStatusByUser?userId=') + row.id); |
||||
|
orgTreeGridRef.refresh(); |
||||
|
} |
||||
|
} |
||||
|
" |
||||
|
></w-grid> |
||||
|
</div> |
||||
|
</template> |
||||
|
<template #after> |
||||
|
<div class="px-1"> |
||||
|
<q-tabs v-model="selectedTabRef" inline-label align="left" :breakpoint="0"> |
||||
|
<q-tab name="role" icon="bi-people" :label="$t('role')" /> |
||||
|
<q-tab name="org" icon="bi-diagram-3" :label="$t('org')" /> |
||||
|
</q-tabs> |
||||
|
|
||||
|
<q-tab-panels v-model="selectedTabRef" animated swipeable keep-alive class=""> |
||||
|
<q-tab-panel name="role" class="p-0"> |
||||
|
<w-grid |
||||
|
ref="roleGridRef" |
||||
|
:title="$t('system.role.grid.title')" |
||||
|
:data-url="Environment.apiContextPath('/api/system/role/queryRolesByUser') + currentSelectedUserId" |
||||
|
:auto-fetch-data="false" |
||||
|
selection="multiple" |
||||
|
:full-screen-button="false" |
||||
|
:toolbar-configure="{ noIcon: true }" |
||||
|
:toolbar-actions="[ |
||||
|
'refresh', |
||||
|
'separator', |
||||
|
{ |
||||
|
name: 'addRole', |
||||
|
label: $t('system.role.action.addRole'), |
||||
|
enableIf: () => { |
||||
|
if (userGridRef) { |
||||
|
return userGridRef.getSelectedRows().length > 0; |
||||
|
} |
||||
|
return false; |
||||
|
}, |
||||
|
click: () => { |
||||
|
selectRoleDialog.open({ userId: userGridRef.getSelectedRows()[0].id, userGrid: userGridRef, roleGrid: roleGridRef }); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
name: 'addAllRole', |
||||
|
label: t('system.role.action.addAllRole'), |
||||
|
enableIf: () => { |
||||
|
if (userGridRef) { |
||||
|
return userGridRef.getSelectedRows().length > 0; |
||||
|
} |
||||
|
return false; |
||||
|
}, |
||||
|
click: () => { |
||||
|
const selectedUser = userGridRef.getSelectedRows()[0]; |
||||
|
DialogManager.confirm( |
||||
|
t('system.role.action.addAllRole.confirm', { userLoginName: selectedUser.loginName, userName: selectedUser.userName }), |
||||
|
() => { |
||||
|
axios |
||||
|
.post(Environment.apiContextPath('/api/system/user/addAllRoles'), { |
||||
|
one: selectedUser.id, |
||||
|
many: [], |
||||
|
}) |
||||
|
.then((response) => { |
||||
|
axios.get(Environment.apiContextPath('/api/system/role/queryRolesByUser?userId=') + selectedUser.id).then((response) => { |
||||
|
roleGridRef.replaceRows(response.data.content); |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
); |
||||
|
}, |
||||
|
}, |
||||
|
'separator', |
||||
|
{ |
||||
|
name: 'removeRole', |
||||
|
label: t('system.role.action.removeRole'), |
||||
|
enableIf: () => { |
||||
|
if (userGridRef && roleGridRef) { |
||||
|
return userGridRef.getSelectedRows().length > 0 && roleGridRef.getSelectedRows().length > 0; |
||||
|
} |
||||
|
return false; |
||||
|
}, |
||||
|
click: (selecteds) => { |
||||
|
const selectedUser = userGridRef.getSelectedRows()[0]; |
||||
|
const roleIds = Tools.extractProperties(selecteds, 'id'); |
||||
|
const messageKey = roleIds.length > 1 ? 'system.role.action.removeRole.confirms' : 'system.role.action.removeRole.confirm'; |
||||
|
DialogManager.confirm( |
||||
|
t(messageKey, { |
||||
|
userLoginName: selectedUser.loginName, |
||||
|
userName: selectedUser.userName, |
||||
|
roleCode: selecteds[0].code, |
||||
|
roleName: selecteds[0].name, |
||||
|
counter: selecteds.length, |
||||
|
}), |
||||
|
() => { |
||||
|
axios |
||||
|
.post(Environment.apiContextPath('/api/system/user/removeRoles'), { |
||||
|
one: selectedUser.id, |
||||
|
many: roleIds, |
||||
|
}) |
||||
|
.then((response) => { |
||||
|
axios.get(Environment.apiContextPath('/api/system/role/queryRolesByUser?userId=') + selectedUser.id).then((response) => { |
||||
|
roleGridRef.replaceRows(response.data.content); |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
); |
||||
|
}, |
||||
|
}, |
||||
|
{ |
||||
|
name: 'removeAllRole', |
||||
|
label: $t('system.role.action.removeAllRole'), |
||||
|
enableIf: () => { |
||||
|
if (userGridRef && roleGridRef) { |
||||
|
return userGridRef.getSelectedRows().length > 0 && roleGridRef.getRows().length > 0; |
||||
|
} |
||||
|
return false; |
||||
|
}, |
||||
|
click: () => { |
||||
|
const selectedUser = userGridRef.getSelectedRows()[0]; |
||||
|
DialogManager.confirm( |
||||
|
t('system.role.action.removeAllRole.confirm', { userLoginName: selectedUser.loginName, userName: selectedUser.userName }), |
||||
|
() => { |
||||
|
axios |
||||
|
.post(Environment.apiContextPath('/api/system/user/removeAllRoles'), { |
||||
|
one: selectedUser.id, |
||||
|
many: [], |
||||
|
}) |
||||
|
.then((response) => { |
||||
|
axios.get(Environment.apiContextPath('/api/system/role/queryRolesByUser?userId=') + selectedUser.id).then((response) => { |
||||
|
roleGridRef.replaceRows(response.data.content); |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
); |
||||
|
}, |
||||
|
}, |
||||
|
'separator', |
||||
|
'view', |
||||
|
]" |
||||
|
:columns="[ |
||||
|
{ width: 100, name: 'code', label: $t('code') }, |
||||
|
{ width: 100, name: 'name', label: $t('name') }, |
||||
|
{ |
||||
|
width: 60, |
||||
|
name: 'status', |
||||
|
label: t('status'), |
||||
|
format: (value, row) => { |
||||
|
return { |
||||
|
componentType: RoleStatusTag, |
||||
|
attrs: row, |
||||
|
}; |
||||
|
}, |
||||
|
}, |
||||
|
]" |
||||
|
:viewer="{ |
||||
|
panel: { |
||||
|
columnNum: 1, |
||||
|
fields: [ |
||||
|
{ name: 'id', label: t('id') }, |
||||
|
{ name: 'code', label: t('code') }, |
||||
|
{ name: 'name', label: t('name') }, |
||||
|
{ name: 'description', label: t('description') }, |
||||
|
{ name: 'enable', label: t('enable'), format: Formater.yesNo() }, |
||||
|
{ name: 'dataComeFrom', label: t('dataComeFrom'), format: Formater.enum(DataComeFromEnum) }, |
||||
|
{ name: 'creator', label: t('creator') }, |
||||
|
{ name: 'createDate', label: t('createDate') }, |
||||
|
{ name: 'lastModifier', label: t('lastModifier') }, |
||||
|
{ name: 'lastModifyDate', label: t('lastModifyDate') }, |
||||
|
{ name: 'corporationCode', label: t('corporationCode') }, |
||||
|
], |
||||
|
}, |
||||
|
}" |
||||
|
></w-grid> |
||||
|
</q-tab-panel> |
||||
|
<q-tab-panel name="org" class="px-0"> |
||||
|
<w-grid |
||||
|
ref="orgTreeGridRef" |
||||
|
:tree="true" |
||||
|
:title="$t('system.org.grid.title')" |
||||
|
:data-url="Environment.apiContextPath('/api/system/org/listAllOrgsWithSelectedStatusByUser?userId=') + currentSelectedUserId" |
||||
|
selection="multiple" |
||||
|
:full-screen-button="false" |
||||
|
:toolbar-configure="{ noIcon: true }" |
||||
|
:toolbar-actions="[ |
||||
|
'refresh', |
||||
|
'separator', |
||||
|
{ |
||||
|
name: 'save', |
||||
|
label: $t('save'), |
||||
|
click: () => {}, |
||||
|
}, |
||||
|
'view', |
||||
|
]" |
||||
|
:pagination="{ |
||||
|
sortBy: 'name', |
||||
|
descending: false, |
||||
|
reqPageStart: 0, |
||||
|
rowsPerPage: 0, |
||||
|
}" |
||||
|
:columns="[ |
||||
|
{ width: 100, name: 'code', label: $t('code') }, |
||||
|
{ width: 100, name: 'name', label: $t('name') }, |
||||
|
{ |
||||
|
width: 60, |
||||
|
name: 'status', |
||||
|
label: t('status'), |
||||
|
format: (value, row) => { |
||||
|
return { |
||||
|
componentType: RoleStatusTag, |
||||
|
attrs: row, |
||||
|
}; |
||||
|
}, |
||||
|
}, |
||||
|
]" |
||||
|
:viewer="{ |
||||
|
panel: { |
||||
|
columnNum: 1, |
||||
|
fields: [ |
||||
|
{ name: 'id', label: t('id') }, |
||||
|
{ name: 'code', label: t('code') }, |
||||
|
{ name: 'name', label: t('name') }, |
||||
|
{ name: 'description', label: t('description') }, |
||||
|
{ name: 'enable', label: t('enable'), format: Formater.yesNo() }, |
||||
|
{ name: 'dataComeFrom', label: t('dataComeFrom'), format: Formater.enum(DataComeFromEnum) }, |
||||
|
{ name: 'creator', label: t('creator') }, |
||||
|
{ name: 'createDate', label: t('createDate') }, |
||||
|
{ name: 'lastModifier', label: t('lastModifier') }, |
||||
|
{ name: 'lastModifyDate', label: t('lastModifyDate') }, |
||||
|
{ name: 'corporationCode', label: t('corporationCode') }, |
||||
|
], |
||||
|
}, |
||||
|
}" |
||||
|
></w-grid> |
||||
|
</q-tab-panel> |
||||
|
</q-tab-panels> |
||||
|
</div> |
||||
|
</template> |
||||
|
<SelectRoleDialog ref="selectRoleDialog"></SelectRoleDialog> |
||||
|
<SetPasswordDialog ref="setPasswordDialogRef"></SetPasswordDialog> |
||||
|
</q-splitter> |
||||
|
</template> |
||||
<script setup lang="ts"> |
<script setup lang="ts"> |
||||
import { ref } from 'vue'; |
import { ref } from 'vue'; |
||||
|
import { useI18n } from 'vue-i18n'; |
||||
|
import { Environment, axios, EnumTools, NotifyManager, DialogManager, Formater, Options, Tools } from '@/platform'; |
||||
|
import SelectRoleDialog from './SelectRoleDialog.vue'; |
||||
|
import SetPasswordDialog from './SetPasswordDialog.vue'; |
||||
|
import UserStatusTag from './UserStatusTag.vue'; |
||||
|
import RoleStatusTag from './RoleStatusTag.vue'; |
||||
|
|
||||
|
const { t } = useI18n(); |
||||
|
|
||||
|
const userGridRef = ref(); |
||||
|
const roleGridRef = ref(); |
||||
|
const orgTreeGridRef = ref(); |
||||
|
|
||||
|
const selectRoleDialog = ref(); |
||||
|
const selectedTabRef = ref('role'); |
||||
|
const setPasswordDialogRef = ref(); |
||||
|
|
||||
const columns = [ |
const DataComeFromEnum = await EnumTools.fetch('io.sc.platform.orm.api.enums.DataComeFrom'); |
||||
{ |
const currentSelectedUserId = ref(); |
||||
name: 'name', |
|
||||
required: true, |
|
||||
label: 'Dessert (100g serving)', |
|
||||
align: 'left', |
|
||||
field: (row) => row.name, |
|
||||
format: (val) => `${val}`, |
|
||||
sortable: true, |
|
||||
}, |
|
||||
{ name: 'calories', align: 'center', label: 'Calories', field: 'calories', sortable: true }, |
|
||||
{ name: 'fat', label: 'Fat (g)', field: 'fat', sortable: true }, |
|
||||
{ name: 'carbs', label: 'Carbs (g)', field: 'carbs' }, |
|
||||
{ name: 'protein', label: 'Protein (g)', field: 'protein' }, |
|
||||
{ name: 'sodium', label: 'Sodium (mg)', field: 'sodium' }, |
|
||||
{ name: 'calcium', label: 'Calcium (%)', field: 'calcium', sortable: true, sort: (a, b) => parseInt(a, 10) - parseInt(b, 10) }, |
|
||||
{ name: 'iron', label: 'Iron (%)', field: 'iron', sortable: true, sort: (a, b) => parseInt(a, 10) - parseInt(b, 10) }, |
|
||||
]; |
|
||||
|
|
||||
const rows = ref([ |
const orgConfigure = { |
||||
{ |
actions: [ |
||||
name: 'Frozen Yogurt', |
{ |
||||
calories: 159, |
name: 'save', |
||||
fat: 6.0, |
label: '保存', |
||||
carbs: 24, |
click: () => { |
||||
protein: 4.0, |
axios |
||||
sodium: 87, |
.post(Environment.apiContextPath('/api/system/user/updateOrgs'), { |
||||
calcium: '14%', |
one: userGridRef.value.getSelectedRows()[0].id, |
||||
iron: '1%', |
many: orgTreeGridRef.value.getTicked(), |
||||
selected: true, |
}) |
||||
children: [ |
.then((response) => {}); |
||||
{ |
|
||||
name: 'Ice cream sandwich3', |
|
||||
calories: 237, |
|
||||
fat: 9.0, |
|
||||
carbs: 37, |
|
||||
protein: 4.3, |
|
||||
sodium: 129, |
|
||||
calcium: '8%', |
|
||||
iron: '1%', |
|
||||
}, |
}, |
||||
], |
}, |
||||
}, |
], |
||||
{ |
}; |
||||
name: 'Ice cream sandwich', |
|
||||
calories: 237, |
|
||||
fat: 9.0, |
|
||||
carbs: 37, |
|
||||
protein: 4.3, |
|
||||
sodium: 129, |
|
||||
calcium: '8%', |
|
||||
iron: '1%', |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Eclair', |
|
||||
calories: 262, |
|
||||
fat: 16.0, |
|
||||
carbs: 23, |
|
||||
protein: 6.0, |
|
||||
sodium: 337, |
|
||||
calcium: '6%', |
|
||||
iron: '7%', |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Cupcake', |
|
||||
calories: 305, |
|
||||
fat: 3.7, |
|
||||
carbs: 67, |
|
||||
protein: 4.3, |
|
||||
sodium: 413, |
|
||||
calcium: '3%', |
|
||||
iron: '8%', |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Gingerbread', |
|
||||
calories: 356, |
|
||||
fat: 16.0, |
|
||||
carbs: 49, |
|
||||
protein: 3.9, |
|
||||
sodium: 327, |
|
||||
calcium: '7%', |
|
||||
iron: '16%', |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Jelly bean', |
|
||||
calories: 375, |
|
||||
fat: 0.0, |
|
||||
carbs: 94, |
|
||||
protein: 0.0, |
|
||||
sodium: 50, |
|
||||
calcium: '0%', |
|
||||
iron: '0%', |
|
||||
}, |
|
||||
{ |
|
||||
name: '<span style="color: red">This should be red.</span>', |
|
||||
calories: 392, |
|
||||
fat: 0.2, |
|
||||
carbs: 98, |
|
||||
protein: 0, |
|
||||
sodium: 38, |
|
||||
calcium: '0%', |
|
||||
iron: '2%', |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Honeycomb', |
|
||||
calories: 408, |
|
||||
fat: 3.2, |
|
||||
carbs: 87, |
|
||||
protein: 6.5, |
|
||||
sodium: 562, |
|
||||
calcium: '0%', |
|
||||
iron: '45%', |
|
||||
}, |
|
||||
{ |
|
||||
name: 'Donut', |
|
||||
calories: 452, |
|
||||
fat: 25.0, |
|
||||
carbs: 51, |
|
||||
protein: 4.9, |
|
||||
sodium: 326, |
|
||||
calcium: '2%', |
|
||||
iron: '22%', |
|
||||
}, |
|
||||
{ |
|
||||
name: 'KitKat', |
|
||||
calories: 518, |
|
||||
fat: 26.0, |
|
||||
carbs: 65, |
|
||||
protein: 7, |
|
||||
sodium: 54, |
|
||||
calcium: '12%', |
|
||||
iron: '6%', |
|
||||
}, |
|
||||
]); |
|
||||
</script> |
</script> |
||||
|
|||||
Loading…
Reference in new issue