修改前端

Yi.Vue/src/App.vue

@@ -0,0 +1,23 @@
+<template>
+  <v-fade-transition mode="out-in">
+    <router-view />
+  </v-fade-transition>
+</template>
+
+<script>
+  // Styles
+  import '@/styles/overrides.sass'
+
+  export default {
+    name: 'App',
+    metaInfo: {
+      title: 'App',
+      titleTemplate: '%s | Material Dashboard Free',
+      htmlAttrs: { lang: 'en' },
+      meta: [
+        { charset: 'utf-8' },
+        { name: 'viewport', content: 'width=device-width, initial-scale=1' },
+      ],
+    },
+  }
+</script>

Yi.Vue/src/assets/logo.svg

@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 87.5 100"><defs><style>.cls-1{fill:#1697f6;}.cls-2{fill:#7bc6ff;}.cls-3{fill:#1867c0;}.cls-4{fill:#aeddff;}</style></defs><title>Artboard 46</title><polyline class="cls-1" points="43.75 0 23.31 0 43.75 48.32"/><polygon class="cls-2" points="43.75 62.5 43.75 100 0 14.58 22.92 14.58 43.75 62.5"/><polyline class="cls-3" points="43.75 0 64.19 0 43.75 48.32"/><polygon class="cls-4" points="64.58 14.58 87.5 14.58 43.75 100 43.75 62.5 64.58 14.58"/></svg>

Yi.Vue/src/assets/vmd.svg

@@ -0,0 +1,30 @@
+<svg width="256" height="256" viewBox="0 0 256 256" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M132.472 205L182.534 118.292L162.162 130.093V119.162L191.975 102.019L221.665 50.5903L132.472 102.019V205Z" fill="#AEDDFF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M132.472 194.938L173.714 123.386L162.162 130.094V124.255V119.162V113.448L189.863 97.423L214.584 54.5659L132.472 102.019V194.938Z" fill="#AEDDFF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M183.155 101.274L189.987 97.2988L214.707 54.5659L175.329 77.2988C176.447 85.8702 179.18 93.9447 183.155 101.274Z" fill="#AEDDFF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M132.472 194.938L173.839 123.385L162.162 130.093V124.255V123.634C151.23 125.497 141.168 129.845 132.472 135.932V194.938Z" fill="#AEDDFF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M132.472 156.553V178.043C134.584 180.279 136.447 182.515 138.311 184.876L145.888 171.832C141.913 166.242 137.441 161.149 132.472 156.553Z" fill="#AEDDFF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M132.472 146.242C139.056 151.584 145.019 157.671 150.112 164.379L166.137 136.677C156.323 127.236 145.019 119.286 132.472 113.447V146.242Z" fill="#AEDDFF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M160.299 85.9946L141.665 96.8021C151.23 101.647 161.665 105.249 172.472 107.485L189.988 97.4232L195.205 88.3549C191.727 88.7275 188.249 88.8518 184.771 88.8518C176.323 88.8518 168.125 87.858 160.299 85.9946Z" fill="#AEDDFF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M170.609 80.0311C175.206 80.6522 179.926 81.0249 184.771 81.0249C189.988 81.0249 195.081 80.6522 200.05 79.7826L212.1 58.9131C208.87 60.0311 205.516 61.0249 202.038 61.7702L170.609 80.0311Z" fill="#AEDDFF"/>
+<path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M132.472 194.938L173.714 123.385L171.975 124.379L132.472 192.826" fill="#AEDDFF"/>
+<path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M189.117 96.5534L161.043 112.827L162.161 119.162V113.448L189.863 97.423L214.583 54.5659L212.72 55.6839L189.117 96.5534Z" fill="#AEDDFF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M123.528 205V102.019L34.3359 50.5903L84.398 137.298V113.696L93.8389 119.162V153.572L123.528 205Z" fill="#7BC6FF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M123.528 194.937V102.018L43.0308 55.5586L84.3972 127.235V113.695V107.981L93.8381 113.447V119.161V143.509L123.528 194.937Z" fill="#7BC6FF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M123.528 194.937V144.006C116.82 150.714 111.478 158.788 107.875 167.733L123.528 194.937Z" fill="#7BC6FF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M60.5463 85.9933C68.2481 84.5026 75.4531 81.894 82.0369 78.1673L43.0308 55.5586L60.5463 85.9933Z" fill="#7BC6FF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M69.7397 101.895L82.5348 124.006C83.1559 124.131 83.777 124.255 84.3981 124.379V113.82V107.982L93.8391 113.447V119.286V126.367C104.522 129.224 114.46 133.696 123.528 139.534V109.472C109.864 104.379 95.0813 101.522 79.5534 101.522C76.1994 101.522 72.9696 101.646 69.7397 101.895Z" fill="#7BC6FF"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M93.8384 143.509L100.671 155.31C108.994 158.912 116.695 163.633 123.528 169.223V148.85C114.584 142.515 104.646 137.546 93.8384 134.44V143.509Z" fill="#7BC6FF"/>
+<path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M84.3973 114.939V113.696V107.982L93.8383 113.448V119.162V120.404L94.8321 112.827L83.2793 106.119L84.3973 114.939Z" fill="#7BC6FF"/>
+<path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M43.0308 55.5586L84.3972 127.235V125.124L44.8941 56.6766L43.0308 55.5586Z" fill="#7BC6FF"/>
+<path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M123.528 192.826L93.8384 141.398V143.51L123.528 194.938" fill="#7BC6FF"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M135.948 60.3699L128.124 64.8994L103.418 50.5903H54.2114L128.124 93.2086L202.037 50.5903H119.065L135.948 60.3699Z" fill="#1867C0"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M140.065 57.8993L135.947 60.3699L128.124 64.8994L103.418 50.5903H62.5493L128.124 88.4732L193.698 50.5903H127.3L140.065 57.8993Z" fill="#1867C0"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M167.036 66.0317L193.698 50.5903H170.33C168.58 55.4286 167.448 60.6787 167.036 66.0317Z" fill="#1867C0"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M62.5493 50.5903L100.432 72.4142C105.579 67.7817 110.006 62.3258 113.3 56.2522L103.418 50.5903H62.5493Z" fill="#1867C0"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M102.903 50.5903H94.1533C101.977 65.517 113.301 78.2819 127.095 87.8555L128.124 88.4732L140.272 81.4731C125.036 74.8848 112.168 64.0758 102.903 50.5903Z" fill="#1867C0"/>
+<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M128.125 64.8994L118.86 59.5464C126.889 67.37 136.566 73.4436 147.375 77.3555L163.434 68.0906C153.654 67.1641 144.39 64.4876 135.948 60.3699L128.125 64.8994Z" fill="#1867C0"/>
+<path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M127.301 50.5903L140.066 57.8993L135.948 60.3699L135.021 60.8846L141.816 57.8993L129.051 50.5903H127.301Z" fill="#1867C0"/>
+<path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M128.124 87.4438L64.2993 50.5903H62.5493L128.124 88.4732L193.698 50.5903H191.948L128.124 87.4438Z" fill="#1867C0"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M167.037 66.0317L163.331 68.0906L147.375 77.3554L140.272 81.4731L128.125 88.4732V93.2086L202.038 50.5903H193.699L167.037 66.0317Z" fill="#1867C0"/>
+</svg>

Yi.Vue/src/assets/vuetify.svg

@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 87.5 100"><defs><style>.cls-1{fill:#1697f6;}.cls-2{fill:#7bc6ff;}.cls-3{fill:#aeddff;}</style></defs><title>Artboard 47</title><polyline class="cls-1" points="43.75 0 23.31 0 43.75 48.32"/><polygon class="cls-2" points="43.75 62.5 43.75 100 0 14.58 22.92 14.58 43.75 62.5"/><polyline class="cls-2" points="43.75 0 64.19 0 43.75 48.32"/><polygon class="cls-3" points="64.58 14.58 87.5 14.58 43.75 100 43.75 62.5 64.58 14.58"/></svg>

Yi.Vue/src/components/Links.vue

@@ -0,0 +1,68 @@
+<template>
+  <v-container>
+    <v-row align="center">
+      <v-col
+        v-for="(link, i) in links"
+        :key="i"
+        class="text-center"
+        cols="6"
+        md="auto"
+      >
+        <a
+          :href="link.href"
+          class="text-decoration-none text-uppercase text-caption font-weight-regular"
+          rel="noopener"
+          target="_blank"
+          v-text="link.text"
+        />
+      </v-col>
+
+      <v-spacer class="hidden-sm-and-down" />
+
+      <v-col
+        cols="12"
+        md="auto"
+      >
+        <div class="text-body-1 font-weight-light pt-6 pt-md-0 text-center">
+          &copy; {{ (new Date()).getFullYear() }}, Made by <v-icon>mdi-vuetify</v-icon>
+          <a
+            href="https://vuetifyjs.com/en/about/meet-the-team/#company"
+            class="text-decoration-none"
+          >Vuetify</a>
+        </div>
+      </v-col>
+    </v-row>
+  </v-container>
+</template>
+
+<script>
+  export default {
+    name: 'Links',
+
+    data: () => ({
+      links: [
+        {
+          href: 'https://vuetifyjs.com/',
+          text: 'Vuetify Docs',
+        },
+        {
+          href: '#',
+          text: 'About Us',
+        },
+        {
+          href: '#',
+          text: 'Blog',
+        },
+        {
+          href: '#',
+          text: 'Licenses',
+        },
+      ],
+    }),
+  }
+</script>
+
+<style lang="sass" scoped>
+  a
+    color: inherit !important
+</style>

Yi.Vue/src/components/MaterialAlert.vue

@@ -0,0 +1,59 @@
+<template>
+  <v-alert
+    class="v-alert--material"
+    dark
+    v-bind="$attrs"
+    v-on="$listeners"
+  >
+    <template
+      v-if="$attrs.icon"
+      v-slot:prepend
+    >
+      <v-avatar
+        class="align-self-start mt-n9 elevation-6 mr-4"
+        size="38"
+      >
+        <v-icon
+          :color="$attrs.color"
+          class="elevation-6 white"
+          light
+        >
+          {{ $attrs.icon }}
+        </v-icon>
+      </v-avatar>
+    </template>
+
+    <slot />
+
+    <template
+      v-if="$attrs.dismissible"
+      v-slot:close="{ toggle }"
+    >
+      <v-btn
+        :aria-label="$vuetify.lang.t('$vuetify.close')"
+        class="ml-4"
+        color
+        icon
+        small
+        @click="toggle"
+      >
+        <v-icon>
+          $vuetify.icons.cancel
+        </v-icon>
+      </v-btn>
+    </template>
+  </v-alert>
+</template>
+
+<script>
+  export default { name: 'MaterialAlert' }
+</script>
+
+<style lang="sass">
+  .v-alert--material
+    margin-top: 32px
+
+    .v-alert__dismissible
+      align-self: flex-start
+      margin: 0 0 0 16px !important
+</style>

Yi.Vue/src/components/MaterialCard.vue

@@ -0,0 +1,113 @@
+<template>
+  <app-card
+    v-bind="$attrs"
+    class="v-card--material mt-4"
+  >
+    <v-card-title class="align-start">
+      <v-sheet
+        :color="color"
+        :width="fullHeader ? '100%' : undefined"
+        class="overflow-hidden mt-n9 transition-swing v-card--material__sheet"
+        elevation="6"
+        max-width="100%"
+        rounded
+      >
+        <v-theme-provider
+          v-if="hasHeading"
+          dark
+        >
+          <div
+            v-if="icon"
+            :class="iconSmall ? 'pa-7' : 'pa-8'"
+          >
+            <v-icon
+              :large="!iconSmall"
+              v-text="icon"
+            />
+          </div>
+
+          <slot name="heading" />
+
+          <div
+            v-if="heading"
+            class="text-h4 white--text pa-7 v-card--material__title"
+          >
+            {{ heading }}
+          </div>
+        </v-theme-provider>
+      </v-sheet>
+
+      <div
+        v-if="hasTitle"
+        :class="fullHeader ? 'pt-4' : 'pl-3'"
+        class="text-h4 v-card--material__title"
+      >
+        <slot name="title" />
+
+        <template v-if="title">
+          {{ title }}
+        </template>
+
+        <div class="text-subtitle-1 mb-n4">
+          <slot name="subtitle" />
+
+          <template v-if="subtitle">
+            {{ subtitle }}
+          </template>
+        </div>
+      </div>
+    </v-card-title>
+
+    <slot />
+
+    <template v-if="$slots.actions">
+      <v-divider class="mt-2 mx-4" />
+
+      <v-card-actions class="px-4 text-caption grey--text">
+        <slot name="actions" />
+      </v-card-actions>
+    </template>
+  </app-card>
+</template>
+
+<script>
+  export default {
+    name: 'MaterialCard',
+
+    props: {
+      color: String,
+      fullHeader: Boolean,
+      heading: String,
+      icon: String,
+      iconSmall: Boolean,
+      subtitle: String,
+      title: String,
+    },
+
+    computed: {
+      hasHeading () {
+        return !!(
+          this.icon ||
+          this.heading ||
+          this.$slots.heading
+        )
+      },
+      hasTitle () {
+        return !!(
+          this.title ||
+          this.subtitle ||
+          this.$slots.title ||
+          this.$slots.subtitle
+        )
+      },
+    },
+  }
+</script>
+
+<style lang="sass">
+  .v-card.v-card--material
+    > .v-card__title
+      > .v-card--material__title
+        flex: 1 1 auto
+        word-break: break-word
+</style>

Yi.Vue/src/components/MaterialChartCard.vue

@@ -0,0 +1,93 @@
+<template>
+  <material-card
+    v-bind="$attrs"
+    class="v-card--material-chart"
+    full-header
+  >
+    <template #heading>
+      <div class="pa-4">
+        <chartist
+          :data="data"
+          :event-handlers="eventHandlers"
+          :options="options"
+          :ratio="ratio"
+          :responsive-options="responsiveOptions"
+          :type="type"
+          style="max-height: 150px;"
+        />
+      </div>
+    </template>
+
+    <template #subtitle>
+      <slot name="subtitle" />
+    </template>
+
+    <slot />
+
+    <template #actions>
+      <slot name="actions" />
+    </template>
+  </material-card>
+</template>
+
+<script>
+  export default {
+    name: 'MaterialChartCard',
+
+    inheritAttrs: false,
+
+    props: {
+      data: {
+        type: Object,
+        default: () => ({}),
+      },
+      eventHandlers: {
+        type: Array,
+        default: () => ([]),
+      },
+      options: {
+        type: Object,
+        default: () => ({}),
+      },
+      ratio: String,
+      responsiveOptions: {
+        type: Array,
+        default: () => ([]),
+      },
+      type: {
+        type: String,
+        required: true,
+        validator: v => ['Bar', 'Line', 'Pie'].includes(v),
+      },
+    },
+  }
+</script>
+
+<style lang="sass">
+  .v-card--material-chart
+    p
+      color: #999
+
+    .v-card--material__sheet
+      max-height: 185px
+      width: 100%
+
+      .ct-label
+        color: rgba(255, 255, 255, 1)
+        opacity: .7
+        font-size: 0.875rem
+        font-weight: 300
+
+      .ct-grid
+        stroke: hsla(0,0%,100%,.2)
+
+      .ct-series-a .ct-point,
+      .ct-series-a .ct-line,
+      .ct-series-a .ct-bar,
+      .ct-series-a .ct-slice-donut
+          stroke: rgba(255,255,255,.8)
+
+      .ct-series-a .ct-slice-pie,
+      .ct-series-a .ct-area
+          fill: rgba(255,255,255,.4)
+</style>

Yi.Vue/src/components/MaterialSnackbar.vue

@@ -0,0 +1,78 @@
+<template>
+  <v-snackbar
+    v-model="internalValue"
+    class="v-snackbar--material"
+    v-bind="{
+      ...$attrs,
+      'color': 'transparent'
+    }"
+  >
+    <material-alert
+      v-model="internalValue"
+      :color="$attrs.color"
+      :dismissible="dismissible"
+      :type="type"
+      class="ma-0"
+      dark
+    >
+      <slot />
+    </material-alert>
+  </v-snackbar>
+</template>
+
+<script>
+  export default {
+    name: 'MaterialSnackbar',
+
+    props: {
+      dismissible: {
+        type: Boolean,
+        default: true,
+      },
+      type: {
+        type: String,
+        default: '',
+      },
+      value: Boolean,
+    },
+
+    data () {
+      return {
+        internalValue: this.value,
+      }
+    },
+
+    watch: {
+      internalValue (val, oldVal) {
+        if (val === oldVal) return
+
+        this.$emit('input', val)
+      },
+      value (val, oldVal) {
+        if (val === oldVal) return
+
+        this.internalValue = val
+      },
+    },
+  }
+</script>
+
+<style lang="sass">
+  .v-snackbar--material
+    margin-top: 32px
+    margin-bottom: 32px
+
+    .v-alert
+      padding: 32px 16px
+
+    .v-alert--material,
+    .v-snack__wrapper
+      border-radius: 4px
+
+    .v-snack__content
+      overflow: visible
+      padding: 0
+
+    .v-snack__action
+      display: none
+</style>

Yi.Vue/src/components/MaterialStatsCard.vue

@@ -0,0 +1,39 @@
+<template>
+  <material-card
+    class="v-card--material-stats"
+    v-bind="$attrs"
+    v-on="$listeners"
+  >
+    <template #subtitle>
+      <div
+        class="text-right text-h3 v-card__subtitle--material-stats"
+        v-text="value"
+      />
+    </template>
+
+    <template #actions>
+      <slot name="actions" />
+    </template>
+
+    <slot />
+  </material-card>
+</template>
+
+<script>
+  export default {
+    name: 'MaterialStatCard',
+
+    props: { value: String },
+  }
+</script>
+
+<style lang="sass">
+.v-card--material-stats.v-card--material .v-card--material__title
+  color: #999999
+  font-size: .875rem !important
+  margin-left: auto
+  text-align: right
+
+.v-card__subtitle--material-stats
+  color: #3C4858
+</style>

Yi.Vue/src/components/Table.vue

@@ -0,0 +1,214 @@
+<template>
+  <v-card>
+    <v-data-table
+      :headers="headers"
+      :items="desserts"
+      sort-by="calories"
+      class="elevation-1"
+      item-key="id"
+      show-select
+      v-model="selected"
+      :search="search"
+    >
+      <template v-slot:top>
+        <!-- 搜索框 -->
+        <v-toolbar flat>
+          <v-spacer></v-spacer>
+          <v-text-field
+            v-model="search"
+            append-icon="mdi-magnify"
+            label="搜索"
+            single-line
+            hide-details
+            class="mx-4"
+          ></v-text-field>
+
+          <v-btn color="primary" dark class="mb-2 mx-2" @click="dialog = true">
+            添加新项
+          </v-btn>
+
+          <!-- 添加提示框 -->
+          <v-dialog v-model="dialog" max-width="500px">
+            <v-card>
+              <v-card-title>
+                <span class="headline">{{ formTitle }}</span>
+              </v-card-title>
+
+              <v-card-text>
+                <v-container>
+                  <v-row>
+                    <v-col
+                      cols="12"
+                      sm="6"
+                      md="4"
+                      v-for="(value, key, index) in editedItem"
+                      :key="index"
+                    >
+                      <v-text-field
+                        v-model="editedItem[key]"
+                        :label="key"
+                      ></v-text-field>
+                    </v-col>
+                  </v-row>
+                </v-container>
+              </v-card-text>
+
+              <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn color="blue darken-1" text @click="close"> 取消 </v-btn>
+                <v-btn color="blue darken-1" text @click="save"> 保存 </v-btn>
+              </v-card-actions>
+            </v-card>
+          </v-dialog>
+
+          <v-btn color="red" dark class="mb-2" @click="deleteItem(null)">
+            删除所选
+          </v-btn>
+
+          <!-- 删除提示框 -->
+          <v-dialog v-model="dialogDelete" max-width="500px">
+            <v-card>
+              <v-card-title class="headline"
+                >你确定要删除此条记录吗？</v-card-title
+              >
+              <v-card-actions>
+                <v-spacer></v-spacer>
+                <v-btn color="blue darken-1" text @click="closeDelete"
+                  >取消</v-btn
+                >
+                <v-btn color="blue darken-1" text @click="deleteItemConfirm"
+                  >确定</v-btn
+                >
+                <v-spacer></v-spacer>
+              </v-card-actions>
+            </v-card>
+          </v-dialog>
+        </v-toolbar>
+      </template>
+
+      <!-- 表格中的删除和修改 -->
+      <template v-slot:item.actions="{ item }">
+        <v-icon small class="mr-2" @click="editItem(item)"> mdi-pencil </v-icon>
+        <v-icon small @click="deleteItem(item)"> mdi-delete </v-icon>
+      </template>
+
+      <!-- 初始化 -->
+      <template v-slot:no-data>
+        <v-btn color="primary" @click="initialize"> 刷新 </v-btn>
+      </template>
+    </v-data-table>
+  </v-card>
+</template>
+<script>
+import itemApi from './TableApi.js'
+export default {
+  name: 'Tables',
+  props: {
+    defaultItem: {
+      type: Object,
+    },
+    headers: {
+      type: Array,
+    },
+    axiosUrls:{
+        type: Object,
+    }
+  },
+
+  data: () => ({
+    page: 1,
+    selected: [],
+    search: "",
+    dialog: false,
+    dialogDelete: false,
+    desserts: [],
+    editedIndex: -1,
+    editedItem: {},
+  }),
+
+  computed: {
+    formTitle() {
+      return this.editedIndex === -1 ? "添加数据" : "编辑数据";
+    },
+  },
+
+  watch: {
+    dialog(val) {
+      val || this.close();
+    },
+    dialogDelete(val) {
+      val || this.closeDelete();
+    },
+  },
+
+  created() {
+    this.initialize();
+  },
+
+  methods: {
+    initialize() {
+        itemApi.getItem(this.axiosUrls.get).then((resp) => {
+          const response = resp.data;
+          this.desserts = response;
+        });
+    
+      this.$nextTick(() => {
+        this.editedItem = Object.assign({}, this.defaultItem);
+        this.editedIndex = -1;
+      });
+    },
+    // 添加和修改都打开同一个编辑框
+
+    editItem(item) {
+      this.editedIndex = this.desserts.indexOf(item);
+      this.editedItem = Object.assign({}, item);
+      this.dialog = true;
+    },
+
+    deleteItem(item) {
+      this.editedIndex = this.desserts.indexOf(item);
+      this.editedItem = Object.assign({}, item);
+      this.dialogDelete = true;
+    },
+    deleteItemConfirm() {
+      var Ids = [];
+      if (this.editedIndex > -1) {
+        Ids.push(this.editedItem.id);
+      } else {
+        this.selected.forEach(function (item) {
+          Ids.push(item.id);
+        });
+      }
+      alert("多行删除");
+        ItemApi.delItemList(this.axiosUrls.del,Ids).then(() => this.initialize());
+      this.closeDelete();
+    },
+    close() {
+      this.dialog = false;
+      this.$nextTick(() => {
+        this.editedItem = Object.assign({}, this.defaultItem);
+        this.editedIndex = -1;
+      });
+    },
+
+    closeDelete() {
+      this.dialogDelete = false;
+      this.$nextTick(() => {
+        this.editedItem = Object.assign({}, this.defaultItem);
+        this.editedIndex = -1;
+      });
+    },
+
+    save() {
+      if (this.editedIndex > -1) {
+        alert("多行更新");
+        ItemApi.updateItem(this.axiosUrls.update,this.editedItem).then(() => this.initialize());
+      } else {
+        alert("添加");
+        ItemApi.addItem(this.axiosUrls.add,this.editedItem).then(() => this.initialize());
+      }
+      this.close();
+    },
+  },
+};
+</script>

Yi.Vue/src/components/TableApi.js

@@ -0,0 +1,30 @@
+import myaxios from '@/util/myaxios'
+export default {
+    getItem(url) {
+        return myaxios({
+            url: url,
+            method: 'get'
+        })
+    },
+    addItem(url, data) {
+        return myaxios({
+            url: url,
+            method: 'post',
+            data: data
+        })
+    },
+    updateItem(url, data) {
+        return myaxios({
+            url: url,
+            method: 'cut',
+            data: data
+        })
+    },
+    delItemList(url, Ids) {
+        return myaxios({
+            url: url,
+            method: 'del',
+            data: Ids
+        })
+    },
+}

Yi.Vue/src/components/ViewIntro.vue

@@ -0,0 +1,37 @@
+<template>
+  <section class="mb-12 text-center">
+    <h1
+      class="mb-2 text-h3"
+      v-text="heading"
+    />
+
+    <div
+      v-if="link"
+      class="text-body-2 font-weight-light"
+    >
+      Please checkout the <a
+        :href="`https://vuetifyjs.com/en/${link}`"
+        class="text-decoration-none secondary--text"
+        target="_blank"
+      >full documentation</a>
+    </div>
+
+    <v-responsive
+      class="text-center mx-auto text-body-1 font-weight-light"
+      max-width="400"
+    >
+      <slot />
+    </v-responsive>
+  </section>
+</template>
+
+<script>
+  export default {
+    name: 'ViewIntro',
+
+    props: {
+      heading: String,
+      link: String,
+    },
+  }
+</script>

Yi.Vue/src/components/app/BarItem.vue

@@ -0,0 +1,29 @@
+<script>
+  import { VHover, VListItem } from 'vuetify/lib'
+
+  export default {
+    name: 'AppBarItem',
+
+    render (h) {
+      return h(VHover, {
+        scopedSlots: {
+          default: ({ hover }) => {
+            return h(VListItem, {
+              attrs: this.$attrs,
+              class: {
+                'black--text': !hover,
+                'white--text secondary elevation-12': hover,
+              },
+              props: {
+                activeClass: '',
+                dark: hover,
+                link: true,
+                ...this.$attrs,
+              },
+            }, this.$slots.default)
+          },
+        },
+      })
+    },
+  }
+</script>

Yi.Vue/src/components/app/Btn.vue

@@ -0,0 +1,22 @@
+<template>
+  <v-btn
+    :color="color"
+    v-bind="$attrs"
+    v-on="$listeners"
+  >
+    <slot />
+  </v-btn>
+</template>
+
+<script>
+  export default {
+    name: 'AppBtn',
+
+    props: {
+      color: {
+        type: String,
+        default: 'primary',
+      },
+    },
+  }
+</script>

Yi.Vue/src/components/app/Card.vue

@@ -0,0 +1,12 @@
+<template>
+  <v-card
+    v-bind="$attrs"
+    v-on="$listeners"
+  >
+    <slot />
+  </v-card>
+</template>
+
+<script>
+  export default { name: 'AppCard' }
+</script>

Yi.Vue/src/components/app/Tabs.vue

@@ -0,0 +1,42 @@
+<template>
+  <v-tabs
+    :active-class="`${color} ${theme.isDark ? 'black' : 'white'}--text`"
+    class="v-tabs--pill"
+    hide-slider
+    v-bind="$attrs"
+    v-on="$listeners"
+  >
+    <slot />
+
+    <slot name="items" />
+  </v-tabs>
+</template>
+
+<script>
+  export default {
+    name: 'AppTabs',
+
+    inject: ['theme'],
+
+    props: {
+      color: {
+        type: String,
+        default: 'primary',
+      },
+    },
+  }
+</script>
+
+<style lang="sass">
+  .v-tabs--pill
+    .v-tab,
+    .v-tab:before
+      border-radius: 24px
+
+    &.v-tabs--icons-and-text
+      &:not(.v-tabs--vertical) > .v-tabs-bar
+        height: 100px
+      .v-tab,
+      .v-tab:before
+        border-radius: 4px
+</style>

Yi.Vue/src/layouts/default/AppBar.vue

@@ -0,0 +1,79 @@
+<template>
+  <v-app-bar
+    id="default-app-bar"
+    app
+    absolute
+    class="v-bar--underline"
+    color="transparent"
+    :clipped-left="$vuetify.rtl"
+    :clipped-right="!$vuetify.rtl"
+    height="70"
+    flat
+  >
+    <v-app-bar-nav-icon
+      class="hidden-md-and-up"
+      @click="drawer = !drawer"
+    />
+
+    <default-drawer-toggle class="hidden-sm-and-down" />
+
+    <v-toolbar-title
+      class="font-weight-light text-h5"
+      v-text="name"
+    />
+
+    <v-spacer />
+
+    <default-search class="hidden-sm-and-down" />
+
+    <default-go-home />
+
+    <default-notifications />
+
+    <default-account />
+  </v-app-bar>
+</template>
+
+<script>
+  // Utilities
+  // import { get, sync } from 'vuex-pathify'
+
+  export default {
+    data:()=>({
+      drawer:true,
+      name:"测试系统"
+    }),
+    name: 'DefaultBar',
+
+    components: {
+      DefaultAccount: () => import(
+        /* webpackChunkName: "default-account" */
+        './widgets/Account'
+      ),
+      DefaultDrawerToggle: () => import(
+        /* webpackChunkName: "default-drawer-toggle" */
+        './widgets/DrawerToggle'
+      ),
+      DefaultGoHome: () => import(
+        /* webpackChunkName: "default-go-home" */
+        './widgets/GoHome'
+      ),
+      DefaultNotifications: () => import(
+        /* webpackChunkName: "default-notifications" */
+        './widgets/Notifications'
+      ),
+      DefaultSearch: () => import(
+        /* webpackChunkName: "default-search" */
+        './widgets/Search'
+      ),
+    },
+
+    // computed: {
+    //   ...sync('app', [
+    //     'drawer',
+    //     'mini',
+    //   ]),
+    //   name: get('route/name'),
+    // },
+  }
+</script>

Yi.Vue/src/layouts/default/Drawer.vue

@@ -0,0 +1,170 @@
+<template>
+  <v-navigation-drawer
+    id="default-drawer"
+    v-model="drawer"
+    :dark="dark"
+    :right="$vuetify.rtl"
+    :src="drawerImage ? image : ''"
+    :mini-variant.sync="mini"
+    mini-variant-width="80"
+    app
+    width="260"
+  >
+    <template
+      v-if="drawerImage"
+      #img="props"
+    >
+      <v-img
+        :key="image"
+        :gradient="gradient"
+        v-bind="props"
+      />
+    </template>
+
+    <div class="px-2">
+      <default-drawer-header />
+
+      <v-divider class="mx-3 mb-2" />
+
+      <default-list :items="items" />
+    </div>
+
+    <template #append>
+      <div class="pa-4 text-center">
+        <app-btn
+          class="text-none mb-4"
+          color="white"
+          href="https://vuetifyjs.com"
+          small
+          text
+        >
+          Documentation
+        </app-btn>
+
+        <app-btn
+          block
+          class="text-none"
+          color="secondary"
+          href="https://store.vuetifyjs.com/products/vuetify-material-dashboard-pro"
+        >
+          <v-icon left>
+            mdi-package-up
+          </v-icon>
+
+          Upgrade to Pro
+        </app-btn>
+      </div>
+    </template>
+
+    <div class="pt-12" />
+  </v-navigation-drawer>
+</template>
+
+<script>
+  // Utilities
+  // import { get, sync } from 'vuex-pathify'
+
+  export default {
+    data:()=>({
+        gradient: [
+    'rgba(0, 0, 0, .7), rgba(0, 0, 0, .7)',
+    'rgba(228, 226, 226, 1), rgba(255, 255, 255, 0.7)',
+    'rgba(244, 67, 54, .8), rgba(244, 67, 54, .8)',
+  ],
+        images: [
+    'https://demos.creative-tim.com/material-dashboard-pro/assets/img/sidebar-1.jpg',
+    'https://demos.creative-tim.com/material-dashboard-pro/assets/img/sidebar-2.jpg',
+    'https://demos.creative-tim.com/material-dashboard-pro/assets/img/sidebar-3.jpg',
+    'https://demos.creative-tim.com/material-dashboard-pro/assets/img/sidebar-4.jpg',
+  ],
+      dark:null,
+      mini: false,
+      items: [
+      {
+        title: "Dashboard",
+        icon: "mdi-view-dashboard",
+        to: "/"
+      },
+      {
+        title: "User Profile",
+        icon: "mdi-account",
+        to: "/components/profile/",
+      },
+      {
+        title: "Regular Tables",
+        icon: "mdi-clipboard-outline",
+        to: "/tables/regular/",
+      },
+      {
+        title: "Typography",
+        icon: "mdi-format-font",
+        to: "/components/typography/",
+      },
+      {
+        title: "Icons",
+        icon: "mdi-chart-bubble",
+        to: "/components/icons/",
+      },
+      {
+        title: "Google Maps",
+        icon: "mdi-map-marker",
+        to: "/maps/google/",
+      },
+      {
+        title: "Notifications",
+        icon: "mdi-bell",
+        to: "/components/notifications/",
+      },
+    ],
+    }),
+    name: 'DefaultDrawer',
+
+    components: {
+      DefaultDrawerHeader: () => import(
+        /* webpackChunkName: "default-drawer-header" */
+        './widgets/DrawerHeader'
+      ),
+      DefaultList: () => import(
+        /* webpackChunkName: "default-list" */
+        './List'
+      ),
+    },
+
+    // computed: {
+    //   ...get('user', [
+    //     'dark',
+    //     'gradient',
+    //     'image',
+    //   ]),
+    //   ...get('app', [
+    //     'items',
+    //     'version',
+    //   ]),
+    //   ...sync('app', [
+    //     'drawer',
+    //     'drawerImage',
+    //     'mini',
+    //   ]),
+    // },
+  }
+</script>
+
+<style lang="sass">
+#default-drawer
+  .v-list-item
+    margin-bottom: 8px
+
+  .v-list-item::before,
+  .v-list-item::after
+    display: none
+
+  .v-list-group__header__prepend-icon,
+  .v-list-item__icon
+    margin-top: 12px
+    margin-bottom: 12px
+    margin-left: 4px
+
+  &.v-navigation-drawer--mini-variant
+    .v-list-item
+      justify-content: flex-start !important
+</style>

Yi.Vue/src/layouts/default/Footer.vue

@@ -0,0 +1,22 @@
+<template>
+  <v-footer
+    id="default-footer"
+    color="transparent"
+    absolute
+    app
+    inset
+  >
+    <links />
+  </v-footer>
+</template>
+
+<script>
+  // Components
+  import Links from '@/components/Links'
+
+  export default {
+    name: 'DefaultFooter',
+
+    components: { Links },
+  }
+</script>

Yi.Vue/src/layouts/default/Index.vue

@@ -0,0 +1,42 @@
+<template>
+  <v-app>
+    <default-bar />
+
+    <default-drawer />
+
+    <default-view />
+
+    <default-footer />
+
+    <!-- <default-settings /> -->
+  </v-app>
+</template>
+
+<script>
+  export default {
+    name: 'DefaultLayout',
+
+    components: {
+      DefaultBar: () => import(
+        /* webpackChunkName: "default-app-bar" */
+        './AppBar'
+      ),
+      DefaultDrawer: () => import(
+        /* webpackChunkName: "default-drawer" */
+        './Drawer'
+      ),
+      DefaultFooter: () => import(
+        /* webpackChunkName: "default-footer" */
+        './Footer'
+      ),
+      // DefaultSettings: () => import(
+      //   /* webpackChunkName: "default-settings" */
+      //   './Settings'
+      // ),
+      DefaultView: () => import(
+        /* webpackChunkName: "default-view" */
+        './View'
+      ),
+    },
+  }
+</script>

Yi.Vue/src/layouts/default/List.vue

@@ -0,0 +1,40 @@
+<template>
+  <v-list
+    expand
+    nav
+    v-bind="$attrs"
+    v-on="$listeners"
+  >
+    <template v-for="(item, i) in items">
+      <default-list-group
+        v-if="item.items"
+        :key="`group-${i}`"
+        :item="item"
+      />
+
+      <default-list-item
+        v-else
+        :key="`item-${i}`"
+        :item="item"
+      />
+    </template>
+  </v-list>
+</template>
+
+<script>
+  export default {
+    name: 'DefaultList',
+
+    components: {
+      DefaultListGroup: () => import('./ListGroup'),
+      DefaultListItem: () => import('./ListItem'),
+    },
+
+    props: {
+      items: {
+        type: Array,
+        default: () => ([]),
+      },
+    },
+  }
+</script>

Yi.Vue/src/layouts/default/ListGroup.vue

@@ -0,0 +1,89 @@
+<template>
+  <v-list-group
+   
+
+    :prepend-icon="item.icon"
+    eager
+    v-bind="$attrs"
+  >
+    <template v-slot:activator>
+      <v-list-item-icon
+        v-if="!item.icon && !item.avatar"
+        class="text-caption text-uppercase text-center my-2 align-self-center"
+        style="margin-top: 14px"
+      >
+        {{ title }}
+      </v-list-item-icon>
+
+      <v-list-item-avatar v-if="item.avatar">
+        <v-img :src="item.avatar" />
+      </v-list-item-avatar>
+
+      <v-list-item-content v-if="item.title">
+        <v-list-item-title v-text="item.title" />
+      </v-list-item-content>
+    </template>
+
+    <template v-for="(child, i) in item.items">
+      <default-list-group
+        v-if="child.items"
+        :key="`sub-group-${i}`"
+        :item="child"
+      />
+
+      <default-list-item
+        v-if="!child.items"
+        :key="`child-${i}`"
+        :item="child"
+      />
+    </template>
+  </v-list-group>
+</template>
+
+<script>
+  // Utilities
+  // import { get } from 'vuex-pathify'
+
+  export default {
+    name: 'DefaultListGroup',
+
+    components: {
+      DefaultListItem: () => import('./ListItem'),
+    },
+
+    props: {
+      item: {
+        type: Object,
+        default: () => ({}),
+      },
+    },
+
+    computed: {
+ 
+      // group () {
+      //   return this.genGroup(this.item.items)
+      // },
+      title () {
+        const matches = this.item.title.match(/\b(\w)/g)
+
+        return matches.join('')
+      },
+    },
+
+    methods: {
+      genGroup (items) {
+        return items.reduce((acc, cur) => {
+          if (!cur.to) return acc
+
+          acc.push(
+            cur.items
+              ? this.genGroup(cur.items)
+              : cur.to.slice(1, -1),
+          )
+
+          return acc
+        }, []).join('|')
+      },
+    },
+  }
+</script>

Yi.Vue/src/layouts/default/ListItem.vue

@@ -0,0 +1,56 @@
+<template>
+  <v-list-item
+    :href="item.href"
+    :rel="item.href ? 'nofollow' : undefined"
+    :target="item.href ? '_blank' : undefined"
+    :to="item.to"
+    active-class="primary white--text"
+    link
+    class="py-1"
+    v-bind="$attrs"
+    v-on="$listeners"
+  >
+    <v-list-item-icon
+      v-if="!item.icon"
+      class="text-caption text-uppercase justify-center ml-1 my-2 align-self-center"
+    >
+      {{ title }}
+    </v-list-item-icon>
+
+    <v-list-item-avatar v-if="item.avatar">
+      <v-img :src="item.avatar" />
+    </v-list-item-avatar>
+
+    <v-list-item-icon
+      v-if="item.icon"
+      class="my-2 align-self-center"
+    >
+      <v-icon v-text="item.icon" />
+    </v-list-item-icon>
+
+    <v-list-item-content v-if="item.title">
+      <v-list-item-title v-text="item.title" />
+    </v-list-item-content>
+  </v-list-item>
+</template>
+
+<script>
+  export default {
+    name: 'DefaultListItem',
+
+    props: {
+      item: {
+        type: Object,
+        default: () => ({}),
+      },
+    },
+
+    computed: {
+      title () {
+        const matches = this.item.title.match(/\b(\w)/g)
+
+        return matches.join('')
+      },
+    },
+  }
+</script>

Yi.Vue/src/layouts/default/View.vue

@@ -0,0 +1,13 @@
+<template>
+  <v-main>
+    <v-container fluid>
+      <router-view :key="$route.path" />
+    </v-container>
+  </v-main>
+</template>
+
+<script>
+  export default {
+    name: 'DefaultView',
+  }
+</script>

Yi.Vue/src/layouts/default/widgets/Account.vue

@@ -0,0 +1,59 @@
+<template>
+  <v-menu
+    bottom
+    left
+    min-width="200"
+    offset-y
+    origin="top right"
+    transition="scale-transition"
+  >
+    <template v-slot:activator="{ attrs, on }">
+      <v-btn
+        class="ml-2"
+        min-width="0"
+        text
+        v-bind="attrs"
+        v-on="on"
+      >
+        <v-icon>mdi-account</v-icon>
+      </v-btn>
+    </template>
+
+    <v-list
+      :tile="false"
+      flat
+      nav
+    >
+      <template v-for="(p, i) in profile">
+        <v-divider
+          v-if="p.divider"
+          :key="`divider-${i}`"
+          class="mb-2 mt-2"
+        />
+
+        <app-bar-item
+          v-else
+          :key="`item-${i}`"
+          to="/"
+        >
+          <v-list-item-title v-text="p.title" />
+        </app-bar-item>
+      </template>
+    </v-list>
+  </v-menu>
+</template>
+
+<script>
+  export default {
+    name: 'DefaultAccount',
+
+    data: () => ({
+      profile: [
+        { title: 'Profile' },
+        { title: 'Settings' },
+        { divider: true },
+        { title: 'Log out' },
+      ],
+    }),
+  }
+</script>

Yi.Vue/src/layouts/default/widgets/AccountSettings.vue

@@ -0,0 +1,39 @@
+<template>
+  <default-list
+    :items="items"
+    class="mb-n2"
+  />
+</template>
+
+<script>
+  export default {
+    name: 'DefaultAccountSettings',
+
+    components: {
+      DefaultList: () => import(
+        /* webpackChunkName: "default-list" */
+        '../List'
+      ),
+    },
+
+    data: () => ({
+      items: [
+        {
+          title: 'John Leider',
+          icon: 'mdi-vuetify',
+          items: [
+            {
+              title: 'My Profile',
+            },
+            {
+              title: 'Edit Profile',
+            },
+            {
+              title: 'Settings',
+            },
+          ],
+        },
+      ],
+    }),
+  }
+</script>

Yi.Vue/src/layouts/default/widgets/DrawerHeader.vue

@@ -0,0 +1,29 @@
+<template>
+  <v-list-item class="mb-0 justify-space-between pl-3">
+    <v-list-item-avatar>
+      <v-img
+        :src="
+          require('@/assets/vmd.svg')"
+      />
+    </v-list-item-avatar>
+
+    <v-list-item-content class="pl-2">
+      <v-list-item-title class="text-h3">
+        <strong class="mr-1 font-weight-black">VMD</strong>
+
+        <span class="primary--text">FREE</span>
+      </v-list-item-title>
+    </v-list-item-content>
+  </v-list-item>
+</template>
+
+<script>
+  // Utilities
+  // import { get } from 'vuex-pathify'
+
+  export default {
+    name: 'DefaultDrawerHeader',
+
+    // computed: { version: get('app/version') },
+  }
+</script>

Yi.Vue/src/layouts/default/widgets/DrawerToggle.vue

@@ -0,0 +1,27 @@
+<template>
+  <v-btn
+    class="ml-3 mr-4"
+    elevation="1"
+    fab
+    small
+    @click="mini = !mini"
+  >
+    <v-icon>
+      {{ mini ? 'mdi-format-list-bulleted' : 'mdi-dots-vertical' }}
+    </v-icon>
+  </v-btn>
+</template>
+
+<script>
+  // Utilities
+  // import { sync } from 'vuex-pathify'
+
+  export default {
+    name: 'DefaultDrawerToggle',
+
+    computed: {
+
+      // mini: sync('app/mini'),
+    },
+  }
+</script>

Yi.Vue/src/layouts/default/widgets/GoHome.vue

@@ -0,0 +1,17 @@
+<template>
+  <v-btn
+    class="ml-2"
+    min-width="0"
+    text
+    to="/"
+    exact
+  >
+    <v-icon>mdi-view-dashboard</v-icon>
+  </v-btn>
+</template>
+
+<script>
+  export default {
+    name: 'DefaultGoHome',
+  }
+</script>

Yi.Vue/src/layouts/default/widgets/Notifications.vue

@@ -0,0 +1,62 @@
+<template>
+  <v-menu
+    bottom
+    left
+    offset-y
+    origin="top right"
+    transition="scale-transition"
+  >
+    <template v-slot:activator="{ attrs, on }">
+      <v-btn
+        class="ml-2"
+        min-width="0"
+        text
+        v-bind="attrs"
+        v-on="on"
+      >
+        <v-badge
+          bordered
+          color="red"
+          overlap
+        >
+          <template v-slot:badge>
+            <span>5</span>
+          </template>
+
+          <v-icon>mdi-bell</v-icon>
+        </v-badge>
+      </v-btn>
+    </template>
+
+    <v-list
+      flat
+      nav
+    >
+      <app-bar-item
+        v-for="(n, i) in notifications"
+        :key="i"
+        link
+      >
+        <v-list-item-content>
+          <v-list-item-title>{{ n }} </v-list-item-title>
+        </v-list-item-content>
+      </app-bar-item>
+    </v-list>
+  </v-menu>
+</template>
+
+<script>
+  export default {
+    name: 'DefaultNotifications',
+
+    data: () => ({
+      notifications: [
+        'Mike John Responded to your email',
+        'You have 5 new tasks',
+        'You\'re now friends with Andrew',
+        'Another Notification',
+        'Another one',
+      ],
+    }),
+  }
+</script>

Yi.Vue/src/layouts/default/widgets/Search.vue

@@ -0,0 +1,31 @@
+<template>
+  <v-text-field
+    placeholder="Search"
+    class="mr-16"
+    color="secondary"
+    hide-details
+    style="max-width: 220px"
+  >
+    <template
+      v-if="$vuetify.breakpoint.mdAndUp"
+      v-slot:append-outer
+    >
+      <v-btn
+        class="mt-n2 ml-n2"
+        fab
+        small
+        elevation="2"
+        height="44"
+        width="44"
+      >
+        <v-icon>mdi-magnify</v-icon>
+      </v-btn>
+    </template>
+  </v-text-field>
+</template>
+
+<script>
+  export default {
+    name: 'DefaultSearch',
+  }
+</script>

Yi.Vue/src/main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './App.vue'
+import router from './router'
+import vuetify from './plugins/vuetify'
+import './plugins'
+Vue.config.productionTip = false
+
+new Vue({
+    router,
+    vuetify,
+    render: function(h) { return h(App) }
+}).$mount('#app')

Yi.Vue/src/plugins/app.js

@@ -0,0 +1,20 @@
+/**
+ * plugins/app.js
+ *
+ * Automatically loads and bootstraps files
+ * in the `./src/components/` folder.
+ */
+
+// Imports
+import Vue from 'vue'
+
+const requireComponent = require.context('@/components', true, /\.vue$/)
+
+for (const file of requireComponent.keys()) {
+  const componentConfig = requireComponent(file)
+
+  Vue.component(
+    componentConfig.default.name,
+    componentConfig.default || componentConfig,
+  )
+}

Yi.Vue/src/plugins/chartist.js

@@ -0,0 +1,4 @@
+import Vue from 'vue'
+import 'chartist/dist/chartist.min.css'
+
+Vue.use(require('vue-chartist'))

Yi.Vue/src/plugins/index.js

@@ -0,0 +1,6 @@
+// Automatically included in './src/main.js'
+
+import './app'
+import './chartist'
+// import './webfontloader'
+// import './vue-meta'

Yi.Vue/src/plugins/vuetify.js

@@ -0,0 +1,30 @@
+// Vuetify Documentation https://vuetifyjs.com
+
+import Vue from 'vue'
+import Vuetify from 'vuetify/lib/framework'
+import ripple from 'vuetify/lib/directives/ripple'
+
+Vue.use(Vuetify, { directives: { ripple } })
+
+const theme = {
+    primary: '#E91E63',
+    secondary: '#9C27b0',
+    accent: '#e91e63',
+    info: '#00CAE3',
+    success: '#4CAF50',
+    warning: '#FB8C00',
+    error: '#FF5252',
+}
+
+export default new Vuetify({
+    breakpoint: { mobileBreakpoint: 960 },
+    icons: {
+        values: { expand: 'mdi-menu-down' },
+    },
+    theme: {
+        themes: {
+            dark: theme,
+            light: theme,
+        },
+    },
+})

Yi.Vue/src/router/index.js

@@ -0,0 +1,29 @@
+import Vue from 'vue'
+import VueRouter from 'vue-router'
+import { trailingSlash } from '@/util/helpers'
+import {
+    layout,
+    route,
+} from '@/util/routes'
+Vue.use(VueRouter)
+
+
+
+const router = new VueRouter({
+    mode: 'history',
+    base: process.env.BASE_URL,
+    scrollBehavior: (to, from, savedPosition) => {
+        if (to.hash) return { selector: to.hash }
+        if (savedPosition) return savedPosition
+
+        return { x: 0, y: 0 }
+    },
+    routes: [layout('Default', [
+        route('Dashboard'),
+        route('UserProfile', null, 'components/profile'),
+    ])]
+})
+router.beforeEach((to, from, next) => {
+    return to.path.endsWith('/') ? next() : next(trailingSlash(to.path))
+})
+export default router

Yi.Vue/src/styles/overrides.sass

@@ -0,0 +1,26 @@
+.text-mono
+  font-family: monospace
+
+// Helpers
+.flex-1-1-auto
+  flex: 1 1 auto !important
+
+.flex-1-0-auto
+  flex: 1 0 auto !important
+
+.flex-0-1-auto
+  flex: 0 1 auto !important
+
+.flex-0-0-auto
+  flex: 0 0 auto !important
+
+.position-relative
+  position: relative !important
+
+.overflow-y-scroll
+  overflow-y: scroll
+
+table
+  > thead > tr > th,
+  > tbody > tr > td
+    font-weight: 300 !important

Yi.Vue/src/styles/variables.scss

@@ -0,0 +1,106 @@
+// reduce button default elevation
+// default background color is #EEEEEE
+
+$btn-sizes: (
+  'small': 28,
+  'default': 41,
+  'large': 54
+);
+
+$btn-font-sizes: (
+  'default': .75rem
+);
+
+$btn-font-weight: 400;
+$btn-letter-spacing: normal;
+$material-light: (
+  'background': #EEEEEE,
+  'text': (
+    'primary': #333333,
+    'secondary': #999999
+  )
+);
+$btn-icon-font-size: 1.0625rem !important;
+
+$list-item-min-height: 48px;
+
+$blockquote-font-size: 1.25rem;
+
+$card-border-radius: 6px;
+$card-text-font-weight: 300;
+$card-elevation: 1;
+
+$data-table-regular-header-font-size: 1.0625rem;
+
+$shadow-key-umbra: (
+  1: (0 1px 4px 0 rgba(0,0,0,.14)),
+  12: (0 16px 38px -12px rgba(0,0,0,.56))
+);
+
+$shadow-key-penumbra: (
+  1: (0 0 0 0 rgba(0,0,0,0)),
+  12: (0 4px 25px 0 rgba(0,0,0,.12))
+);
+
+$shadow-key-ambient: (
+  1: (0 0 0 0 rgba(0,0,0,0)),
+  12: (0 8px 10px -5px rgba(0,0,0,.2))
+);
+
+$headings: (
+  'h1': (
+    'size': 3.3125rem,
+    'line-height': 1.15em,
+    'weight': 300
+  ),
+  'h2': (
+    'size': 2.25rem,
+    'line-height': 1.5em,
+    'weight': 300
+  ),
+  'h3': (
+    'size': 1.5625rem,
+    'line-height': 1.4em,
+    'weight': 300
+  ),
+  'h4': (
+    'size': 1.125rem,
+    'line-height': 1.4em,
+    'weight': 300
+  ),
+  'h5': (
+    'size': 1.0625rem,
+    'line-height': 1.4em,
+    'weight': 300
+  ),
+  'h6': (
+    'size': .75rem,
+    'line-height': 1.5em,
+    'text-transform': uppercase,
+    'weight': 500
+  ),
+  'subtitle-1': (
+    'size': 0.875rem,
+    'weight': 300
+  ),
+  'subtitle-2': (
+    'size': 0.875rem,
+    'line-height': 1.5em !important,
+    'weight': 300
+  ),
+  'caption': (
+    'size': 0.8125rem,
+    'weight': 300
+  ),
+  'overline': (
+    'letter-spacing': normal,
+    'line-height': 0.625rem,
+    'size': 0.625rem,
+    'weight': 500
+  )
+);
+
+// Tabs
+$tab-font-size: .775rem;
+$tab-font-weight: 500;
+$tabs-item-letter-spacing: normal;

Yi.Vue/src/util/dialog.js

@@ -0,0 +1,13 @@
+function notify(resp) {
+    if (resp.status) {
+        this.$dialog.notify.success(resp.msg, {
+            position: "top-right",
+        });
+    } else {
+        this.$dialog.notify.error(resp.msg, {
+            position: "top-right",
+        });
+    }
+};
+
+export default { notify };

Yi.Vue/src/util/globals.js

@@ -0,0 +1,11 @@
+const EN_LOCALE_ONLY = process.env.EN_LOCALE_ONLY === 'true'
+const IN_BROWSER = typeof window !== 'undefined'
+const IS_DEBUG = process.env.DEBUG === 'true'
+const IS_PROD = process.env.NODE_ENV === 'production'
+
+module.exports = {
+  EN_LOCALE_ONLY,
+  IN_BROWSER,
+  IS_DEBUG,
+  IS_PROD,
+}

Yi.Vue/src/util/helpers.js

@@ -0,0 +1,11 @@
+export function leadingSlash (str) {
+  return str.startsWith('/') ? str : '/' + str
+}
+
+export function trailingSlash (str) {
+  return str.endsWith('/') ? str : str + '/'
+}
+
+export const wait = timeout => {
+  return new Promise(resolve => setTimeout(resolve, timeout))
+}

Yi.Vue/src/util/myaction.js

@@ -0,0 +1,16 @@
+const actionList = [
+    "用户管理",
+    "角色管理",
+    "权限管理",
+    "板块管理",
+    "等级管理",
+    "主题管理",
+    "设置管理",
+    "横幅管理",
+    "版本管理",
+    "道具管理",
+    "商城管理",
+    "日志管理",
+    "类型管理"
+];
+export default { actionList };

Yi.Vue/src/util/myaxios.js

@@ -0,0 +1,36 @@
+import axios from 'axios'
+// import store from '../store/index'
+// import VuetifyDialogPlugin from 'vuetify-dialog/nuxt/index';
+const myaxios = axios.create({
+        // baseURL:'/'// 
+        baseURL: process.env.VUE_APP_BASE_API, // /dev-apis
+        timeout: 50000,
+        headers: {
+            'Authorization': 'Bearer ' + ""
+        },
+    })
+    // 请求拦截器
+myaxios.interceptors.request.use(function(config) {
+    // config.headers.Authorization = 'Bearer ' + store.state.user.token;
+    // store.dispatch("openLoad");
+    return config;
+}, function(error) {
+    return Promise.reject(error);
+});
+
+// 响应拦截器
+myaxios.interceptors.response.use(function(response) {
+    const resp = response.data
+        // store.dispatch("closeLoad");
+    return resp;
+}, function(error) {
+    const resp = error.response.data
+        // if (resp.code == undefined && resp.msg == undefined) {
+        //     alert(`错误代码：无，原因：与服务器失去连接`)
+        // } else if (resp.code != 200) {
+        //     alert(`错误代码：${resp.code}，原因：${resp.msg}`)
+        // }
+        // store.dispatch("closeLoad");
+    return Promise.reject(error);
+});
+export default myaxios

Yi.Vue/src/util/myqq.js

@@ -0,0 +1,9 @@
+const myqqLogin = {
+    appId: "101951505",
+    redirectURI: "https://jiftcc.com/qq?state=0",
+};
+const myqqUpdate = {
+    appId: "101951505",
+    redirectURI: "https://jiftcc.com/qq?state=1",
+};
+export default { myqqLogin, myqqUpdate };

Yi.Vue/src/util/routes.js

@@ -0,0 +1,76 @@
+// Imports
+import { kebabCase } from 'lodash'
+import { leadingSlash, trailingSlash } from '@/util/helpers'
+
+export function abort(code = 404) {
+    return {
+        name: 'FourOhFour',
+        path: '*',
+        component: () => error(code),
+    }
+}
+
+export function error(code = 404) {
+    return import (
+        /* webpackChunkName: "error-[request]" */
+        `@/views/${code}.vue`
+    )
+}
+
+export function layout(layout = 'Default', children, path = '') {
+    const dir = kebabCase(layout)
+
+    return {
+        children,
+        component: () =>
+            import (
+                /* webpackChunkName: "layout-[request]" */
+                `@/layouts/${dir}/Index`
+            ),
+        path,
+    }
+}
+
+export function redirect(
+    path = '*',
+    rhandler,
+) {
+    if (typeof path === 'function') {
+        rhandler = path
+        path = '*'
+    }
+
+    return {
+        path,
+        redirect: to => {
+            const rpath = rhandler(to)
+            const url = rpath !== '' ?
+                leadingSlash(trailingSlash(rpath)) :
+                rpath
+
+            return `/${url}`
+        },
+    }
+}
+
+export function route(name, component, path = '') {
+    component = Object(component) === component ?
+        component :
+        { default: name.replace(' ', '') }
+
+    const components = {}
+
+    for (const [key, value] of Object.entries(component)) {
+        components[key] = () =>
+            import (
+                /* webpackChunkName: "views-[request]" */
+                `@/views/${value}`
+            )
+    }
+
+    return {
+        name,
+        components,
+        path,
+    }
+}

Yi.Vue/src/util/signalR.js

@@ -0,0 +1,34 @@
+//引入安装的signalr包
+import * as signalR from '@microsoft/signalr'
+
+const signal = new signalR.HubConnectionBuilder()　　　 //服务器地址
+    .withUrl([process.env.VUE_APP_BASE_API] + '/chat', {})
+    .build()
+
+/* const signalr = function () {
+  var hub
+  if (hub === undefined) {
+    hub = signal
+  }
+  return hub
+} */
+//  自动重连
+// async function start() {
+//     try {
+//         await signal.start()
+//         console.log('connected')
+//     } catch (err) {
+//         console.log(err)
+//         setTimeout(() => start(), 5000)
+//     }
+// }
+
+// signal.onclose(async() => {
+//         await start()
+//     })
+//     //将创建的signal赋值给Vue实例
+export default {
+    install: function(Vue) {
+        Vue.prototype.signalr = signal
+    }
+}

Yi.Vue/src/util/usertoken.js

@@ -0,0 +1,18 @@
+const TOKEN_KEY = "token_key"
+const USER_KEY = "user_key"
+export function getToken() {
+    return localStorage.getItem(TOKEN_KEY)
+}
+export function setToken(token) {
+    return localStorage.setItem(TOKEN_KEY, token)
+}
+export function getUser() {
+    return JSON.parse(localStorage.getItem(USER_KEY))
+}
+export function setUser(user) {
+    return localStorage.setItem(USER_KEY, JSON.stringify(user))
+}
+export function removeToken() {
+    localStorage.removeItem(TOKEN_KEY)
+    localStorage.removeItem(USER_KEY)
+}

Yi.Vue/src/views/Dashboard.vue

@@ -0,0 +1,90 @@
+<template>
+
+
+    <v-card class="mx-auto" width="100%">
+      <ccTable :defaultItem="defaultItem" :headers="headers" :axiosUrls="axiosUrls" ></ccTable>
+    </v-card>
+
+</template>
+<script>
+import ccTable from "../components/Table.vue"
+export default {
+  components: {
+    ccTable
+  },
+  data: () => ({
+axiosUrls:{
+  get:"action/getactions",
+  update:"action/updateaction",
+  del:"action/delAllaction",
+  add:"action/addaction"
+},
+    headers: [
+      {text: "编号",align: "start",value: "id"},
+      { text: "权限名", value: "action_name", sortable: false },
+      { text: "路由", value: "router", sortable: false },
+      { text: "图标", value: "icon", sortable: false },
+       { text: "排序", value: "sort", sortable: true },
+      { text: "操作", value: "actions", sortable: false },
+    ],
+   defaultItem: {
+      action_name: "test",
+      router: "/my/",
+      icon: "mdi-lock",
+      sort:"1"
+    },
+
+    items: [
+      {
+        title: "Dashboard",
+        icon: "mdi-view-dashboard",
+        to: "/",
+        items: [
+          {
+            title: "Dashboard",
+            icon: "mdi-view-dashboard",
+            to: "/",
+            items: [
+              {
+                title: "User Profile",
+                icon: "mdi-account",
+                to: "/components/profile/",
+              },
+            ],
+          },
+        ],
+      },
+      {
+        title: "User Profile",
+        icon: "mdi-account",
+        to: "/components/profile/",
+      },
+      {
+        title: "Regular Tables",
+        icon: "mdi-clipboard-outline",
+        to: "/tables/regular/",
+      },
+      {
+        title: "Typography",
+        icon: "mdi-format-font",
+        to: "/components/typography/",
+      },
+      {
+        title: "Icons",
+        icon: "mdi-chart-bubble",
+        to: "/components/icons/",
+      },
+      {
+        title: "Google Maps",
+        icon: "mdi-map-marker",
+        to: "/maps/google/",
+      },
+      {
+        title: "Notifications",
+        icon: "mdi-bell",
+        to: "/components/notifications/",
+      },
+    ],
+  }),
+};
+</script>

Yi.Vue/src/views/UserProfile.vue

@@ -0,0 +1,4 @@
+<template>
+<div>666</div>
+ 
+</template>