-
Notifications
You must be signed in to change notification settings - Fork 81
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
7b98407
commit b8da30f
Showing
4 changed files
with
173 additions
and
30 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,116 @@ | ||
<template> | ||
<div class="app-container" style="height: 600px;overflow-y: auto;"> | ||
<span v-for="prompt in prompts"> | ||
<span v-if="prompt.visible"> | ||
<el-divider content-position="left">{{ prompt.name }}</el-divider> | ||
<span v-for="item in prompt.items" class="prompt"> | ||
<el-button type="danger" v-if="setting.down" @click="downWeight(item)" plain> | ||
<el-icon> | ||
<Remove /> | ||
</el-icon> | ||
</el-button> | ||
<el-button type="success" v-if="setting.up" @click="upWeight(item)" plain> | ||
<el-icon> | ||
<CirclePlus /> | ||
</el-icon> | ||
</el-button> | ||
<el-button :type="item.checked ? 'primary' : ''" @click="selectPrompt(item);" plain> | ||
<span v-if="setting.en">{{ item.en }}</span> | ||
<span v-if="setting.zh">「{{ item.zh }}」</span> | ||
</el-button> | ||
</span> | ||
</span> | ||
</span> | ||
</div> | ||
</template> | ||
|
||
<script> | ||
import prompts from '../data/mecha' | ||
export default { | ||
name: 'Mecha', | ||
props: { | ||
setting: Object, | ||
vprompts: Array | ||
}, | ||
data() { | ||
return {} | ||
}, | ||
created() { | ||
prompts.forEach(prompt => { | ||
prompt.items.forEach(item => { | ||
// 查找是否存在匹配的对象 | ||
const match = this.vprompts.find(i => i.en === item.en); | ||
// 设置 checked 字段 | ||
item.checked = match ? true : false; | ||
}); | ||
}); | ||
}, | ||
watch: { | ||
'vprompts': function (newValue) { | ||
const normalArray = Array.from(newValue); | ||
prompts.forEach(prompt => { | ||
prompt.items.forEach(item => { | ||
// 查找是否存在匹配的对象 | ||
const match = normalArray.find(i => i.en === item.en); | ||
// 设置 checked 字段 | ||
item.checked = match ? true : false; | ||
}); | ||
}); | ||
} | ||
}, | ||
methods: { | ||
downWeight(item) { | ||
if (item.en.startsWith('(') && item.en.endsWith(')')) { | ||
item.en = item.en.substring(1, item.en.length - 1) | ||
} else { | ||
item.en = `[${item.en}]` | ||
} | ||
this.$forceUpdate() | ||
}, | ||
upWeight(item) { | ||
if (item.en.startsWith('[') && item.en.endsWith(']')) { | ||
item.en = item.en.substring(1, item.en.length - 1) | ||
} else { | ||
item.en = `(${item.en})` | ||
} | ||
this.$forceUpdate() | ||
}, | ||
selectPrompt(item) { | ||
item.checked = !item.checked | ||
this.$forceUpdate() | ||
this.$emit('selectPrompt', item) | ||
} | ||
}, | ||
computed: { | ||
prompts: function () { | ||
return prompts.map((item) => { | ||
if (this.setting.adult) { | ||
if (item.range == 'adult') { | ||
item.visible = true | ||
} | ||
} else { | ||
if (item.range == 'adult') { | ||
item.visible = false | ||
} | ||
} | ||
return item | ||
}); | ||
} | ||
} | ||
} | ||
</script> | ||
|
||
<!-- Add "scoped" attribute to limit CSS to this component only --> | ||
<style scoped> | ||
.el-button { | ||
margin-left: .2rem; | ||
margin-bottom: .5rem; | ||
} | ||
|
||
.prompt { | ||
margin: 2px; | ||
} | ||
</style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,23 @@ | ||
const prompts = [ | ||
{ | ||
name: '机甲人物风格', | ||
visible: true, | ||
range: 'all', | ||
items: [ | ||
{ en: 'mecha', zh: '机甲' }, | ||
{ en: 'intricate mechanical bodysuit', zh: '复杂的机械紧身衣' }, | ||
{ en: 'mecha corset', zh: '机甲紧身胸衣' }, | ||
{ en: 'mechanical parts', zh: '机械零件' }, | ||
{ en: 'robotic arms and legs', zh: '机械手和机械腿' }, | ||
{ en: 'headgear', zh: '头饰' }, | ||
{ en: 'caustics', zh: '腐蚀性' }, | ||
{ en: 'ray tracing', zh: '光线追踪' }, | ||
{ en: 'demontheme', zh: '恶魔主题' }, | ||
{ en: 'cyber effect', zh: '网络效应' }, | ||
{ en: 'cyberpunk', zh: '赛博朋克' }, | ||
{ en: 'science fiction', zh: '科幻小说' }, | ||
] | ||
} | ||
]; | ||
|
||
export default prompts; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters