From 33032d320cb75854def7391026b0401f1bfb8360 Mon Sep 17 00:00:00 2001
From: 黎星凯 <13949086503@163.com>
Date: 星期六, 11 五月 2024 17:26:02 +0800
Subject: [PATCH] 20240511修改: 分发单优化, 分类,物品,分发单明细,采购单明细数据导入

---
 admin-web/src/views/stock/procure/purchaseOrder/index.vue |  646 ++++++++++++++++++++++-----------------------------------
 1 files changed, 251 insertions(+), 395 deletions(-)

diff --git a/admin-web/src/views/stock/procure/purchaseOrder/index.vue b/admin-web/src/views/stock/procure/purchaseOrder/index.vue
index e5f7a65..aa59722 100644
--- a/admin-web/src/views/stock/procure/purchaseOrder/index.vue
+++ b/admin-web/src/views/stock/procure/purchaseOrder/index.vue
@@ -1,126 +1,113 @@
 <template>
-  <div class="app-container">
+  <div class="app-container stock-container">
     <el-container>
-      <el-container>
-        <el-card class="box-card" style="width: 100%" shadow="never">
-          <!--鎼滅储鏉′欢-->
-          <div class="filter-container">
-            <my-search ref="searchBar" :items="items" @search="fifterForm"></my-search>
-          </div>
-          <el-row style="margin-top: 15px">
-            <el-col>
-              <!--鍒楄〃-->
-              <my-button name="鏂板" @click="addtable" site="form" />
-              <div :style="{'overflow-y': 'auto', height:`${clientHeight - 320}px`}">
-                    <el-row class="card"
-                            :gutter="5">
-                        <el-col v-for="(item, index) in proData" :key="index" class="cm-item">
-                          <el-card class="card-data">
-                            <div class="card-container">
-                              <div class="hed-one"> <span>鍏ュ簱鍗曞彿锛歿{ item.order_no }}</span><span style="margin-left: 20px;"><el-button type="warning" plain size="mini">寰呭叆搴�</el-button></span></div>
-                              <div class="one-hed">
-                                <div class="box"><span class="span-two">鏈烘瀯锛�</span>{{ item.customer_name }}</div>
-                                <div class="box"><span class="span-two">鎿嶄綔浜猴細</span>{{ item.customer_name }}</div>
-                                <div class="box"><span class="span-two">鍑哄簱鏃堕棿锛�</span>{{ item.customer_name }}</div>
-                                <div class="box"><span class="span-two">鍏ュ簱鏃堕棿锛�</span>{{ item.customer_name }}</div>
-                              </div>
-                              <div class="card-end">
-                                <div v-for="(just, index) in item.data" class="two-end">
-                                  <div class="item"><span>{{ just.order_no }}锛�</span>{{ just.customer_name }}</div>
-                                </div>
-                              </div>
-                            </div>
-                            <div class="card-but">
-                              <div>
-                                <my-button style="width: 120px;" name="缂栬緫"   site="form" />
-                                <my-button style="width: 120px;" name="鍏ュ簱"   site="form" />
-                              </div>
-                              <div  style="margin-top: 10px;">
-                                <my-button style="width: 120px;" name="鍒犻櫎"   site="form" />
-                                <my-button style="width: 120px;" name="鏌ョ湅璇︽儏" site="form" />
-                              </div>
-                            </div>
-                            
-                          </el-card>
-                        </el-col>
-                    </el-row>
-              </div>
-              <el-pagination
-                :small="false"
-                :current-page="1"
-                :page-sizes="[5, 10, 20, 50, 100, 200, 300, 400, 500]"
-                :page-size="10"
-                layout="total, sizes, prev, pager, next, jumper"
-                :total="0"
-                @size-change="handleSizeChange"
-                @current-change="handleCurrentChange"
-              />
-            </el-col>
-          </el-row>
-          <!--娣诲姞/缂栬緫寮圭獥-->
-          <el-dialog title="鏂板鍑哄簱"  :close-on-click-modal="false" :visible.sync="adddialog" width="60%" >
-            <el-form ref="ruleForm" :model="formData" class="demo-ruleForm" label-width="100px">
-              <el-row :gutter="24" class="headerHeight">
-                  <el-col :span="12">
-                    <el-form-item label="浠撳簱鍚嶇О" prop="name">
-                      <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/>
-                    </el-form-item>
-                  </el-col>
-                  <el-col :span="12">
-                    <el-form-item label="浠撳簱鍚嶇О" prop="name">
-                      <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/>
-                    </el-form-item>
-                  </el-col>
-                </el-row>
-                <el-row :gutter="24" class="headerHeight">
-                  <el-col :span="24">
-                    <el-form-item label="鍑哄簱鎵嬬画" prop="name">                      
-                      浠呭厑璁稿鍏ls銆亁lsx鏍煎紡鏂囦欢
-                    </el-form-item>
-                  </el-col>
-                </el-row>
-                <div style="position: relative;">
-                  <div style="background-color: #F9F9F9;width: 90%;">
-                  <el-row :gutter="24" class="">
-                    <el-col :span="12">
-                      <el-form-item label="浠撳簱鍚嶇О" prop="name">
-                        <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/>
-                      </el-form-item>
-                    </el-col>
-                    <el-col :span="12">
-                      <el-form-item label="浠撳簱鍚嶇О" prop="name">
-                        <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/>
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-                  <el-row :gutter="24" class="">
-                    <el-col :span="12">
-                      <el-form-item label="浠撳簱鍚嶇О" prop="name">
-                        <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/>
-                      </el-form-item>
-                    </el-col>
-                  </el-row>
-                  <el-table :data="formData.tableData" height="100%"  :stripe="true">
-                    <el-table-column prop="projectName" label="瑙勬牸鍨嬪彿" align="center"> </el-table-column>
-                    <el-table-column prop="time1" label="鍗曚綅"  align="center"> </el-table-column>
-                    <el-table-column prop="unit" label="鐜版湁搴撳瓨" align="center"> </el-table-column>
-                    <el-table-column prop="time2" label="鍑哄簱鏁伴噺"  align="center"> </el-table-column>
-                  </el-table>
-                  </div>
-                  <div style="position: absolute;right: 0;top: 152px;">
-                    <my-button style="display: block;margin-left: 10px;margin-bottom: 5px;" name="绉婚櫎" site="form"/>
-                    <my-button name="鏂板鐗╁搧" site="form"/>
-                  </div>
-                </div>
-            </el-form>
-            <div slot="footer" align="center" class="dialog-footer">
-              <my-button name="纭畾" site="form" />
-              <my-button name="鍙栨秷" site="form" @click="adddialog = false"/>
+      <el-card class="box-card" style="width: 100%" shadow="never">
+        <!--鎼滅储鏉′欢-->
+        <div class="filter-container">
+          <my-search ref="searchBar" :items="items" @search="fifterForm"></my-search>
+        </div>
+        <el-row style="margin-top: 15px">
+          <el-col>
+            <!--鍒楄〃-->
+            <div class="table-tool-bar" style="margin-bottom: 15px">
+<!--              <my-button name="鏂板"  check-permission="procure:order:add" @click="handleAdd" site="tools" size="medium" />-->
+              <my-button name="鏂板" @click="handleAdd" site="tools" size="medium" />
+              <my-button name="瀵煎叆" @click="openImport()" site="tools" size="medium" />
             </div>
-          </el-dialog>
-        </el-card>
-      </el-container>
+            <div v-loading="loading" style="margin-bottom: 15px">
+              <div :style="{ 'overflow-y': 'auto', height: 'calc(100vh - 352px)' }">
+                <el-row v-if="list.length" class="card" :gutter="5">
+                  <el-col v-for="(item, index) in list" :key="index" class="cm-item">
+                    <el-card class="card-data">
+                      <div class="card-container">
+                        <div class="card-header">
+                          <div class="card-header-left">
+                            <span>鍏ュ簱鍗曞彿锛�</span>
+                            <span class="value">{{ item.businessFormCode }}</span>
+                            <div class="states" :class="item.states == 1 ? '' : 'states-success'">
+                              {{ item.states == 1 ? '寰呭叆搴�' : '宸插叆搴�' }}
+                            </div>
+                          </div>
+                          <div class="card-header-right">
+                            <template v-if="item.states == 1">
+                              <el-button name="缂栬緫" site="form" type="success" size="mini" @click="handleEdit(item)"
+                              >缂栬緫</el-button
+                              >
+                              <el-button name="鍏ュ簱" site="form" type="primary" size="mini" @click="handleIncome(item)"
+                              >鍏ュ簱</el-button
+                              >
+                              <el-button name="鍒犻櫎" site="form" type="danger" size="mini" @click="del(item)"
+                              >鍒犻櫎</el-button
+                              >
+                            </template>
+                            <template v-if="item.states != 1">
+                              <el-button site="form" type="success" size="mini" @click="handleExport('procureExport',`閲囪喘鍏ュ簱鍗�-${item.businessFormCode}`,{id:item.id})"
+                              >瀵煎嚭鍏ュ簱鍗�</el-button
+                              >
+                            </template>
+                            <el-button name="鏌ョ湅璇︽儏" site="form" type="info" size="mini" @click="handleDetail(item)"
+                            >鏌ョ湅璇︽儏</el-button
+                            >
+                          </div>
+                        </div>
+                        <div class="one-hed">
+                          <div class="box"><span class="span-two">鏈烘瀯锛�</span>{{ item.agencyName }}</div>
+                          <div class="box"><span class="span-two">鎿嶄綔浜猴細</span>{{ item.buyerName }}</div>
+                          <div class="box">
+                            <span class="span-two">閲囪喘鏃堕棿锛�</span>{{ item.procureTime | formatTime }}
+                          </div>
+                          <div class="box">
+                            <span class="span-two">鍏ュ簱鏃堕棿锛�</span>{{ item.incomeTime | formatTime }}
+                          </div>
+                        </div>
+                        <div class="card-end">
+                          <div v-for="(just, index) in item.fromProcureTemplateInfoList" :key="index" class="item">
+                            <div class="name">{{ just.goodsTemplateName }}</div>
+                            <div class="value-box">
+                              <div class="value-box-item">
+                                <span class="label">鏁伴噺锛�</span>
+                                <span class="value">{{ just.count }}</span>
+                                <span class="unit">{{ just.unit }}</span>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </el-card>
+                  </el-col>
+                </el-row>
+                <el-empty v-else description="鏆傛棤鏁版嵁"></el-empty>
+              </div>
+            </div>
+
+            <el-pagination
+              :small="false"
+              :current-page="pageNum"
+              :page-sizes="[5, 10, 20, 50, 100, 200, 300, 400, 500]"
+              :page-size="pageSize"
+              layout="total, sizes, prev, pager, next, jumper"
+              :total="total"
+              @size-change="handleSizeChange"
+              @current-change="handleCurrentChange"
+            />
+          </el-col>
+        </el-row>
+      </el-card>
     </el-container>
+    <!--娣诲姞/缂栬緫寮圭獥-->
+    <edit
+      v-if="editSetting.show"
+      :setting="editSetting"
+      ref="editRef"
+      @close="editSetting.show = false"
+      @search="refreshData"
+    ></edit>
+    <detail
+      v-if="detailSetting.show"
+      :setting="detailSetting"
+      @close="detailSetting.show = false"
+      ref="detailRef"
+    ></detail>
     <my-import
       :import-setting="importSetting"
       :dialog-show="importSetting.dialogShow"
@@ -130,328 +117,197 @@
 </template>
 
 <script>
-import MyButton from "@/components/myButton/myButton";
+import {procureDel, procureIncome, procureList} from '@/api/stock/procure/purchaseOrder';
+import MyButton from '@/components/myButton/myButton';
 import SettingIplatform from '@/utils/settingIplatform';
-import myImport from '@/views/components/myImport'
+import myImport from '@/views/components/myImport';
+import edit from './edit';
+import detail from './detail';
 import {getBaseUrl} from '@/utils/base';
+import listPage from '@/views/mixins/listPage';
 
 export default {
-  name: "index",
-  components: {MyButton, myImport},
+  name: 'index',
+  mixins: [listPage],
+  components: { MyButton, myImport, edit, detail },
   data() {
     return {
-      
+      loading: false,
       adddialog: false,
-      formData:{
-        tableData:[
-          {
-            projectName:'555'
-          },
-          {
-            projectName:'444'
-          }
-        ],
-      },
+      list: [],
       // 鎼滅储妗�
       items: [
         {
           type: 'text',
-          dataIndex: 'name',
-          label: '鍑哄簱鍗曞彿',
+          dataIndex: 'businessFormCode',
+          label: '鍏ュ簱鍗曞彿',
           placeholder: '璇疯緭鍏�',
-          defaultValue: ''
-        },
-        {
-          type: 'text',
-          dataIndex: 'name',
-          label: '鐗╁搧鍚嶇О',
-          placeholder: '鍙ā绯婃悳绱�',
-          defaultValue: ''
-        },
-        {
-          type: 'text',
-          dataIndex: 'name',
-          label: '鍒涘缓浜�',
-          placeholder: '璇疯緭鍏�',
-          defaultValue: ''
-        },
-        {
-          type: 'date-picker',
-          dataIndex: 'val1',
-          label: '鍑哄簱鏃堕棿',
-          defaultValue: ''
-        },
-        {
-          type: 'date-picker',
-          dataIndex: 'val2',
-          label: '鑷�',
-          defaultValue: ''
+          defaultValue: '',
         },
         // {
-        //   type: 'select',
-        //   dataIndex: 'status',
-        //   label: '鐘舵��',
-        //   placeholder: '璇烽�夋嫨',
-        //   defaultValue: '1',
-        //   options: [
-        //     {
-        //       label: '鍚敤',
-        //       value: '1'
-        //     },
-        //     {
-        //       label: '绂佺敤',
-        //       value: '0'
-        //     }
-        //   ]
-        // }
-      ],
-      proData: [
+        //   type: 'text',
+        //   dataIndex: 'goodsTemplateName',
+        //   label: '鐗╁搧鍚嶇О',
+        //   placeholder: '鍙ā绯婃悳绱�',
+        //   defaultValue: '',
+        // },
         {
-          order_no:'55555',
-          customer_name:'666',
-          data:[
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'20浠�'
-            },
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-          ]
+          type: 'cascader',
+          dataIndex: 'agencyId',
+          label: '鏈烘瀯',
+          placeholder: '璇烽�夋嫨',
+          optionsConfig: { url: '/pc/fin/sys/tenant/select/tree_fin_tenant', props: null },
+          cascader: [{key:'goodsTemplateId',queryKey: 'agencyId'}],
+          defaultValue: '',
+          options: [],
         },
         {
-          order_no:'55555',
-          customer_name:'666',
-          data:[
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-          ]
+          type: 'select',
+          dataIndex: 'goodsTemplateId',
+          label: '鐗╁搧鍚嶇О',
+          placeholder: '璇疯緭鍏�',
+          defaultValue: '',
+          options: [],
+          optionsConfig: {
+            label: 'goodsName',
+            value: 'id',
+            url: SettingIplatform.apiBaseURL + '/pc/base/goods/template/query/goodsTemplate',
+          },
         },
         {
-          order_no:'55555',
-          customer_name:'666',
-          data:[
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'20浠�'
-            },
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-          ]
+          type: 'text',
+          dataIndex: 'createName',
+          label: '鍒涘缓浜�',
+          placeholder: '璇疯緭鍏�',
+          defaultValue: '',
         },
         {
-          order_no:'55555',
-          customer_name:'666',
-          data:[
+          type: 'select',
+          dataIndex: 'states',
+          label: '鐘舵��',
+          placeholder: '璇烽�夋嫨',
+          defaultValue: '',
+          options: [
             {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'20浠�'
+              label: '鍏ㄩ儴',
+              value: '',
             },
             {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
+              label: '寰呭叆搴�',
+              value: '1',
             },
-          ]
-          
+            {
+              label: '宸插叆搴�',
+              value: '2',
+            },
+          ],
         },
         {
-          order_no:'55555',
-          customer_name:'666',
-          data:[
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'20浠�'
-            },
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-          ]
-          
+          type: 'date-picker',
+          dataIndex: 'startTime',
+          label: '鍏ュ簱鏃堕棿',
+          defaultValue: '',
         },
         {
-          order_no:'55555',
-          customer_name:'666',
-          data:[
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'20浠�'
-            },
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-          ]
-          
+          type: 'date-picker',
+          dataIndex: 'endTime',
+          label: '鑷�',
+          defaultValue: '',
         },
-        {
-          order_no:'55555',
-          customer_name:'666',
-          data:[
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'20浠�'
-            },
-            {
-              order_no:'鐭冲嫆鑺鑹茬⒊绮�',
-              customer_name:'666'
-            },
-          ]
-          
-        }
       ],
       // 鏍戞暟鎹�
       treeDataList: [],
-      // 鎼滅储鏉′欢
-      filterFrom: {
-        tenantId: null,
-        userName: null,
-        userPhone: null,
-        status: 1
-      },
       // 瀵煎叆
       importSetting: {
-          dialogTitle: '瀵煎叆',
-          dialogShow: false,
-          fileSettings: {
-              data: {},
-              uploadUrl: getBaseUrl()+"/pc/fin/sys/tenant/import", // 涓婁紶鍦板潃
-              accept: '.xls', // 鏍煎紡
-              type: 'text', // 鍥炴樉褰㈠紡
-              loading: false // 瀵煎叆鏁堟灉
-          },
-          /* 妯℃澘涓嬭浇 */
-          templateSettings: {
-              templateName: '瀵煎叆妯℃澘.xls', // 鍚嶇О
-              templateUrl: SettingIplatform.apiBaseURL + '/pc/fin/sys/tenant/getImportTemplate' // 涓嬭浇鍦板潃
-          },
-          onSuccess: null
+        dialogTitle: '瀵煎叆',
+        dialogShow: false,
+        fileSettings: {
+          data: {},
+          uploadUrl: getBaseUrl() + '/pc/whForm/procure/import', // 涓婁紶鍦板潃
+          accept: '.xls', // 鏍煎紡
+          type: 'text', // 鍥炴樉褰㈠紡
+          loading: true, // 瀵煎叆鏁堟灉
+        },
+        /* 妯℃澘涓嬭浇 */
+        templateSettings: {
+          templateName: '瀵煎叆妯℃澘.xls', // 鍚嶇О
+          templateUrl: SettingIplatform.apiBaseURL + '/pc/fin/sys/tenant/getImportTemplate?type=procure', // 涓嬭浇鍦板潃
+        },
+        onSuccess: null,
       },
-      editSetting: {
-        title: '',
-        id: '',
-        orgId: '',
-        show: false,
-      },
-    }
+    };
   },
-  computed: {
-    clientHeight () {
-      return document.documentElement.clientHeight
-    },
-  },
-  created() {
+  created(){
+    this.fetchData()
   },
   methods: {
-    handleSizeChange(){},
-    handleCurrentChange(){},
+    fetchData() {
+      this.loading = true;
+      procureList({
+        pageNum: this.pageNum,
+        pageSize: this.pageSize,
+        ...this.filterFrom,
+      }).then((res) => {
+        this.list = res.datas;
+        this.total = res.totalRows;
+        this.loading = false;
+      });
+    },
+
     //瀵煎叆
     importOrg() {
-        this.importSetting.dialogShow = true
-        this.importSetting.onSuccess = (response, callBack) => {
-            if (response.code===1){
-              this.$message.success(response.msg)
-              this.search(1)
-            }else{
-              this.$message.warning(response.msg)
-            }
-            callBack()
+      this.importSetting.dialogShow = true;
+      this.importSetting.onSuccess = (response, callBack) => {
+        if (response.code === 1) {
+          this.$message.success(response.msg);
+          this.search(1);
+        } else {
+          this.$message.warning(response.msg);
         }
+        callBack();
+      };
     },
-   
-    addtable() {
-      this.adddialog = true
+    // 鍏ュ簱
+    handleIncome(row) {
+      this.$confirm(`鎮ㄧ‘瀹� 鍗曞彿锛�${row.businessFormCode}  鍏ュ簱鍚�?`, '閲囪喘鍏ュ簱', {
+        beforeClose: (action, instance, done) => {
+          if (action == 'confirm') {
+            instance.confirmButtonLoading = true;
+            instance.confirmButtonText = '鎵ц涓�...';
+            procureIncome({ id: row.id })
+              .then((res) => {
+                this.$message.success('鍏ュ簱鎴愬姛锛�');
+                done();
+                instance.confirmButtonLoading = false;
+                this.search();
+              })
+              .catch(() => {
+                done();
+              });
+          } else {
+            done();
+          }
+        },
+      });
     },
-    // 鏌ヨtable鍒楄〃
-    search(pageNum) {
-      if (pageNum != undefined) {
-        // this.$refs.myTable.search(pageNum)
-      } else {
-        // this.$refs.myTable.search()
-      }
+    del(row) {
+      this.$modal.confirm('鏄惁纭鍒犻櫎鍏ュ簱鍗曞彿涓�"' + row.businessFormCode + '"鐨勬暟鎹悧锛�').then(() => {
+        procureDel({ id: row.id })
+          .then((res) => {
+            this.$message.success('鍒犻櫎鎴愬姛锛�');
+            this.search();
+          })
+          .catch(() => {});
+      });
     },
-    fifterForm(params) {
-      console.log(params,'555');
-      this.filterFrom = Object.assign(this.filterFrom, params)
-      this.search(1)
+    openImport(){
+      this.importOrg();
     }
-  }
-}
+
+  },
+};
 </script>
 
-<style scoped>
-.card {
-    display: flex;
-    flex-wrap: wrap;
-    margin: 0px !important;
-    .cm-item {
-        width: 100%;
-    }
-    .cm-item /deep/ .el-card__body {
-        padding: 10px;
-    }
-}
-.card-data{
-  position: relative;
-  margin-top: 8px;
-  .card-container{
-    display: inline-block; 
-    width: 70%;
-    .hed-one{
-      color: #2298EE;
-      font-size: 18px;
-    }
-    .one-hed{
-      margin-top: 15px;
-      .box{
-        display: inline-block;  
-        margin-right: 20px;  
-      }
-    }
-    .span-two{
-      color: #83919e;
-      font-size: 14px;
-    }
-    .card-end{
-      font-size: 14px;
-      color: #3d3d3d;
-      margin-top: 15px;
-      display: flex;  
-      flex-wrap: wrap; 
-      .two-end{
-        width: calc(33.33% - 20px); 
-        margin-bottom: 15px; 
-      }
-    }
-    
-  }
-  .card-but{
-    position: absolute;
-    right: 20px;
-    top: 40%;
-  }
-  
-}
-
+<style scoped lang="scss">
+@import url(../../index.scss);
 </style>

--
Gitblit v1.9.1