采购价页面渲染

src/router/index.js

@@ -10,11 +10,13 @@ const whiteSlideList = ['/', '/ui', '/siteList']; //侧边导航白名单
 const whiteHeaderList = ['/', '/ui', '/register', '/configureServicePrices', '/siteList','/siteSetting/siteBaseSetting','/siteSetting/sitePersonalization'
   ,'/siteSetting/siteH5','/siteSetting/siteSem','/pageTemplete','/demo',
   '/super/ranking/yearProfit', '/super/ranking/monthProfit', '/super/ranking/checkProfit', '/super/ranking/checkOrdernum',
-  '/super/ranking/checkRefund', '/super/ranking/agentProfit', '/super/ranking/agentRecharge', '/super/ranking/agentNew'
+  '/super/ranking/checkRefund', '/super/ranking/agentProfit', '/super/ranking/agentRecharge', '/super/ranking/agentNew',
+  '/super/ranking/purchase','/super/ranking/stagePurchase'
 ]; //头部导航白名单
 const whiteFooterList = ['/', '/ui', '/configureServicePrices',
   '/super/ranking/yearProfit', '/super/ranking/monthProfit', '/super/ranking/checkProfit', '/super/ranking/checkOrdernum',
-  '/super/ranking/checkRefund', '/super/ranking/agentProfit', '/super/ranking/agentRecharge', '/super/ranking/agentNew'
+  '/super/ranking/checkRefund', '/super/ranking/agentProfit', '/super/ranking/agentRecharge', '/super/ranking/agentNew',
+  '/super/ranking/purchase','/super/ranking/stagePurchase'
 ]; //底部白名单
 const routes = [{
     path: '/',

src/views/super/Ranking/Purchase.vue

@@ -5,7 +5,8 @@
             <el-button type="primary" @click="openDialog">新增</el-button>
 
             <GuipDialog :dialogVisible="dialogVisible" :title="dialogTitle" :show-close-button="false"
-                        :show-cancel-button="showCancelButton" @confirm="handleConfirm" @cancel="handleCancel" @close="handleClose"
+                        :show-cancel-button="showCancelButton" @confirm="handleConfirm" @cancel="handleCancel"
+                        @close="handleClose"
                         @dialogVisibleChange="dialogVisibleChange">
                 <el-form :model="form" class="el-row demo-ruleForm" ref="formRef">
                     <el-form-item label="检测类型" prop="type">
@@ -28,8 +29,10 @@
                             </div>
                         </el-form-item>
                         <el-form-item label="起止日期" prop="type" label-width="73px">
-                            <el-date-picker v-model="form.date" type="daterange" range-separator="至" start-placeholder="开始日期"
+                            <el-date-picker v-model="form.date" type="daterange" range-separator="至"
-                                            end-placeholder="结束日期" value-format="yyyy-MM-dd HH:mm:ss" style="width: 100%;" :default-value="form.date">
+                                            start-placeholder="开始日期"
+                                            end-placeholder="结束日期" value-format="yyyy-MM-dd HH:mm:ss"
+                                            style="width: 100%;" :default-value="form.date">
                             </el-date-picker>
                         </el-form-item>
                     </template>
@@ -40,7 +43,12 @@
             <el-form>
                 <el-table :data="tableData" style="width: 100%">
                     <template v-if="type == 'purchase'">
-                        <el-table-column label="检测类型">
+                        <el-table-column prop="type">
+                            <template slot="header">
+                                <GuipSelect class="custom-select" v-model="chktype" :options="type2nameOptions"
+                                            defaultValue="检测类型" @change="changeSelectType"/>
+                            </template>
+
                             <template slot-scope="scope">
                                 {{ type2name[scope.row.type] }}
                             </template>
@@ -60,7 +68,12 @@
                     </template>
 
                     <template v-else>
-                        <el-table-column label="检测类型">
+                        <el-table-column prop="type">
+                            <template slot="header">
+                                <GuipSelect class="custom-select" v-model="chktype" :options="type2nameOptions"
+                                            defaultValue="检测类型" @change="changeSelectType"/>
+                            </template>
+
                             <template slot-scope="scope">
                                 {{ type2name[scope.row.type] }}
                             </template>
@@ -132,6 +145,7 @@ export default {
     },
     data() {
         return {
+            id: 0,
             chktype: 0,
             currentPage: 1,    //当前页
             pageSize: 5,   //每页的容量
@@ -188,6 +202,9 @@ export default {
                 this.getStagePurchase()
             }
         },
+        changeSelectType() {
+            this.init()
+        },
         getPurchase() {
             const that = this
             that.tableData = []
@@ -317,6 +334,7 @@ export default {
             return `${Y}-${M}-${D}`;
         },
         editPurchase(row) {
+            this.form.id = row.id
             this.form.type = row.type
             this.form.typename = this.type2name[row.type]
             this.form.unit_price = row.unit_price
@@ -324,6 +342,7 @@ export default {
             this.dialogVisible = true;
         },
         editStagePurchase(row) {
+            this.form.id = row.id
             this.form.type = row.type
             this.form.typename = this.type2name[row.type]
             this.form.unit_price = row.unit_price
@@ -334,4 +353,7 @@ export default {
 }
 </script>
 <style scoped lang="scss">
+.custom-select {
+  width: 200px;
+}
 </style>