Line data    Source code

       1           1 : <template lang='pug'>
       2          12 : BaseDialog.x-create-relation-dialog(ref='dialog' title='Add Relation')
       3          12 :   template(v-if='query')
       4          12 :     BaseAnimationGroup.row.justify-content-center(anim="height")
       5          12 :       .col-12(key='query')
       6             :         .input-group.input-group-sm
       7             :           .input-group-prepend
       8             :             button.text-monospace.btn.btn-secondary(type='button' disabled='1') query-selector
       9             :           span.form-control.text-truncate.right.text-monospace.shadow-none(type='text' readonly='1' :value='query') {{ query }}
      10             :       .col-12(key='type')
      11             :         Input.p-0(ref='type' name='type' :inEdit='true')
      12             :           select.x-type(v-model='type')
      13             :             option(v-for='t, k in $options.types' :disabled='t.isAvailable && !t.isAvailable(selection)'
      14             :                 :key='k' :value='k' :selected="type === k") {{ t.name }}
      15          24 :       .col-12(key='typeCustom' v-if='type === "custom"')
      16             :         .row
      17             :           .col-12
      18             :             Input.p-0(ref='attribute-name' name='attribute-name' :inEdit='true' @edit='checkValidity')
      19             :               template(#default='d')
      20             :                 datalist(:id='svgAttributesId')
      21             :                   option opacity
      22           0 :                   option width
      23             :                   option height
      24             :                   option color
      25             :                   option background-color
      26             :                   option offset
      27             :                   option cx
      28             :                   option cy
      29             :                   option r
      30             :                   option radius
      31             :                   option rx
      32             :                   option ry
      33             :                   option rotate
      34             :                   option dx
      35           0 :                   option dy
      36             :                   option fill
      37             :                   option fill-opacity
      38             :                   option stroke
      39             :                   option stroke-width
      40             :                   option scale
      41             :                   option x
      42             :                   option y
      43             :                   option z
      44             :                 input(type='text' v-model='d.$data.editValue' :list='svgAttributesId')
      45             :           .col-12.col-md-6
      46             :             Input.p-0(ref='attribute-type' name='attribute-type' :inEdit='true')
      47             :               template(#default='d')
      48             :                 select(v-model='d.$data.editValue')
      49             :                   option(value='' selected='1') (no set)
      50             :                   option(value='auto') auto
      51             :                   option(value='CSS') CSS
      52             :                   option(value='XML') XML
      53             :           .col-12.col-md-6
      54             :             Input.p-0(ref='calc-mode' name='calc-mode' :inEdit='true')
      55             :               template(#default='d')
      56             :                 select(v-model='d.$data.editValue')
      57             :                   option(value='' selected='1') (no set)
      58             :                   option(value='linear') linear
      59             :                   option(value='discrete') discrete
      60             :           .col-6
      61             :             Input.p-0(ref='from' name='from' :inEdit='true')
      62             :               template(#default='d')
      63             :                 input(type='text' v-model='d.$data.editValue')
      64             :           .col-6
      65             :             Input.p-0(ref='to' name='to' :inEdit='true' @edit='checkValidity')
      66             :               template(#default='d')
      67             :                 input(type='text' v-model='d.$data.editValue' required='1')
      68             :       .col-12(key='typeColor' v-if='type === "color"')
      69             :         .row
      70             :           .col-6
      71             :             Input.p-0(ref='from' name='from' :inEdit='true')
      72             :               template(#default='d')
      73             :                   input(type='color' v-model='d.$data.editValue')
      74             :           .col-6
      75             :             Input.p-0(ref='to' name='to' value='#FFFFFF' :inEdit='true')
      76             :               template(#default='d')
      77             :                 input(type='color' v-model='d.$data.editValue')
      78             :       .col-12(key='typeOpacity' v-if='type === "opacity"')
      79             :         .row
      80             :           .col-6
      81             :             Input.p-0(ref='from' name='from' :inEdit='true' @edit='checkValidity')
      82             :               template(#default='d')
      83             :                   input(type='number' min='0' max='1' step='0.01' v-model='d.$data.editValue')
      84             :           .col-6
      85             :             Input.p-0(ref='to' name='to' :inEdit='true' @edit='checkValidity')
      86             :               template(#default='d')
      87             :                 input(type='number' min='0' max='1' step='0.01' v-model='d.$data.editValue' required='1')
      88             :       .col-12(key='typeWidth' v-if='type === "width" || type === "height"')
      89             :         .row
      90             :           .col-6
      91             :             Input.p-0(ref='from' name='from' :inEdit='true')
      92             :               template(#default='d')
      93             :                   input(type='number' step='any' v-model='d.$data.editValue')
      94             :           .col-6
      95             :             Input.p-0(ref='to' name='to' :inEdit='true' @edit='checkValidity')
      96             :               template(#default='d')
      97             :                 input(type='number' step='any' v-model='d.$data.editValue' required='1')
      98             : 
      99             :   template(v-slot:footer='d')
     100             :     button.btn.btn-secondary(@click='d.resolve(false)') Cancel
     101             :     button.btn.btn-primary(:disabled='!isValid' @click='d.resolve(true)') Create
     102             : </template>
     103             : <script src='./CreateRelationDialog.vue.js' />
     104             : <style lang="scss">
     105             : .x-create-relation-dialog {
     106             :   .row {
     107             :     align-items: flex-end !important;
     108             :   }
     109           0 : }
     110             : </style>