devextreme-cli 1.6.4 → 1.6.5

package/src/templates/vue-v2/application/src/main.js

@@ -1,16 +0,0 @@
-import Vue from "vue";
-import themes from "devextreme/ui/themes";
-
-import App from "./App";
-import router from "./router";
-import appInfo from "./app-info";
-
-Vue.config.productionTip = false;
-Vue.prototype.$appInfo = appInfo;
-
-themes.initialized(() => {
-  new Vue({
-    router,
-    render: h => h(App)
-  }).$mount("#app");
-});

package/src/templates/vue-v2/application/src/router.js

@@ -1,149 +0,0 @@
-import Vue from "vue";
-import Router from "vue-router";
-
-import auth from "./auth";
-
-<%=^empty%>import Home from "./views/home-page";
-import Profile from "./views/profile-page";
-import Tasks from "./views/tasks-page";
-<%=/empty%>import defaultLayout from "./layouts/<%=layout%>";
-import simpleLayout from "./layouts/single-card";
-
-Vue.use(Router);
-
-const router = new Router({
-  routes: [<%=#empty%>
-    {
-      path: "/",
-      components: {
-        layout: defaultLayout
-      }
-    },<%=/empty%><%=^empty%>
-    {
-      path: "/home",
-      name: "home",
-      meta: { requiresAuth: true },
-      components: {
-        layout: defaultLayout,
-        content: Home
-      }
-    },
-    {
-      path: "/profile",
-      name: "profile",
-      meta: { requiresAuth: true },
-      components: {
-        layout: defaultLayout,
-        content: Profile
-      }
-    },
-    {
-      path: "/tasks",
-      name: "tasks",
-      meta: { requiresAuth: true },
-      components: {
-        layout: defaultLayout,
-        content: Tasks
-      }
-    },<%=/empty%>
-    {
-      path: "/login-form",
-      name: "login-form",
-      meta: { requiresAuth: false },
-      components: {
-        layout: simpleLayout,
-        content: () =>
-          import(/* webpackChunkName: "login" */ "./views/login-form")
-      },
-      props: {
-        layout: {
-          title: "Sign In"
-        }
-      }
-    },
-    {
-      path: "/reset-password",
-      name: "reset-password",
-      meta: { requiresAuth: false },
-      components: {
-        layout: simpleLayout,
-        content: () =>
-          import(/* webpackChunkName: "login" */ "./views/reset-password-form")
-      },
-      props: {
-        layout: {
-          title: "Reset Password",
-          description: "Please enter the email address that you used to register, and we will send you a link to reset your password via Email."
-        }
-      }
-    },
-    {
-      path: "/create-account",
-      name: "create-account",
-      meta: { requiresAuth: false },
-      components: {
-        layout: simpleLayout,
-        content: () =>
-          import(/* webpackChunkName: "login" */ "./views/create-account-form")
-      },
-      props: {
-        layout: {
-          title: "Sign Up"
-        }
-      }
-    },
-    {
-      path: "/change-password/:recoveryCode",
-      name: "change-password",
-      meta: { requiresAuth: false },
-      components: {
-        layout: simpleLayout,
-        content: () =>
-          import(/* webpackChunkName: "login" */ "./views/change-password-form")
-      },
-      props: {
-        layout: {
-          title: "Change Password"
-        }
-      }
-    },<%=^empty%>
-    {
-      path: "/",
-      redirect: "/home"
-    },
-    {
-      path: "/recovery",
-      redirect: "/home"
-    },
-    {
-      path: "*",
-      redirect: "/home"
-    }<%=/empty%><%=#empty%>
-    {
-      path: "*",
-      redirect: "/"
-    }<%=/empty%>
-  ]
-});
-
-router.beforeEach((to, from, next) => {
-
-  if (to.name === "login-form" && auth.loggedIn()) {
-    next({ name: "home" });
-  }
-
-  if (to.matched.some(record => record.meta.requiresAuth)) {
-    if (!auth.loggedIn()) {
-      next({
-        name: "login-form",
-        query: { redirect: to.fullPath }
-      });
-    } else {
-      next();
-    }
-  } else {
-    next();
-  }
-});
-
-export default router;

package/src/templates/vue-v2/application/src/themes/metadata.additional.json

@@ -1,11 +0,0 @@
-{
-  "items": [],
-  "baseTheme": "material.orange.dark",
-  "assetsBasePath": "../../../node_modules/devextreme/dist/css/",
-  "outputColorScheme": "additional",
-  "makeSwatch": true,
-  "base": true,
-  "widgets": [
-    "treeview"
-  ]
-}

package/src/templates/vue-v2/application/src/themes/metadata.base.json

@@ -1,7 +0,0 @@
-{
-  "items": [],
-  "baseTheme": "material.orange.light",
-  "assetsBasePath": "../../../node_modules/devextreme/dist/css/",
-  "outputColorScheme": "base",
-  "base": true
-}

package/src/templates/vue-v2/application/src/utils/media-query.js

@@ -1,33 +0,0 @@
-const Breakpoints = {
-  XSmall: "(max-width: 599.99px)",
-  Small: "(min-width: 600px) and (max-width: 959.99px)",
-  Medium: "(min-width: 960px) and (max-width: 1279.99px)",
-  Large: "(min-width: 1280px)"
-};
-
-let handlers = [];
-const xSmallMedia = window.matchMedia(Breakpoints.XSmall);
-const smallMedia = window.matchMedia(Breakpoints.Small);
-const mediumMedia = window.matchMedia(Breakpoints.Medium);
-const largeMedia = window.matchMedia(Breakpoints.Large);
-
-[xSmallMedia, smallMedia, mediumMedia, largeMedia].forEach(media => {
-  media.addListener(() => {
-    handlers.forEach(handler => handler());
-  });
-});
-
-export const sizes = () => {
-  return {
-    "screen-x-small": xSmallMedia.matches,
-    "screen-small": smallMedia.matches,
-    "screen-medium": mediumMedia.matches,
-    "screen-large": largeMedia.matches
-  };
-};
-
-export const subscribe = handler => handlers.push(handler);
-
-export const unsubscribe = handler => {
-  handlers = handlers.filter(item => item !== handler);
-};

package/src/templates/vue-v2/application/src/views/change-password-form.vue

@@ -1,105 +0,0 @@
-<template>
-  <form @submit.prevent="onSubmit">
-    <dx-form :form-data="formData" :disabled="loading">
-      <dx-item
-        data-field="password"
-        editor-type="dxTextBox"
-        :editor-options="{ stylingMode: 'filled', placeholder: 'Password', mode: 'password' }"
-      >
-        <dx-required-rule message="Password is required" />
-        <dx-label :visible="false" />
-      </dx-item>
-      <dx-item
-        data-field="confirmedPassword"
-        editor-type="dxTextBox"
-        :editor-options="{ stylingMode: 'filled', placeholder: 'Confirm Password', mode: 'password' }"
-      >
-        <dx-required-rule message="Password is required" />
-        <dx-custom-rule
-          message="Passwords do not match"
-          :validation-callback="confirmPassword"
-        />
-        <dx-label :visible="false" />
-      </dx-item>
-      <dx-button-item>
-        <dx-button-options
-          width="100%"
-          type="default"
-          template="changePassword"
-          :use-submit-behavior="true"
-        >
-        </dx-button-options>
-      </dx-button-item>
-
-      <template #changePassword>
-        <div>
-          <span class="dx-button-text">
-              <dx-loadIndicator v-if="loading" width="24px" height="24px" :visible="true" />
-              <span v-if="!loading">Continue</span>
-          </span>
-        </div>
-      </template>
-    </dx-form>
-  </form>
-</template>
-
-<script>
-import DxForm, {
-  DxItem,
-  DxLabel,
-  DxButtonItem,
-  DxButtonOptions,
-  DxCustomRule,
-  DxRequiredRule
-} from 'devextreme-vue/form';
-import DxLoadIndicator from 'devextreme-vue/load-indicator';
-import notify from 'devextreme/ui/notify';
-
-import auth from "../auth";
-
-export default {
-components: {
-    DxForm,
-    DxItem,
-    DxLabel,
-    DxButtonItem,
-    DxButtonOptions,
-    DxRequiredRule,
-    DxCustomRule,
-    DxLoadIndicator
-  },
-  created() {
-    this.recoveryCode = this.$route.params.recoveryCode;
-  },
-  data() {
-    return {
-        formData: {},
-        loading: false,
-        recoveryCode: ""
-    }
-  },
-  /* eslint-disable  no-debugger */
-  methods: {
-    onSubmit: async function() {
-    const { password } = this.formData;
-    this.loading = true;
-
-    const result = await auth.changePassword(password, this.recoveryCode);
-    this.loading = false;
-
-      if (result.isOk) {
-        this.$router.push("/login-form");
-      } else {
-        notify(result.message, 'error', 2000);
-      }
-    },
-    confirmPassword(e) {
-      return e.value === this.formData.password;
-    }
-  }
-}
-</script>
-
-<style>
-
-</style>

package/src/templates/vue-v2/application/src/views/create-account-form.vue

@@ -1,143 +0,0 @@
-<template>
-  <form class="create-account-form" @submit.prevent="onSubmit">
-    <dx-form :form-data="formData" :disabled="loading">
-      <dx-item
-        data-field="email"
-        editor-type="dxTextBox"
-        :editor-options="{ stylingMode: 'filled', placeholder: 'Email', mode: 'email' }"
-      >
-        <dx-required-rule message="Email is required" />
-        <dx-email-rule message="Email is invalid" />
-        <dx-label :visible="false" />
-      </dx-item>
-      <dx-item
-        data-field="password"
-        editor-type="dxTextBox"
-        :editor-options="{ stylingMode: 'filled', placeholder: 'Password', mode: 'password' }"
-      >
-        <dx-required-rule message="Password is required" />
-        <dx-label :visible="false" />
-      </dx-item>
-      <dx-item
-        data-field="confirmedPassword"
-        editor-type="dxTextBox"
-        :editor-options="{ stylingMode: 'filled', placeholder: 'Confirm Password', mode: 'password' }"
-      >
-        <dx-required-rule message="Password is required" />
-        <dx-custom-rule
-          message="Passwords do not match"
-          :validation-callback="confirmPassword"
-        />
-        <dx-label :visible="false" />
-      </dx-item>
-      <dx-item>
-        <template #default>
-          <div class='policy-info'>
-            By creating an account, you agree to the <router-link to="#">Terms of Service</router-link> and <router-link to="#">Privacy Policy</router-link>
-          </div>
-        </template>
-      </dx-item>
-      <dx-button-item>
-        <dx-button-options
-          width="100%"
-          type="default"
-          template="createAccount"
-          :use-submit-behavior="true"
-        >
-        </dx-button-options>
-      </dx-button-item>
-      <dx-item>
-        <template #default>
-          <div class="login-link">
-            Have an account? <router-link to="/login">Sign In</router-link>
-          </div>
-        </template>
-      </dx-item>
-      <template #createAccount>
-        <div>
-          <span class="dx-button-text">
-              <dx-loadIndicator v-if="loading" width="24px" height="24px" :visible="true" />
-              <span v-if="!loading">Create a new account</span>
-          </span>
-        </div>
-      </template>
-    </dx-form>
-  </form>
-</template>
-
-<script>
-import DxForm, {
-  DxItem,
-  DxLabel,
-  DxButtonItem,
-  DxButtonOptions,
-  DxCustomRule,
-  DxRequiredRule,
-  DxEmailRule
-} from 'devextreme-vue/form';
-import DxLoadIndicator from 'devextreme-vue/load-indicator';
-import notify from 'devextreme/ui/notify';
-
-import auth from "../auth";
-
-export default {
-  components: {
-    DxForm,
-    DxItem,
-    DxLabel,
-    DxButtonItem,
-    DxButtonOptions,
-    DxRequiredRule,
-    DxCustomRule,
-    DxEmailRule,
-    DxLoadIndicator
-  },
-  data() {
-    return {
-        formData: {},
-        loading: false
-    }
-  },
-  methods: {
-    onSubmit: async function() {
-      const { email, password } = this.formData;
-      this.loading = true;
-
-      const result = await auth.createAccount(email, password);
-      this.loading = false;
-
-      if (result.isOk) {
-        this.$router.push("/login-form");
-      } else {
-        notify(result.message, 'error', 2000);
-      }
-    },
-    confirmPassword(e) {
-      return e.value === this.formData.password;
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-@import "../themes/generated/variables.base.scss";
-
-.create-account-form {
-  .policy-info {
-    margin: 10px 0;
-    color: rgba($base-text-color, alpha($base-text-color) * 0.7);
-    font-size: 14px;
-    font-style: normal;
-
-    a {
-      color: rgba($base-text-color, alpha($base-text-color) * 0.7);
-    }
-  }
-
-  .login-link {
-    color: $base-accent;
-    font-size: 16px;
-    text-align: center;
-  }
-}
-</style>

package/src/templates/vue-v2/application/src/views/login-form.vue

@@ -1,133 +0,0 @@
-<template>
-  <form class="login-form" @submit.prevent="onSubmit">
-    <dx-form :form-data="formData" :disabled="loading">
-      <dx-item
-        data-field="email"
-        editor-type="dxTextBox"
-        :editor-options="{ stylingMode: 'filled', placeholder: 'Email', mode: 'email' }"
-      >
-        <dx-required-rule message="Email is required" />
-        <dx-email-rule message="Email is invalid" />
-        <dx-label :visible="false" />
-      </dx-item>
-      <dx-item
-        data-field='password'
-        editor-type='dxTextBox'
-        :editor-options="{ stylingMode: 'filled', placeholder: 'Password', mode: 'password' }"
-      >
-        <dx-required-rule message="Password is required" />
-        <dx-label :visible="false" />
-      </dx-item>
-      <dx-item
-        data-field="rememberMe"
-        editor-type="dxCheckBox"
-        :editor-options="{ text: 'Remember me', elementAttr: { class: 'form-text' } }"
-      >
-        <dx-label :visible="false" />
-      </dx-item>
-      <dx-button-item>
-        <dx-button-options
-          width="100%"
-          type="default"
-          template="signInTemplate"
-          :use-submit-behavior="true"
-        >
-        </dx-button-options>
-      </dx-button-item>
-      <dx-item>
-        <template #default>
-          <div class="link">
-            <router-link to="/reset-password">Forgot password?</router-link>
-          </div>
-        </template>
-      </dx-item>
-      <dx-button-item>
-        <dx-button-options
-          text="Create an account"
-          width="100%"
-          :on-click="onCreateAccountClick"
-        />
-      </dx-button-item>
-      <template #signInTemplate>
-        <div>
-          <span class="dx-button-text">
-            <dx-load-indicator v-if="loading" width="24px" height="24px" :visible="true" />
-            <span v-if="!loading">Sign In</span>
-          </span>
-        </div>
-      </template>
-    </dx-form>
-  </form>
-</template>
-
-<script>
-import DxLoadIndicator from "devextreme-vue/load-indicator";
-import DxForm, {
-  DxItem,
-  DxEmailRule,
-  DxRequiredRule,
-  DxLabel,
-  DxButtonItem,
-  DxButtonOptions
-} from "devextreme-vue/form";
-import notify from 'devextreme/ui/notify';
-
-import auth from "../auth";
-
-export default {
-  data() {
-    return {
-      formData: {},
-      loading: false
-    };
-  },
-  methods: {
-    onCreateAccountClick() {
-      this.$router.push("/create-account");
-    },
-    onSubmit: async function() {
-      const { email, password } = this.formData;
-      this.loading = true;
-
-      const result = await auth.logIn(email, password);
-      if (!result.isOk) {
-        this.loading = false;
-        notify(result.message, "error", 2000);
-      } else {
-        this.$router.push(this.$route.query.redirect || "/home");
-      }
-    }
-  },
-  components: {
-    DxLoadIndicator,
-    DxForm,
-    DxEmailRule,
-    DxRequiredRule,
-    DxItem,
-    DxLabel,
-    DxButtonItem,
-    DxButtonOptions
-  }
-};
-</script>
-
-<style lang="scss">
-@import "../themes/generated/variables.base.scss";
-
-.login-form {
-  .link {
-    text-align: center;
-    font-size: 16px;
-    font-style: normal;
-
-    a {
-      text-decoration: none;
-    }
-  }
-
-  .form-text {
-    margin: 10px 0;
-    color: rgba($base-text-color, alpha($base-text-color) * 0.7);
-  }
-}
-</style>