<template>
  <div v-if="pvm != null">
    <!-- implement the "four states" here -->
    <!--  HIDDEN(already taken care of, just three I guess), EMPTY, SINGLE, MULTIPLE  -->

    <!-- Title and menu -->
    <v-col cols="12">
      <v-menu offset-y>
        <template v-slot:activator="{ on, attrs }">
          <h3>
            {{ $ay.t("WorkOrderItemScheduledUserList") }}
          </h3>
          <v-btn large icon v-bind="attrs" v-on="on">
            <v-icon small color="primary">$ayiEllipsisV</v-icon>
          </v-btn>
        </template>
        <v-list>
          <v-list-item v-if="canAdd" @click="newItem">
            <v-list-item-icon>
              <v-icon>$ayiPlus</v-icon>
            </v-list-item-icon>
            <v-list-item-title>{{ $ay.t("New") }}</v-list-item-title>
          </v-list-item>
        </v-list>
      </v-menu>
    </v-col>

    <!-- <h5 class="ml-12">WorkOrderItemScheduledUsers</h5>
    <div v-if="pvm.hasSelectedWoItem">
      {{ value.items[pvm.selectedItemIndex].scheduledUsers }}
    </div> -->
  </div>
</template>
<script>
/////////////////////////////////////////////////////////////////////////////////////////////////////////////
/*  XXXeslint-disable    */
////////////////////////////////////////////////////////////////////////////////////////////////////////////

export default {
  data() {
    return {};
  },

  props: {
    value: {
      default: null,
      type: Object
    },
    pvm: {
      default: null,
      type: Object
    }
  },

  methods: {
    newItem() {
      console.log("STUB: NEW ITEM");
    },
    form() {
      return window.$gz.form;
    },
    fieldValueChanged(ref) {
      if (!this.formState.loading && !this.formState.readonly) {
        window.$gz.form.fieldValueChanged(this.pvm, ref);
      }
    }
  },
  computed: {
    formState: function() {
      return this.pvm.formState;
    },
    formCustomTemplateKey: function() {
      return this.pvm.formCustomTemplateKey;
    },
    canAdd: function() {
      return (
        !this.value.isLocked &&
        this.pvm.rights.change &&
        this.pvm.subRights.scheduledUsers.create
      );
    }
  }
};
</script>
