2023-2-20

src/utils/index.js

@@ -115,3 +115,45 @@ export function param2Obj(url) {
   })
   return obj
 }
+
+export function  deepCopy(data) {
+  //string,number,bool,null,undefined,symbol
+  //object,array,date
+  if (data && typeof data === "object") {
+    //针对函数的拷贝
+    if (typeof data === "function") {
+      let tempFunc = data.bind(null);
+      tempFunc.prototype = this.deepCopy(data.prototype);
+      return tempFunc;
+    }
+
+    switch (Object.prototype.toString.call(data)) {
+      case "[object String]":
+        return data.toString();
+      case "[object Number]":
+        return Number(data.toString());
+      case "[object Boolean]":
+        return new Boolean(data.toString());
+      case "[object Date]":
+        return new Date(data.getTime());
+      case "[object Array]":
+        let arr = [];
+        for (let i = 0; i < data.length; i++) {
+          arr[i] = this.deepCopy(data[i]);
+        }
+        return arr;
+
+      //js自带对象或用户自定义类实例
+      case "[object Object]":
+        let obj = {};
+        for (let key in data) {
+          //会遍历原型链上的属性方法，可以用hasOwnProperty来控制 （obj.hasOwnProperty(prop)
+          obj[key] = this.deepCopy(data[key]);
+        }
+        return obj;
+    }
+  } else {
+    //string,number,bool,null,undefined,symbol
+    return data;
+  }
+}

src/views/recruitment/component/init.vue

@@ -56,7 +56,7 @@ export default {
   },
   data() {
     return {
-      provincesList:[],
+      provincesList: [],
       table: [
         {
           width: 60,
@@ -82,13 +82,13 @@ export default {
                 type="date"
                 v-model={row.start_date}
                 value-format="yyyy-MM-dd"
-                on={
+                on={{
-                  {
+                  ["change"]: (e) => {
-                    ['change']:e => {
+                    this.$refs["xyTable"].getSelection()?.forEach((item) => {
-                      this.selectChange(this.$refs['xyTable'].getSelection())
+                      if (!item.start_date) item.start_date = e;
-                    }
+                    });
-                  }
+                  },
-                }
+                }}
               ></el-date-picker>
             );
           },
@@ -106,13 +106,13 @@ export default {
                 type="date"
                 v-model={row.end_date}
                 value-format="yyyy-MM-dd"
-                on={
+                on={{
-                  {
+                  ["change"]: (e) => {
-                    ['change']:e => {
+                    this.$refs["xyTable"].getSelection()?.forEach((item) => {
-                      this.selectChange(this.$refs['xyTable'].getSelection())
+                      if (!item.end_date) item.end_date = e;
-                    }
+                    });
-                  }
+                  },
-                }
+                }}
               ></el-date-picker>
             );
           },
@@ -129,28 +129,31 @@ export default {
     selectChange(selection) {
       this.form.detail = selection.map((item) => {
         return {
-          id: item.id,
+          province_id: item.id,
           start_date: item.start_date,
           end_date: item.end_date,
         };
       });
     },
-    submit(){
+    submit() {
-      if(this.form.detail.length <= 0){
+      this.selectChange(this.$refs["xyTable"].getSelection());
+
+      if (this.form.detail.length <= 0) {
         this.$message({
-          type:'warning',
+          type: "warning",
-          message:"请选择需要初始化数据"
+          message: "请选择需要初始化数据",
-        })
+        });
-        return
+        return;
       }
-      init(this.form).then(res => {
+      init(this.form).then((res) => {
         this.$message({
-          type:'success',
+          type: "success",
-          message:"初始化成功"
+          message: "初始化成功",
-        })
+        });
-        this.$emit("update:isShow",false)
+        this.$emit("update:isShow", false);
-      })
+        this.$emit("refresh");
-    }
+      });
+    },
   },
   computed: {},
   watch: {
@@ -160,14 +163,14 @@ export default {
       }
     },
     provinces(newVal){
-      this.provincesList = newVal.map(item => {
+      this.provincesList = newVal.map((item) => {
         return {
-          id:item.id,
+          id: item.id,
-          name:item.name,
+          name: item.name,
-          start_date:"",
+          start_date: "",
-          end_date:""
+          end_date: "",
-        }
+        };
-      })
+      });
     }
   },
 };

src/views/recruitment/progress.vue

@@ -63,10 +63,10 @@
     <addProgress
       ref="addProgress"
       :province_ids="provinces"
-      @refresh="$refs['xyTable'].getTableData(true)"
+      @refresh="$refs['xyTable'].getTableData()"
     ></addProgress>
 
-    <init :is-show.sync="isShowInit" :provinces="provinces"></init>
+    <init :is-show.sync="isShowInit" :provinces="provinces" @refresh="$refs['xyTable'].getTableData(true)"></init>
   </div>
 </template>
 
@@ -99,16 +99,9 @@ export default {
           sortable: "custom",
         },
         {
-          prop: "province_id",
+          prop: "province.name",
           label: "省份",
           width: 140,
-          formatter: (cell, data, val) => {
-            return (
-              this.provinces.filter((item) => {
-                return val === item.id;
-              })[0]?.name || val
-            );
-          },
         },
         {
           prop: "status_id",

src/views/recruitment/recruit.vue

@@ -21,6 +21,10 @@
                   v-model="select.year"
                 ></el-date-picker>
 
+                  <el-select v-model="select.template_item_id" size="small" placeholder="模板类型" style="width: 160px; margin-right: 6px">
+                  <el-option v-for="item in templateItems" :key="item.id" :label="item.name" :value="item.id"></el-option>
+                </el-select>
+
                 <el-input
                   v-model="select.keyword"
                   style="width: 160px; margin-right: 6px"
@@ -128,6 +132,7 @@ export default {
         page: 1,
         page_size: 10,
         template_id: "",
+        template_item_id:"",
       },
       templateItems: [],
 
@@ -187,6 +192,7 @@ export default {
         template_id: this.select.template_id,
       },false);
       this.templateItems = res.data;
+      this.select.template_item_id = this.templateItems[0]?.id
     },
     async getList() {
       this.$refs['xyTable'].loading = true
@@ -232,6 +238,7 @@ export default {
 
     async search() {
       await this.getTemplate();
+      await this.getTemplateItem();
       await this.getList();
     },
 
@@ -248,10 +255,10 @@ export default {
       return map.get(Number(this.$route.meta.params.type));
     },
   },
-  created() {
+  async created() {
-    this.getTemplateItem();
+    await this.getTemplate();
-    this.getProvinces();
+    await this.getTemplateItem();
-    this.getTemplate();
+    await this.getProvinces();
   },
   mounted() {
     this.getList();

src/views/yearScore/component/addYearScore.vue

@@ -41,7 +41,7 @@
               ref="xyTable"
               style="width: 560px"
               :is-page="false"
-              :list="province_lists"
+              :list="provinceList"
               :table-item="provinceTable"
             >
               <template v-slot:btns></template>
@@ -118,6 +118,8 @@
 
 <script>
 import { show, save } from "@/api/yearScore/yearScore";
+import { deepCopy } from "@/utils"
+
 export default {
   props: {
     province_lists: {
@@ -132,6 +134,7 @@ export default {
       type: "",
       action: process.env.VUE_APP_UPLOAD_API,
       fileList: [],
+      provinceList:[],
       provinceTable: [
         {
           type: "selection",
@@ -150,7 +153,16 @@ export default {
               <div>
                 {row.subject?.map((item, index) => {
                   return (
-                    <el-tag key={index} closeable={true}>
+                    <el-tag
+                      key={index}
+                      closable={true}
+                      on={
+                        {
+                          ['close']:e => {
+                            row.subject.splice(row.subject.indexOf(item),1)
+                          }
+                        }
+                      }>
                       {item}
                     </el-tag>
                   );
@@ -163,12 +175,9 @@ export default {
                     size="small"
                     on={{
                       ["blur"]: (e) => {
-                        if(!row.subject){
-                          row.subject = []
-                        }
                         let inputValue = row.inputValue;
                         if (inputValue) {
-                          row.subject?.push(inputValue);
+                          row.subject.push(inputValue);
                         }
                         row.inputVisible = false;
                         row.inputValue = "";
@@ -213,6 +222,7 @@ export default {
     };
   },
   methods: {
+    deepCopy,
     //上传
     successHandle(response, file, fileList) {
       this.fileList = fileList;
@@ -236,7 +246,6 @@ export default {
         id: this.id,
       });
       res.year = String(res?.year);
-      res.province_ids = res?.province_ids?.map((item) => Number(item));
       this.fileList = res.files.map((item) => {
         return {
           name: item.original_name,
@@ -245,6 +254,35 @@ export default {
         };
       });
       this.$integrateData(this.form, res);
+      this.initProvinceList(res.province_ids);
+    },
+
+    initProvinceList(list = []){
+      let ids = list.map(item => Number(item.province_id))
+      this.provinceList = this.province_lists.map(item => {
+        let index = ids.indexOf(item.id)
+        if(index !== -1){
+          return {
+            ...item,
+            inputValue: "",
+            inputVisible:false,
+            subject:(list[index].subject?.length > 0) ? list[index].subject.split(',') : []
+          }
+        }else{
+          return {
+            ...item,
+            inputValue:"",
+            inputVisible:false,
+            subject:[]
+          }
+        }
+      })
+      this.$refs['xyTable'].clearSelection()
+      this.provinceList.forEach(item => {
+        if(ids.indexOf(item.id) !== -1){
+          this.$refs['xyTable'].toggleRowSelection(item,true)
+        }
+      })
     },
 
     submit() {
@@ -253,11 +291,15 @@ export default {
           return {
             province_id:item.id,
             province_name:item.name,
-            subjec:item.subject.toString()
+            subject:item.subject.toString()
           }
         })
       }
 
+      this.form.file_ids = this.fileList.map(item => {
+        return item?.response?.id
+      })
+
       if (this.type === "add") {
         if (this.form.hasOwnProperty("id")) {
           delete this.form.id;
@@ -283,6 +325,15 @@ export default {
       if (val) {
         if (this.type === "editor") {
           this.getDetail();
+        }else{
+          this.provinceList = this.province_lists.map(item => {
+            return {
+              ...item,
+              inputValue:"",
+              inputVisible:false,
+              subject:[]
+            }
+          })
         }
       } else {
         this.id = "";
@@ -292,6 +343,17 @@ export default {
         delete this.form.id;
       }
     },
+
+    // province_lists(val){
+    //   this.provinceList = this.deepCopy(val).map(item => {
+    //     return {
+    //       ...item,
+    //       inputValue:"",
+    //       inputVisible:false,
+    //       subject:[]
+    //     }
+    //   })
+    // }
   },
 };
 </script>

src/views/yearScore/component/addYearScoreDetail.vue

@@ -0,0 +1,283 @@
+<template>
+  <div>
+    <xy-dialog
+      ref="dialog"
+      :is-show.sync="isShow"
+      type="form"
+      :title="type === 'add' ? '新增历年分数明细' : '编辑历年分数明细'"
+      :form="form"
+      :rules="rules"
+      @submit="submit"
+    >
+      <template v-slot:province_id> </template>
+      <template v-slot:year> </template>
+      <template v-slot:type>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red; font-weight: 600; padding-right: 4px"
+              >*</span
+            >
+            招生类型 ：
+          </div>
+          <div class="xy-table-item-content">
+            <el-select
+              v-model="form.type"
+              clearable
+              placeholder="请选择招生类型 "
+              style="width: 300px"
+            >
+              <el-option
+                v-for="item in getConst('type', 'array')"
+                :key="item.id"
+                :label="item.value"
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </div>
+        </div>
+      </template>
+      <template v-slot:specialize_id>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red; font-weight: 600; padding-right: 4px"
+              >*</span
+            >
+            专业 ：
+          </div>
+          <div class="xy-table-item-content">
+            <el-select
+              v-model="form.specialize_id"
+              clearable
+              placeholder="请选择专业 "
+              style="width: 300px"
+            >
+              <el-option
+                v-for="item in specialize_ids"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </div>
+        </div>
+      </template>
+      <template v-slot:max_socre>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red; font-weight: 600; padding-right: 4px"
+              >*</span
+            >
+            最高分 ：
+          </div>
+          <div class="xy-table-item-content">
+            <el-input-number
+              v-model="form.max_socre"
+              clearable
+              placeholder="请输入最高分 "
+              style="width: 300px"
+              :controls="false"
+              :precision="0"
+            />
+          </div>
+        </div>
+      </template>
+      <template v-slot:min_socre>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">
+            <span style="color: red; font-weight: 600; padding-right: 4px"
+              >*</span
+            >
+            最低分 ：
+          </div>
+          <div class="xy-table-item-content">
+            <el-input-number
+              v-model="form.min_socre"
+              clearable
+              placeholder="请输入最低分 "
+              style="width: 300px"
+              :controls="false"
+              :precision="0"
+            />
+          </div>
+        </div>
+      </template>
+      <template v-slot:subject>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">选课 ：</div>
+          <div class="xy-table-item-content" style="width: 300px">
+            <el-tag
+              :key="tag"
+              v-for="tag in form.subject"
+              closable
+              @close="handleClose(tag)"
+            >
+              {{ tag }}
+            </el-tag>
+            <el-input
+              class="input-new-tag"
+              v-if="inputVisible"
+              v-model="inputValue"
+              ref="saveTagInput"
+              size="small"
+              @keyup.enter.native="handleInputConfirm"
+              @blur="handleInputConfirm"
+            >
+            </el-input>
+            <el-button
+              v-else
+              class="button-new-tag"
+              size="small"
+              @click="showInput"
+              >+ 新增</el-button
+            >
+          </div>
+        </div>
+      </template>
+      <template v-slot:remark>
+        <div class="xy-table-item">
+          <div class="xy-table-item-label">备注 ：</div>
+          <div class="xy-table-item-content">
+            <el-input
+              type="textarea"
+              :autosize="{ minRows: 2 }"
+              v-model="form.remark"
+              clearable
+              placeholder="请输入备注 "
+              style="width: 300px"
+            />
+          </div>
+        </div>
+      </template>
+    </xy-dialog>
+  </div>
+</template>
+
+<script>
+import { show, save } from "@/api/yearScore/yearScoreDetail";
+import { getConst } from "@/const";
+export default {
+  props: {
+    specialize_ids: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  data() {
+    return {
+      inputVisible: false,
+      inputValue: "",
+      isShow: false,
+      id: "",
+      type: "",
+
+      form: {
+        province_id: "",
+        year: "",
+        type: "",
+        specialize_id: "",
+        max_socre: "",
+        min_socre: "",
+        subject: [],
+        remark: "",
+      },
+      rules: {
+        type: [
+          {
+            required: true,
+            message: "请填写招生类型",
+          },
+        ],
+        specialize_id: [
+          {
+            required: true,
+            message: "请填写专业",
+          },
+        ],
+        max_socre: [
+          {
+            required: true,
+            message: "请填写最高分",
+          },
+        ],
+        min_socre: [
+          {
+            required: true,
+            message: "请填写最低分",
+          },
+        ],
+      },
+    };
+  },
+  methods: {
+    getConst,
+
+    handleClose(tag) {
+      this.form.subject.splice(this.form.subject.indexOf(tag), 1);
+    },
+
+    showInput() {
+      this.inputVisible = true;
+      this.$nextTick((_) => {
+        this.$refs.saveTagInput.$refs.input.focus();
+      });
+    },
+
+    handleInputConfirm() {
+      let inputValue = this.inputValue;
+      if (inputValue) {
+        this.form.subject.push(inputValue);
+      }
+      this.inputVisible = false;
+      this.inputValue = "";
+    },
+    async getDetail() {
+      const res = await show(this.id);
+      this.$integrateData(this.form, res);
+    },
+
+    submit() {
+      if (this.type === "add") {
+        if (this.form.hasOwnProperty("id")) {
+          delete this.form.id;
+        }
+      }
+      if (this.type === "editor") {
+        Object.defineProperty(this.form, "id", {
+          value: this.id,
+          enumerable: true,
+          configurable: true,
+          writable: true,
+        });
+      }
+      save({
+        ...this.form,
+        subject:this.form.subject.toString()
+      }).then((res) => {
+        this.$successMessage(this.type, "");
+        this.isShow = false;
+        this.$emit("refresh");
+      });
+    },
+  },
+  watch: {
+    isShow(val) {
+      if (val) {
+        if (this.type === "editor") {
+          this.getDetail();
+        }
+      } else {
+        this.id = "";
+        this.type = "";
+        this.$refs["dialog"].reset();
+        delete this.form.id;
+      }
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+::v-deep .el-input__inner {
+  text-align: left;
+}
+</style>

src/views/yearScore/component/imports.vue

@@ -10,52 +10,90 @@
     >
       <div class="label">
         <div class="label_title">省份选择</div>
-        <el-select size="small" v-model="form.province_id" placeholder="请选择省份">
+        <el-select
-          <el-option v-for="item in provinces" :key="item.id" :value="item.id" :label="item.name"></el-option>
+          size="small"
+          v-model="form.province_id"
+          placeholder="请选择省份"
+        >
+          <el-option
+            v-for="item in provinces"
+            :key="item.id"
+            :value="item.id"
+            :label="item.name"
+          ></el-option>
         </el-select>
       </div>
-      <div style="margin-top: 6px;display: flex;align-items: flex-start;">
+      <div style="margin-top: 6px; display: flex; align-items: flex-start">
-        <el-button size="small" type="primary" @click="downLoad">下载导入模板</el-button>
+        <el-button size="small" type="primary" @click="downLoad"
+          >下载导入模板</el-button
+        >
+        <el-button
+          size="small"
+          type="primary"
+          @click="
+            ($refs['addYearScoreDetail'].type = 'add'),
+              ($refs['addYearScoreDetail'].form.province_id = form.province_id),
+              ($refs['addYearScoreDetail'].form.year = form.year),
+              ($refs['addYearScoreDetail'].isShow = true)
+          "
+          >新增</el-button
+        >
         <el-upload
-          style="margin-left: 10px;"
+          style="margin-left: 10px"
           ref="upload"
           accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
           :headers="{
-            'Authorization':`Bearer ${getToken()}`
+            Authorization: `Bearer ${getToken()}`,
           }"
           :action="action"
           :file-list="fileList"
           :on-success="successHandle"
           :on-error="errorHandle"
-          :auto-upload="false">
+          :auto-upload="false"
-          <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
+        >
-          <el-button style="margin-left: 10px;" size="small" type="success" @click="$refs['upload'].submit()">开始上传</el-button>
+          <el-button slot="trigger" size="small" type="primary"
-          <div slot="tip" class="el-upload__tip">支持文件格式：EXCEL，扩展名为 XLSX、XLS</div>
+            >选取文件</el-button
+          >
+          <el-button
+            style="margin-left: 10px"
+            size="small"
+            type="success"
+            @click="$refs['upload'].submit()"
+            >开始上传</el-button
+          >
+          <div slot="tip" class="el-upload__tip">
+            支持文件格式：EXCEL，扩展名为 XLSX、XLS
+          </div>
         </el-upload>
-
       </div>
 
-      <xy-table
+      <xy-table ref="xyTable" :is-page="false" :list="list" :table-item="table">
-        ref="xyTable"
-        :is-page="false"
-        :list="list"
-        :table-item="table"
-      >
         <template v-slot:btns></template>
       </xy-table>
 
       <template v-slot:footer>
-        <Button @click="$emit('update:isShow',false)">取消</Button>
+        <Button @click="$emit('update:isShow', false)">取消</Button>
         <Button type="primary" @click="submit">确认</Button>
       </template>
     </Modal>
+
+    <addYearScoreDetail
+      ref="addYearScoreDetail"
+      :specialize_ids="specializes"
+    ></addYearScoreDetail>
   </div>
 </template>
 
 <script>
-import { index,imports} from "@/api/yearScore/yearScoreDetail"
+import { index, imports } from "@/api/yearScore/yearScoreDetail";
-import { getToken } from "@/utils/auth"
+import { getToken } from "@/utils/auth";
+import { index as specializeIndex } from "@/api/manage/specialize";
+
+import addYearScoreDetail from "./addYearScoreDetail.vue";
 export default {
+  components: {
+    addYearScoreDetail,
+  },
   props: {
     isShow: {
       type: Boolean,
@@ -68,65 +106,93 @@ export default {
   },
   data() {
     return {
-      action:`${process.env.VUE_APP_BASE_API}/api/admin/year_socre_detail/excel_analyse`,
+      action: `${process.env.VUE_APP_BASE_API}/api/admin/year_socre_detail/excel_analyse`,
-      fileList:[],
+      fileList: [],
-      list:[],
+      list: [],
-      table: [
+      table: [],
-      ],
+      total: 0,
+      specializes: [],
 
       form: {
+        province_id: "",
         year: String(new Date().getFullYear()),
         detail: [],
       },
     };
   },
   methods: {
-    index,
     getToken,
 
-    downLoad(){
+    downLoad() {},
-
+    async getSpecializes() {
+      const res = await specializeIndex(
+        {
+          page: 1,
+          page_size: 9999,
+        },
+        false
+      );
+      this.specializes = res.data;
     },
-    successHandle(response, file, fileList){
+    async getList() {
-      this.list = response ?? []
+      this.$refs["xyTable"].loading = true;
+      const res = await index(
+        {
+          year: this.form.year,
+          province_id: this.form.province_id,
+          page: 1,
+          page_size: 9999,
+        },
+        false
+      );
+      this.list = res.data;
+      this.$refs["xyTable"].loading = false;
     },
-    errorHandle(err, file, fileList){
+    successHandle(response, file, fileList) {
+      this.list = response ?? [];
+    },
+    errorHandle(err, file, fileList) {
       this.$message({
-        type:'error',
+        type: "error",
-        message:err
+        message: err,
-      })
+      });
     },
-    submit(){
+    submit() {
-      if(this.form.detail.length <= 0){
+      if (this.form.detail.length <= 0) {
         this.$message({
-          type:'warning',
+          type: "warning",
-          message:"请选择需要初始化数据"
+          message: "请选择需要初始化数据",
-        })
+        });
-        return
+        return;
       }
-      let promiseAll = this.list.map(item => {
+      let promiseAll = this.list.map((item) => {
-        return imports(item)
+        return imports(item);
-      })
+      });
-      Promise.all(promiseAll).then(res => {
+      Promise.all(promiseAll)
-        this.$message({
+        .then((res) => {
-          type:'success',
+          this.$message({
-          message:`成功导入${res.length}条`
+            type: "success",
+            message: `成功导入${res.length}条`,
+          });
+          this.$emit("refresh");
+          this.$emit("update:isShow", false);
         })
-        this.$emit('refresh')
+        .catch((err) => {
-        this.$emit('update:isShow',false)
+          console.log(err);
-      }).catch(err => {
+        });
-        console.log(err)
+    },
-      })
-    }
   },
   computed: {},
   watch: {
     isShow(newVal) {
       if (newVal) {
-        this.$refs["xyTable"].getTableData();
+        this.getList();
       }
     },
   },
+  created() {
+    this.getSpecializes();
+  },
 };
 </script>
 

src/views/yearScore/yearScore.vue

@@ -124,17 +124,11 @@ export default {
                       plain={true}
                       on={{
                         ["click"]: (e) => {
-                          this.showImport(row, Number(val));
+                          this.showImport(row, Number(val.province_id));
                         },
                       }}
                     >
-                      {(() => {
+                      { val.province_name }
-                        return (
-                          this.provinces.filter((item) => {
-                            return item.id == val;
-                          })[0]?.name ?? val
-                        );
-                      })()}
                     </el-button>
                   );
                 })}
@@ -160,8 +154,8 @@ export default {
       this.provinces = res.data;
     },
     showImport(row, province_id = "") {
-      this.$refs["imports"].select.year = String(row.year);
+      this.$refs["imports"].form.year = String(row.year);
-      this.$refs["imports"].select.province_id = province_id;
+      this.$refs["imports"].form.province_id = province_id;
       this.isShowImport = true;
     },
   },
@@ -172,4 +166,5 @@ export default {
 };
 </script>
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+</style>