You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

folders.vue 5.2KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220
  1. <template>
  2. <div class="settings-folders">
  3. <PageHeader>
  4. <h2 class="title">
  5. <span class="icon"><font-awesome-icon icon="folder" /></span>
  6. <span>Folders</span>
  7. </h2>
  8. <h3 class="subtitle">
  9. Change the location of the components and files.
  10. </h3>
  11. <template v-slot:right>
  12. <button class="button button--danger" @click="reset()">
  13. <span>Reset</span>
  14. </button>
  15. </template>
  16. </PageHeader>
  17. <div v-if="$dream.isPortable" class="notification">
  18. <span class="icon"><font-awesome-icon icon="exclamation-triangle" /></span>
  19. <span>These options cannot be changed in the portable version.</span>
  20. </div>
  21. <div v-else class="notification">
  22. <span class="icon"><font-awesome-icon icon="info-circle" /></span>
  23. <span>Changing this options needs a restart to take effect.</span>
  24. </div>
  25. <section class="box">
  26. <div class="box__content">
  27. <SettingsField v-model="value$" field-id="folders.cli">
  28. <input
  29. v-if="!$dream.isPortable"
  30. v-model="value$.folders.cli"
  31. readonly
  32. class="input"
  33. :title="value$.folders.cli"
  34. @click.prevent="changePower">
  35. <input
  36. v-else
  37. disabled
  38. readonly
  39. :value="paths.getPowerPath()"
  40. :title="value$.folders.cli"
  41. class="input">
  42. </SettingsField>
  43. <SettingsField v-model="value$" field-id="folders.waifu">
  44. <input
  45. v-if="!$dream.isPortable"
  46. v-model="value$.folders.waifu"
  47. readonly
  48. class="input"
  49. :title="value$.folders.waifu"
  50. @click.prevent="changeWaifu">
  51. <input
  52. v-else
  53. disabled
  54. readonly
  55. :value="paths.getWaifuPath()"
  56. :title="value$.folders.waifu"
  57. class="input">
  58. </SettingsField>
  59. <SettingsField v-model="value$" field-id="folders.models">
  60. <input
  61. v-if="!$dream.isPortable"
  62. v-model="value$.folders.models"
  63. :disabled="$dream.isPortable"
  64. class="input"
  65. readonly
  66. :title="value$.folders.models"
  67. @click.prevent="changeModels">
  68. <input
  69. v-else
  70. disabled
  71. readonly
  72. :value="paths.getModelsPath()"
  73. :title="value$.folders.models"
  74. class="input">
  75. </SettingsField>
  76. <SettingsField v-model="value$" field-id="folders.cropped">
  77. <input
  78. v-if="!$dream.isPortable"
  79. v-model="value$.folders.cropped"
  80. :disabled="$dream.isPortable"
  81. class="input"
  82. readonly
  83. :title="value$.folders.cropped"
  84. @click.prevent="changeCropped">
  85. <input
  86. v-else
  87. disabled
  88. readonly
  89. :value="paths.getCropPath()"
  90. :title="value$.folders.cropped"
  91. class="input">
  92. </SettingsField>
  93. </div>
  94. </section>
  95. </div>
  96. </template>
  97. <script>
  98. import { isNil, cloneDeep, merge } from 'lodash'
  99. import Swal from 'sweetalert2/dist/sweetalert2'
  100. import { VModel } from '~/mixins'
  101. const { paths } = $provider
  102. const { existsSync } = $provider.fs
  103. const { dialog, app } = $provider.api
  104. export default {
  105. mixins: [VModel],
  106. data: () => ({
  107. paths,
  108. }),
  109. methods: {
  110. showOpenDialog(path) {
  111. const dir = dialog.showOpenDialogSync({
  112. defaultPath: path,
  113. properties: ['openDirectory'],
  114. })
  115. if (isNil(dir)) {
  116. return path
  117. }
  118. if (!existsSync(dir[0])) {
  119. // ???
  120. return path
  121. }
  122. return dir[0]
  123. },
  124. changeModels() {
  125. if (this.$dream.isPortable) {
  126. return
  127. }
  128. const dir = this.showOpenDialog(this.value$.folders.models)
  129. this.value$.folders.models = dir
  130. },
  131. changeCropped() {
  132. if (this.$dream.isPortable) {
  133. return
  134. }
  135. const dir = this.showOpenDialog(this.value$.folders.cropped)
  136. this.value$.folders.cropped = dir
  137. },
  138. changePower() {
  139. if (this.$dream.isPortable) {
  140. return
  141. }
  142. const dir = this.showOpenDialog(this.value$.folders.cli)
  143. this.value$.folders.cli = dir
  144. },
  145. changeWaifu() {
  146. if (this.$dream.isPortable) {
  147. return
  148. }
  149. const dir = this.showOpenDialog(this.value$.folders.waifu)
  150. this.value$.folders.waifu = dir
  151. },
  152. async reset() {
  153. const response = await Swal.fire({
  154. title: 'Are you sure?',
  155. text: 'This will set all options in this section to their default values.',
  156. icon: 'warning',
  157. showCancelButton: true,
  158. confirmButtonColor: '#F44336',
  159. confirmButtonText: 'Yes',
  160. })
  161. if (!response.value) {
  162. return
  163. }
  164. // eslint-disable-next-line no-underscore-dangle
  165. const settings = cloneDeep($provider.settings._default.folders)
  166. this.value$.folders = merge(this.value$.folders, settings)
  167. // Ugly...
  168. setTimeout(() => {
  169. app.relaunch()
  170. app.quit()
  171. }, 1000)
  172. },
  173. },
  174. }
  175. </script>
  176. <style lang="scss" scoped>
  177. .settings-folders {
  178. .input {
  179. @apply cursor-pointer;
  180. }
  181. .notification {
  182. @apply mb-4;
  183. }
  184. }
  185. </style>