setting.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. const type = 'GcBorder14'
  2. const name='边框十四'
  3. // 右侧配置项
  4. const setting = [
  5. // 背景色
  6. {
  7. label:'边框线颜色',
  8. // 设置组件类型, select / input / colorPicker
  9. type: 'colorPicker',
  10. // 字段
  11. field: 'borderColor',
  12. optionField: 'borderColor', // 对应options中的字段
  13. // 是否多选
  14. multiple: false,
  15. // 绑定的值
  16. value: 'rgba(135, 136, 142, 1)',
  17. },
  18. {
  19. label:'边框线宽度',
  20. // 设置组件类型, select / input / colorPicker
  21. type: 'inputNumber',
  22. // 字段
  23. field: 'borderWidth',
  24. optionField: 'borderWidth', // 对应options中的字段
  25. // 是否多选
  26. multiple: false,
  27. // 绑定的值
  28. value: 2,
  29. },
  30. {
  31. label:'背景色一',
  32. // 设置组件类型, select / input / colorPicker
  33. type: 'colorPicker',
  34. // 字段
  35. field: 'gradientColor0',
  36. optionField: 'gradientColor0', // 对应options中的字段
  37. // 是否多选
  38. multiple: false,
  39. // 绑定的值
  40. value: 'rgba(131, 191, 246, 1)',
  41. },
  42. {
  43. label:'背景色二',
  44. // 设置组件类型, select / input / colorPicker
  45. type: 'colorPicker',
  46. // 字段
  47. field: 'gradientColor1',
  48. optionField: 'gradientColor1', // 对应options中的字段
  49. // 是否多选
  50. multiple: false,
  51. // 绑定的值
  52. value: 'rgba(24, 141, 240, 1)',
  53. },
  54. {
  55. label: '渐变色方向',
  56. // 设置组件类型
  57. type: 'select',
  58. // 字段
  59. field: 'gradientDirection',
  60. // 对应options中的字段
  61. optionField: 'gradientDirection',
  62. // 是否多选
  63. multiple: false,
  64. value: 'to right',
  65. options: [
  66. {
  67. label: '从左到右',
  68. value: 'to right'
  69. },
  70. {
  71. label: '从右到左',
  72. value: 'to left'
  73. },
  74. {
  75. label: '从上到下',
  76. value: 'to bottom'
  77. },
  78. {
  79. label: '从下到上',
  80. value: 'to top'
  81. },
  82. {
  83. label: '从左上到右下',
  84. value: 'to bottom right'
  85. },
  86. {
  87. label: '从右上到左下',
  88. value: 'to bottom left'
  89. },
  90. {
  91. label: '从左下到右上',
  92. value: 'to top right'
  93. },
  94. {
  95. label: '从右下到左上',
  96. value: 'to top left'
  97. }
  98. ]
  99. },
  100. {
  101. label:'不透明度',
  102. // 设置组件类型, select / input / colorPicker
  103. type: 'inputNumber',
  104. // 字段
  105. field: 'opacity',
  106. optionField: 'opacity', // 对应options中的字段
  107. // 是否多选
  108. multiple: false,
  109. // 绑定的值
  110. value: 100,
  111. },
  112. {
  113. label:'左上圆角值',
  114. // 设置组件类型, select / input / colorPicker
  115. type: 'inputNumber',
  116. // 字段
  117. field: 'radiusLeftTop',
  118. optionField: 'radiusLeftTop', // 对应options中的字段
  119. // 是否多选
  120. multiple: false,
  121. // 绑定的值
  122. value: 2,
  123. },
  124. {
  125. label:'左下圆角值',
  126. // 设置组件类型, select / input / colorPicker
  127. type: 'inputNumber',
  128. // 字段
  129. field: 'radiusLeftBottom',
  130. optionField: 'radiusLeftBottom', // 对应options中的字段
  131. // 是否多选
  132. multiple: false,
  133. // 绑定的值
  134. value: 2,
  135. },
  136. {
  137. label:'右上圆角值',
  138. // 设置组件类型, select / input / colorPicker
  139. type: 'inputNumber',
  140. // 字段
  141. field: 'radiusRightTop',
  142. optionField: 'radiusRightTop', // 对应options中的字段
  143. // 是否多选
  144. multiple: false,
  145. // 绑定的值
  146. value: 2,
  147. },
  148. {
  149. label:'右下圆角值',
  150. // 设置组件类型, select / input / colorPicker
  151. type: 'inputNumber',
  152. // 字段
  153. field: 'radiusRightBottom',
  154. optionField: 'radiusRightBottom', // 对应options中的字段
  155. // 是否多选
  156. multiple: false,
  157. // 绑定的值
  158. value: 2,
  159. },
  160. ]
  161. export default {
  162. setting,
  163. type,
  164. name
  165. }