sim1222/test1
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

emojigen wip30

Browse Source
This commit is contained in:
こけっち 2022-05-06 22:42:04 +09:00
parent fb1781ca53
commit db7abd17fb
No known key found for this signature in database
GPG Key ID: 21460619C5FC4DD1
1 changed files with 59 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

115
packages/client/src/pages/admin/emojigen.vue
View File

@ -1,81 +1,83 @@
<template>
<MkSpacer :content-max="700" :margin-min="16" :margin-max="32">
<div class="cwepdizn _formRoot">
<FormInput v-model="emojiName" class="_formBlock">
<template #label>{{ $ts.emojiName }}</template>
</FormInput>
<FormSuspense>
<div class="cwepdizn _formRoot">
<FormInput v-model="emojiName" class="_formBlock">
<template #label>{{ $ts.emojiName }}</template>
</FormInput>
<FormTextarea v-model="text" class="_formBlock">
<template #label>{{ $ts.text }}</template>
</FormTextarea>
<FormTextarea v-model="text" class="_formBlock">
<template #label>{{ $ts.text }}</template>
</FormTextarea>
<FormRadios v-model="emojiAlign" class="_formBlock">
<template #label>{{ $ts.emojiAlign }}</template>
<option value="left"><i class="fa-solid fa-align-left"/></option>
<option value="center"><i class="fa-solid fa-align-center"></i></option>
<option value="right"><i class="fa-solid fa-align-right"/></option>
</FormRadios>
<FormRadios v-model="emojiAlign" class="_formBlock">
<template #label>{{ $ts.emojiAlign }}</template>
<option value="left"><i class="fa-solid fa-align-left"/></option>
<option value="center"><i class="fa-solid fa-align-center"></i></option>
<option value="right"><i class="fa-solid fa-align-right"/></option>
</FormRadios>
<FormSection>
<template #label>{{ $ts.emojiSizeSetting }}</template>
<FormSwitch v-model="emojiSizeFixed" class="_formBlock">
<template #label>{{ $ts.emojiSizeFixed }}</template>
</FormSwitch>
<FormSection>
<template #label>{{ $ts.emojiSizeSetting }}</template>
<FormSwitch v-model="emojiSizeFixed" class="_formBlock">
<template #label>{{ $ts.emojiSizeFixed }}</template>
</FormSwitch>
<FormSwitch v-model="emojiStretch" class="_formBlock">
<template #label>{{ $ts.emojiStretch }}</template>
</FormSwitch>
</FormSection>
<FormSwitch v-model="emojiStretch" class="_formBlock">
<template #label>{{ $ts.emojiStretch }}</template>
</FormSwitch>
</FormSection>
<FormRadios v-model="font" class="_formBlock">
<template #label>{{ $ts.font }}</template>
<option value="notosans-mono-bold">Noto Sans Mono CJK JP Bold</option>
<option value="mplus-1p-black">M+ 1p black</option>
<option value="rounded-x-mplus-1p-black">Rounded M+ 1p black</option>
<option value="ipamjm">IPAmj明朝</option>
<option value="aoyagireisyoshimo">青柳隷書しも</option>
<option value="LinLibertine_RBah">LinLibertine Bold</option>
</FormRadios>
<FormRadios v-model="font" class="_formBlock">
<template #label>{{ $ts.font }}</template>
<option value="notosans-mono-bold">Noto Sans Mono CJK JP Bold</option>
<option value="mplus-1p-black">M+ 1p black</option>
<option value="rounded-x-mplus-1p-black">Rounded M+ 1p black</option>
<option value="ipamjm">IPAmj明朝</option>
<option value="aoyagireisyoshimo">青柳隷書しも</option>
<option value="LinLibertine_RBah">LinLibertine Bold</option>
</FormRadios>
<FormFolder :default-open="true" class="_formBlock">
<template #label>{{ $ts.accentColor }}</template>
<div class="cwepdizn-colors">
<div class="row">
<button v-for="color in accentColors" :key="color" class="color rounded _button" @click="setAccentColor(color)">
<div class="preview" :style="{ background: color }"></div>
</button>
<FormFolder :default-open="true" class="_formBlock">
<template #label>{{ $ts.accentColor }}</template>
<div class="cwepdizn-colors">
<div class="row">
<button v-for="color in accentColors" :key="color" class="color rounded _button" @click="setAccentColor(color)">
<div class="preview" :style="{ background: color }"></div>
</button>
</div>
</div>
</div>
</FormFolder>
</FormFolder>
<FormInput v-model="emojiColor" class="_formBlock">
<template #prefix><i class="fas fa-palette"></i></template>
<template #label>{{ $ts.emojiColor }}</template>
<template #caption>#RRGGBB</template>
</FormInput>
<FormInput v-model="emojiColor" class="_formBlock">
<template #prefix><i class="fas fa-palette"></i></template>
<template #label>{{ $ts.emojiColor }}</template>
<template #caption>#RRGGBB</template>
</FormInput>
<FormButton primary class="_formBlock" @click="emojiGenerate">{{ $ts.emojiGenerate }}</FormButton>
<FormButton primary class="_formBlock" @click="emojiGenerate">{{ $ts.emojiGenerate }}</FormButton>
<FormSection>
<template #label>{{ $ts.preview }}</template>
<img :src="emojiUrl" class="img" :alt="emojiName"/>
<p>{{ emojiUrl }}</p>
</FormSection>
<FormButton primary class="_formBlock" @click="emojiApproval">{{ $ts.emojiApproval }}</FormButton>
</div>
<FormSection>
<template #label>{{ $ts.preview }}</template>
<img :src="emojiUrl" class="img" :alt="emojiName"/>
<p>{{ emojiUrl }}</p>
</FormSection>
<FormButton primary class="_formBlock" @click="emojiApproval">{{ $ts.emojiApproval }}</FormButton>
</div>
</FormSuspense>
</MkSpacer>
</template>
<script lang="ts">
import {defineComponent} from 'vue';
import FormFolder from '@/components/form/folder.vue';
import FormSwitch from '@/components/form/switch.vue';
import FormInput from '@/components/form/input.vue';
import FormTextarea from '@/components/form/textarea.vue';
import FormRadios from '@/components/form/radios.vue';
import FormSection from '@/components/form/section.vue';
import FormFolder from '@/components/form/folder.vue';
import FormButton from '@/components/ui/button.vue';
import FormSuspense from '@/components/form/suspense.vue';
import * as os from '@/os';
import * as symbols from '@/symbols';
import {defaultStore} from "@/store";
@ -84,13 +86,14 @@ import {stream} from "@/stream";
export default defineComponent({
components: {
FormFolder,
FormInput,
FormTextarea,
FormRadios,
FormSection,
FormSwitch,
FormButton,
FormFolder,
FormSuspense,
},
emits: ['info'],