lrf402788946 5 tahun lalu
induk
melakukan
b496146472

+ 7 - 1
src/router/index.js

@@ -226,6 +226,12 @@ const newPlan = [
     meta: { title: '学校人数安排' },
     meta: { title: '学校人数安排' },
     component: () => import('@/views/new-plan/arrange/school-num.vue'),
     component: () => import('@/views/new-plan/arrange/school-num.vue'),
   },
   },
+  {
+    path: '/newPlan/school/time',
+    name: 'newPlan_school_time',
+    meta: { title: '学校参培时间' },
+    component: () => import('@/views/new-plan/arrange/school-time.vue'),
+  },
   {
   {
     path: '/newPlan/school',
     path: '/newPlan/school',
     name: 'newPlan_school',
     name: 'newPlan_school',
@@ -424,7 +430,7 @@ const router = new VueRouter({
 });
 });
 router.beforeEach((to, form, next) => {
 router.beforeEach((to, form, next) => {
   store.commit('setUser');
   store.commit('setUser');
-  store.dispatch('setting/fetch');
+  store.dispatch('setting/checkCache');
   if (to.name === 'login') {
   if (to.name === 'login') {
     next();
     next();
     return;
     return;

+ 2 - 2
src/views/new-plan/arrange/arrange.vue

@@ -423,8 +423,8 @@ export default {
       let planyearid = _.get(this.defaultOption, 'planyearid');
       let planyearid = _.get(this.defaultOption, 'planyearid');
       let res = await this.modelFetch({ model: 'trainmodel', planyearid, planid });
       let res = await this.modelFetch({ model: 'trainmodel', planyearid, planid });
       if (this.$checkRes(res)) {
       if (this.$checkRes(res)) {
-        if (res.data.length > 0) {
-          this.$set(this, `template`, res.data[0]);
+        if (res.data !== null) {
+          this.$set(this, `template`, res.data);
         }
         }
       }
       }
     },
     },

+ 62 - 24
src/views/new-plan/arrange/director-arrange.vue

@@ -1,7 +1,7 @@
 <template>
 <template>
   <div id="director-arrange">
   <div id="director-arrange">
     <detail-frame :title="pageTitle">
     <detail-frame :title="pageTitle">
-      <el-row type="flex" align="middle" justify="end" style="padding-bottom:10px">
+      <el-row type="flex" align="middle" justify="end" style="padding-bottom:10px" v-if="!loading">
         <el-col :span="2">
         <el-col :span="2">
           <el-button type="success" size="mini" @click="toSave">保存班主任计划</el-button>
           <el-button type="success" size="mini" @click="toSave">保存班主任计划</el-button>
         </el-col>
         </el-col>
@@ -9,10 +9,33 @@
           <el-button type="primary" size="mini" @click="toArrange">一键分配</el-button>
           <el-button type="primary" size="mini" @click="toArrange">一键分配</el-button>
         </el-col>
         </el-col>
       </el-row>
       </el-row>
-      <data-table v-loading="loading" :fields="fields" :data="classList" :opera="opera" @edit="toEdit" :toFormat="toFormat"></data-table>
+      <!-- <data-table v-loading="loading" :fields="fields" :data="classList" :opera="opera" @edit="toEdit" :toFormat="toFormat"></data-table> -->
+      <el-table :data="classList" border stripe v-loading="loading">
+        <el-table-column align="center" type="expand">
+          <template v-slot="{ row }">
+            <el-table :data="row.data" border stripe>
+              <el-table-column align="center" type="expand">
+                <template v-slot="{ row: batRow }">
+                  <el-table :data="batRow.data" border stripe>
+                    <el-table-column align="center" label="班级" prop="name"></el-table-column>
+                    <el-table-column align="center" label="班主任" prop="headteacherid" :formatter="toFormat"></el-table-column>
+                    <el-table-column align="center" label="操作">
+                      <template v-slot="{ row: claRow }">
+                        <el-button type="text" size="mini" icon="el-icon-edit" @click="toEdit(claRow)"></el-button>
+                      </template>
+                    </el-table-column>
+                  </el-table>
+                </template>
+              </el-table-column>
+              <el-table-column align="center" label="批" prop="batch"></el-table-column>
+            </el-table>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="期" prop="term"></el-table-column>
+      </el-table>
     </detail-frame>
     </detail-frame>
     <el-dialog title="选择班主任" :visible.sync="dialog" width="20%">
     <el-dialog title="选择班主任" :visible.sync="dialog" width="20%">
-      <data-form :data="form" :fields="fields" :rules="{}" @save="handleSave">
+      <data-form :data="form" :fields="fields" :rules="{}" @save="handleSave" :reset="false">
         <template #options="{item,form}">
         <template #options="{item,form}">
           <template v-if="item.model == 'headteacherid'">
           <template v-if="item.model == 'headteacherid'">
             <el-option-group v-for="(dept, index) in htList" :label="dept.name" :key="index">
             <el-option-group v-for="(dept, index) in htList" :label="dept.name" :key="index">
@@ -40,7 +63,7 @@ export default {
   props: {
   props: {
     // events: { type: Array, default: () => [] },
     // events: { type: Array, default: () => [] },
   },
   },
-  components: { dataTable, dataForm, detailFrame },
+  components: { dataForm, detailFrame }, //dataTable
   data: function() {
   data: function() {
     return {
     return {
       loading: true,
       loading: true,
@@ -79,34 +102,31 @@ export default {
       if (!planid) return;
       if (!planid) return;
       let res = await this.query({ planid });
       let res = await this.query({ planid });
       if (this.$checkRes(res)) {
       if (this.$checkRes(res)) {
-        //现在应该不需要过滤班的batch和term了,返回应该有
-        // let arr = res.data.map(i => {
-        //   let e = this.events.find(f => f.termid == i.termid && f._id == i.batchid);
-        //   if (e) {
-        //     i.term = _.get(e, `term`);
-        //     i.batch = _.get(e, `batch`);
-        //   }
-        //   return i;
-        // });
-        // arr = _.reverse(arr.sort((a, b) => a.term - b.term && a.batch - b.batch));
-        // this.$set(this, `classList`, arr);
+        let arr = this.resetList(res.data);
+        this.$set(this, `classList`, arr);
         this.loading = false;
         this.loading = false;
       }
       }
     },
     },
     async toArrange() {
     async toArrange() {
+      let msg = this.$message({ message: '正在分配班主任,请稍后', duration: 0 });
       this.loading = true;
       this.loading = true;
-      let res = await this.divide({ trainplanid: this.id });
+      let duplicate = this.returnList();
+      let planid = _.get(this.defaultOption, `planid`);
+      let res = await this.divide({ trainplanid: planid });
       if (this.$checkRes(res)) {
       if (this.$checkRes(res)) {
-        let arr = this.classList.map(i => {
+        let arr = duplicate.map(i => {
           let r = res.data.find(f => f.classid == i._id);
           let r = res.data.find(f => f.classid == i._id);
           if (r) i.headteacherid = r.headteacherid;
           if (r) i.headteacherid = r.headteacherid;
           return i;
           return i;
         });
         });
+        arr = this.resetList(arr);
         this.$set(this, `classList`, arr);
         this.$set(this, `classList`, arr);
       }
       }
       this.loading = false;
       this.loading = false;
+      msg.close();
+      this.$checkRes(res, '分配完成', res.errmsg);
     },
     },
-    async toEdit({ data, index }) {
+    async toEdit(data) {
       let res = await this.findTeacher({ planid: data.planid, termid: data.termid, batchid: data.batchid });
       let res = await this.findTeacher({ planid: data.planid, termid: data.termid, batchid: data.batchid });
       if (this.$checkRes(res)) {
       if (this.$checkRes(res)) {
         let group = _.groupBy(res.data, 'department');
         let group = _.groupBy(res.data, 'department');
@@ -123,15 +143,15 @@ export default {
         this.$set(this, `htList`, arr);
         this.$set(this, `htList`, arr);
       }
       }
       this.dialog = true;
       this.dialog = true;
-      this.$set(this, `form`, { ...JSON.parse(JSON.stringify(data)), index });
+      this.$set(this, `form`, data);
     },
     },
     handleSave({ data }) {
     handleSave({ data }) {
-      let { index, ...info } = data;
-      this.$set(this.classList, index, info);
+      // let { index, ...info } = data;
+      // this.$set(this.classList, index, info);
       this.dialog = false;
       this.dialog = false;
     },
     },
     async toSave() {
     async toSave() {
-      let data = JSON.parse(JSON.stringify(this.classList));
+      let data = JSON.parse(JSON.stringify(this.returnList()));
       let res = await this.upHeadTea(data);
       let res = await this.upHeadTea(data);
       this.$checkRes(res, '保存成功', res.errmsg || '保存失败');
       this.$checkRes(res, '保存成功', res.errmsg || '保存失败');
     },
     },
@@ -141,12 +161,30 @@ export default {
       res = await this.getDirList();
       res = await this.getDirList();
       if (this.$checkRes(res)) this.$set(this, `dirList`, res.data);
       if (this.$checkRes(res)) this.$set(this, `dirList`, res.data);
     },
     },
-    toFormat({ model, value }) {
+    toFormat(row, column, cellValue) {
+      let model = _.get(column, 'property');
       if (model == 'headteacherid') {
       if (model == 'headteacherid') {
-        let r = this.dirList.find(f => f._id == value);
+        let r = this.dirList.find(f => f._id == cellValue);
         if (r) return r.name;
         if (r) return r.name;
       }
       }
     },
     },
+    resetList(data, prop = 'term') {
+      let duplicate = _.groupBy(_.cloneDeep(data), prop);
+      let keys = Object.keys(duplicate);
+      let arr = keys.map(key => {
+        let obj = {};
+        obj[prop] = key;
+        if (prop == 'term') obj.data = this.resetList(duplicate[key], 'batch');
+        else obj.data = duplicate[key];
+        return obj;
+      });
+      return arr;
+    },
+    returnList() {
+      let duplicate = _.cloneDeep(this.classList);
+      let arr = _.flattenDeep(duplicate.map(i => i.data.map(i => i.data)));
+      return arr;
+    },
   },
   },
   watch: {
   watch: {
     defaultOption: {
     defaultOption: {

+ 54 - 18
src/views/new-plan/arrange/school-num.vue

@@ -3,12 +3,16 @@
     <detail-frame :title="pageTitle">
     <detail-frame :title="pageTitle">
       <data-table ref="table" :fields="fields" :data="list" :opera="opera" :total="total" @edit="toEdit" @query="search"></data-table>
       <data-table ref="table" :fields="fields" :data="list" :opera="opera" :total="total" @edit="toEdit" @query="search"></data-table>
     </detail-frame>
     </detail-frame>
+    <el-dialog title="分配人数" :visible.sync="dialog" @close="toClose">
+      <data-form :data="form" :fields="formFields" :rules="{}" @save="handleSave"> </data-form>
+    </el-dialog>
   </div>
   </div>
 </template>
 </template>
 
 
 <script>
 <script>
 import _ from 'lodash';
 import _ from 'lodash';
 import detailFrame from '@frame/layout/admin/detail-frame';
 import detailFrame from '@frame/layout/admin/detail-frame';
+import dataForm from '@frame/components/form';
 import dataTable from '@frame/components/filter-page-table';
 import dataTable from '@frame/components/filter-page-table';
 import { mapState, createNamespacedHelpers } from 'vuex';
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: plan } = createNamespacedHelpers('trainplan');
 const { mapActions: plan } = createNamespacedHelpers('trainplan');
@@ -16,10 +20,12 @@ const { mapActions: school } = createNamespacedHelpers('school');
 export default {
 export default {
   name: 'school-num',
   name: 'school-num',
   props: {},
   props: {},
-  components: { detailFrame, dataTable },
+  components: { detailFrame, dataTable, dataForm },
   data: function() {
   data: function() {
     return {
     return {
+      dialog: false,
       list: [],
       list: [],
+      form: {},
       plan: {},
       plan: {},
       opera: [
       opera: [
         {
         {
@@ -27,47 +33,77 @@ export default {
           icon: 'el-icon-edit',
           icon: 'el-icon-edit',
           method: 'edit',
           method: 'edit',
         },
         },
-        {
-          label: '删除',
-          icon: 'el-icon-delete',
-          method: 'delete',
-          confirm: true,
-        },
-        {
-          label: '年度计划管理',
-          icon: 'el-icon-date',
-          method: 'plan',
-        },
       ],
       ],
       fields: [
       fields: [
         { label: '学校', prop: 'name' },
         { label: '学校', prop: 'name' },
         { label: '人数', prop: 'num' },
         { label: '人数', prop: 'num' },
       ],
       ],
+      formFields: [
+        { label: '学校', model: 'name', type: 'text' },
+        { label: '人数', model: 'num' },
+      ],
       total: 0,
       total: 0,
     };
     };
   },
   },
-  created() {
-    this.searchPlan();
-    this.search();
+  async created() {
+    await this.searchPlan();
+    await this.search();
   },
   },
   methods: {
   methods: {
-    ...plan({ getPlan: 'fetch' }),
+    ...plan({ getPlan: 'fetch', updatePlan: 'update' }),
     ...school(['query']),
     ...school(['query']),
     async searchPlan() {
     async searchPlan() {
       let planid = _.get(this.defaultOption, 'planid');
       let planid = _.get(this.defaultOption, 'planid');
       if (!planid) return;
       if (!planid) return;
       let res = await this.getPlan(planid);
       let res = await this.getPlan(planid);
-      if (this.$checkRes(res)) this.$set(this, 'plan', res.data);
+      if (this.$checkRes(res)) {
+        // res.data.school = _.uniqBy(res.data.school, 'code');
+        this.$set(this, 'plan', res.data);
+      }
     },
     },
     async search({ skip = 0, limit = 10, ...info } = {}) {
     async search({ skip = 0, limit = 10, ...info } = {}) {
       let res = await this.query({ skip, limit, ...info });
       let res = await this.query({ skip, limit, ...info });
       if (this.$checkRes(res)) {
       if (this.$checkRes(res)) {
         //TODO 查出这页的学校分配的人数,放到学校里面,表格输出
         //TODO 查出这页的学校分配的人数,放到学校里面,表格输出
         this.$set(this, `list`, res.data);
         this.$set(this, `list`, res.data);
+        this.getNum();
         this.$set(this, `total`, res.total);
         this.$set(this, `total`, res.total);
       }
       }
     },
     },
-    async toEdit({ data }) {},
+    async toEdit({ data }) {
+      let { code, name, num, num_id } = data;
+      this.$set(this, `form`, { code, name, num, num_id });
+      this.dialog = true;
+    },
+    async handleSave({ data }) {
+      let { num_id: _id, name, ...info } = data;
+      if (_id) {
+        let i = this.plan.school.findIndex(f => f._id == _id);
+        this.$set(this.plan.school, i, { _id, ...info });
+      } else this.plan.school.push({ _id, ...info });
+      let duplicate = _.cloneDeep(this.plan);
+      let res = await this.updatePlan(duplicate);
+      if (this.$checkRes(res)) {
+        this.toClose();
+        this.getNum();
+      }
+    },
+    getNum() {
+      let spl = _.get(this.plan, `school`);
+      let list = this.list.map(i => {
+        let r = spl.find(f => f.code == i.code);
+        if (r) {
+          i.num_id = r._id;
+          i.num = r.num;
+        }
+        return i;
+      });
+      this.$set(this, `list`, list);
+    },
+    toClose() {
+      this.dialog = false;
+      this.form = {};
+    },
   },
   },
   watch: {
   watch: {
     defaultOption: {
     defaultOption: {

+ 176 - 0
src/views/new-plan/arrange/school-time.vue

@@ -0,0 +1,176 @@
+<template>
+  <div id="index">
+    <list-frame :title="pageTitle" :needFilter="false" :needAdd="false" :needPag="false">
+      <data-table :fields="fields" :data="list" :total="total" @query="search" :opera="opera" @edit="toEdit" :toFormat="toFormat">
+        <template #custom="{item, row}">
+          <template v-if="item.prop == 'daterange'">
+            <span v-for="(i, index) in row.daterange" :key="index">{{ i }};</span>
+          </template>
+        </template>
+      </data-table>
+    </list-frame>
+    <el-dialog title="上报可行日期" width="30%" :visible.sync="dialog" center :destroy-on-close="true" @close="handleClose">
+      <data-form
+        ref="tables"
+        :data="info"
+        :fields="Ffields"
+        :rules="rules"
+        @save="handleSave"
+        :isNew="!info.id"
+        :styles="{ padding: 0 }"
+        labelWidth="80px"
+        :reset="false"
+      >
+        <template #custom="{item,form}">
+          <template v-if="item.model == 'schid'">
+            {{ toFormat({ model: item.model, value: form[item.model] }) }}
+          </template>
+          <template v-if="item.model == 'daterange'">
+            <el-checkbox-group v-model="form[item.model]">
+              <el-checkbox v-for="i in 12" :key="i" :label="`${i}`">{{ i }}月</el-checkbox>
+            </el-checkbox-group>
+          </template>
+        </template>
+      </data-form>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+var moment = require('moment');
+import _ from 'lodash';
+import Vue from 'vue';
+import listFrame from '@frame/layout/admin/list-frame';
+import dataTable from '@frame/components/filter-page-table.vue';
+import dataForm from '@frame/components/form';
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: trainplan } = createNamespacedHelpers('trainplan');
+const { mapActions: school } = createNamespacedHelpers('school');
+const { mapActions: schPlan } = createNamespacedHelpers('schPlan');
+export default {
+  name: 'index',
+  props: {},
+  components: { listFrame, dataTable, dataForm },
+  data: () => {
+    return {
+      dialog: false,
+      schoolList: [],
+      opera: [
+        {
+          label: '上报可行日期',
+          icon: 'el-icon-date',
+          method: 'edit',
+        },
+      ],
+      fields: [
+        { label: '学校', prop: 'schid', format: true },
+        { label: '上报时间', prop: 'daterange', custom: true },
+      ],
+      info: { daterange: [] },
+      form: {},
+      Ffields: [
+        // { label: '年度', model: 'year', type: 'text' },
+        { label: '学校', model: 'schid', custom: true },
+        { label: '请假日期', model: 'daterange', custom: true },
+      ],
+      rules: {},
+      list: [],
+      total: 0,
+      options: {},
+    };
+  },
+  async created() {
+    await this.otherList();
+    // this.search();
+  },
+  methods: {
+    ...school({ getSchool: 'query' }),
+    ...trainplan(['query', 'create', 'delete', 'update']),
+    ...schPlan({ schPlanQuery: 'query', createSchPlan: 'create', updateSchPlan: 'update' }),
+    async search({ skip = 0, limit = 10, ...info } = {}) {
+      let planid = _.get(this.defaultOption, 'planid');
+      if (!planid) return;
+      const res = await this.schPlanQuery({ skip, limit, ...info, planid });
+      if (this.$checkRes(res)) {
+        this.$set(this, `list`, res.data);
+        // this.setSchool();
+        this.$set(this, `total`, res.total);
+      }
+    },
+    async toEdit({ data }) {
+      this.$set(this, `info`, data);
+      this.dialog = true;
+    },
+    async handleSave({ data, isNew }) {
+      let res;
+      let msg;
+      let duplicate = JSON.parse(JSON.stringify(data));
+      if (isNew) {
+        //create
+        res = await this.createSchPlan(duplicate);
+        msg = '添加成功';
+      } else {
+        //update
+        res = await this.updateSchPlan(duplicate);
+        msg = '修改成功';
+      }
+      if (this.$checkRes(res, msg, res.errmsg || '操作失败')) {
+        this.handleClose();
+      }
+    },
+    handleClose() {
+      this.dialog = false;
+      this.info = { daterange: [] };
+    },
+    toSort() {
+      this.info.daterange.sort((a, b) => a - b);
+    },
+    toArrange({ data }) {
+      this.$router.push({ path: './detail', query: { id: data.id } });
+    },
+    toFormat({ model, value }) {
+      let res;
+      if (model == 'schid') {
+        let r = this.schoolList.find(f => f.code == value);
+        if (r) res = r.name;
+      }
+      return res;
+    },
+    async otherList() {
+      let res = await this.getSchool();
+      if (this.$checkRes(res)) this.$set(this, `schoolList`, res.data);
+    },
+  },
+  watch: {
+    defaultOption: {
+      handler(val, oval) {
+        //1,进入页面,val有,oval没有=>都查
+        if (val && !oval) {
+          this.$set(this, `options`, _.cloneDeep(val));
+          this.search();
+        } else {
+          let nplanid = _.get(val, 'planid');
+          let oplanid = _.get(this.options, 'planid');
+          if (nplanid && !_.isEqual(nplanid, oplanid)) {
+            this.$set(this, `options`, _.cloneDeep(val));
+            this.search();
+          }
+        }
+      },
+      immediate: true,
+      deep: true,
+    },
+  },
+  computed: {
+    ...mapState(['user', 'defaultOption']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

+ 4 - 1
src/views/new-plan/index.vue

@@ -199,7 +199,10 @@ export default {
       duplicate.planyearid = this.id;
       duplicate.planyearid = this.id;
       duplicate.planid = planid;
       duplicate.planid = planid;
       let res = await this.sUpdate(duplicate);
       let res = await this.sUpdate(duplicate);
-      if (this.$checkRes(res, '设置成功', res.errmsg)) this.search();
+      if (this.$checkRes(res, '设置成功', res.errmsg)) {
+        this.$router.push({ path: '/' });
+        // this.search();
+      }
     },
     },
     returns() {
     returns() {
       window.history.go(-1);
       window.history.go(-1);

+ 16 - 10
src/views/new-plan/template.vue

@@ -23,6 +23,7 @@ import detailFrame from '@frame/layout/admin/detail-frame';
 import dataForm from '@frame/components/form';
 import dataForm from '@frame/components/form';
 import { mapState, createNamespacedHelpers } from 'vuex';
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: trainTemplate } = createNamespacedHelpers('trainTemplate');
 const { mapActions: trainTemplate } = createNamespacedHelpers('trainTemplate');
+const { mapActions: util } = createNamespacedHelpers('util');
 export default {
 export default {
   name: 'templates',
   name: 'templates',
   props: {},
   props: {},
@@ -55,20 +56,24 @@ export default {
     this.search();
     this.search();
   },
   },
   methods: {
   methods: {
+    ...util({ modelFetch: 'fetch' }),
     ...trainTemplate(['query', 'create', 'update']),
     ...trainTemplate(['query', 'create', 'update']),
     async search() {
     async search() {
-      let res = await this.query();
+      let planyearid = _.get(this.defaultOption, 'planyearid');
+      let planid = _.get(this.defaultOption, 'planid');
+      let res = await this.modelFetch({ model: 'trainmodel', planyearid, planid });
+      // let res = await this.query();
       if (this.$checkRes(res)) {
       if (this.$checkRes(res)) {
-        if (res.data.length > 0) {
-          this.$set(this, `info`, res.data[0]);
-          this.$set(this, `isNew`, false);
-        }
+        this.$set(this, `info`, res.data ? res.data : {});
+        this.$set(this, `isNew`, res.data == null);
       }
       }
     },
     },
     async handleSave({ isNew, data }) {
     async handleSave({ isNew, data }) {
       let res;
       let res;
       if (isNew) {
       if (isNew) {
-        res = await this.create(data);
+        let planyearid = _.get(this.defaultOption, 'planyearid');
+        let planid = _.get(this.defaultOption, 'planid');
+        res = await this.create({ ...data, planyearid, planid });
       } else {
       } else {
         res = await this.update(data);
         res = await this.update(data);
       }
       }
@@ -79,24 +84,25 @@ export default {
         this.toClear();
         this.toClear();
         return;
         return;
       }
       }
-      let colors = _.get(this.info, 'color');
+      let colors = _.get(this.info, 'color', []);
       if (colors && colors.length >= 8) {
       if (colors && colors.length >= 8) {
         this.$message.error('只能选择8个预存颜色');
         this.$message.error('只能选择8个预存颜色');
         return;
         return;
       }
       }
-      let res = this.info.color.find(f => f == data);
+      let res = colors.find(f => f == data);
       if (res) {
       if (res) {
         this.$message.error('已选择当前颜色');
         this.$message.error('已选择当前颜色');
         return;
         return;
       }
       }
-      this.info.color.push(data);
+      colors.push(data);
+      this.$set(this.info, `color`, colors);
     },
     },
     toClear() {
     toClear() {
       this.info.color = [];
       this.info.color = [];
     },
     },
   },
   },
   computed: {
   computed: {
-    ...mapState(['user']),
+    ...mapState(['user', 'defaultOption']),
     pageTitle() {
     pageTitle() {
       return `${this.$route.meta.title}`;
       return `${this.$route.meta.title}`;
     },
     },