添加table可单选属性

gtohad · Dec 7, 2019 · 8f3f136 · 8f3f136
1 parent 7b6bf49
commit 8f3f136
Show file tree

Hide file tree

Showing 5 changed files with 33 additions and 12 deletions.
diff --git a/Vol.Vue/src/components/basic/ViewGrid.vue b/Vol.Vue/src/components/basic/ViewGrid.vue
@@ -191,6 +191,7 @@
                 :columns="detailOptions.columns"
                 :pagination="detailOptions.pagination"
                 :height="detailOptions.height"
+                :single="detailOptions.single"
                 :pagination-hide="false"
               ></vol-table>
             </div>
@@ -222,6 +223,7 @@
       <div class="grid-container">
         <vol-table
           ref="table"
+          :single="single"
           @loadBefore="loadTableBefore"
           @loadAfter="loadTableAfter"
           :tableData="[]"
@@ -310,6 +312,7 @@ var vueParam = {
   data() {
     return {
       _inited: false,
+      single:false,//表是否单选
       const: _const, //增删改查导入导出等对应的action
       boxInit: false, //新建或编辑的弹出框初化状态，默认不做初始化，点击新建或编辑才初始化弹出框
       searchBoxShow: false, //高级查询(界面查询后的下拉框点击触发)
@@ -345,6 +348,7 @@ var vueParam = {
         data: [], //数据源
         columns: [], //从表列信息
         edit: true, //明细是否可以编辑
+        single:false,//明细表是否单选
         delKeys: [], //当编辑时删除当前明细的行主键值
         url: "", //从表加载数据的url
         pagination: { total: 0, size: 100, sortName: "" }, //从表分页配置数据

diff --git a/Vol.Vue/src/components/basic/VolTable.vue b/Vol.Vue/src/components/basic/VolTable.vue
@@ -4,6 +4,7 @@
       <div class="mask" v-show="loading"></div>
       <div class="message" v-show="loading">加载中.....</div>
       <el-table
+        @selection-change="selectionChange"
         @row-click="beginEdit"
         @cell-mouse-leave="endEdit"
         ref="table"
@@ -20,6 +21,11 @@
         <!-- @row-click="rowClick" -->
         <!-- <el-table-column type="index"  :index="initIndex"></el-table-column> -->
         <el-table-column type="selection" width="55"></el-table-column>
+        <!-- <el-table-column label="选择" width="50" align="center">
+          <template scope="scope">
+            <el-radio class="radio" v-model="radio" :label="scope.$index">&nbsp;</el-radio>
+          </template>
+        </el-table-column>-->
         <el-table-column
           v-for="(column,cindex) in filterColumns()"
           :key="cindex"
@@ -210,6 +216,10 @@ export default {
       //是否自动从后台加载数据源,如【审核状态】字段是的值是数字，但要显示对应的文字，1=审核中，2=审核通过
       type: Boolean,
       default: false
+    },
+    single: {
+      type: Boolean, //是否单选
+      default: false
     }
   },
   data() {
@@ -505,7 +515,7 @@ export default {
         let option = this.columns.find(x => {
           return x.field == column.property;
         });
-        if (!option.edit) {
+        if (!option || !option.edit) {
           return;
         }
         if (
@@ -668,8 +678,11 @@ export default {
       this.paginations.rows = 30;
       this.paginations.page = 1;
     },
-    handleSelectionChange(row) {
-      this.$refs.table.toggleRowSelection(row);
+    selectionChange(selection) {
+      // console.log(selection);
+      if (this.single && selection.length > 1) {
+        this.$refs.table.toggleRowSelection(selection[0]);
+      }
     },
     getColor(row, column) {
       let val = row[column.field];

diff --git a/Vol.Vue/src/extension/order/SellOrder.js b/Vol.Vue/src/extension/order/SellOrder.js
@@ -99,9 +99,13 @@ let extension = {
             })
         },
         mounted() {
-            this.$Notice.success({ title: '执行mounted方法' });
+
+           // this.$Notice.success({ title: '执行mounted方法' });
         },
         onInit() {
+            //表格设置为单选
+            // this.single=true;
+            // this.detailOptions.single=true;
             //设置编辑表单数量字段的最小与最大值
             this.editFormOptions.forEach(x => {
                 x.forEach(item => {

diff --git a/Vol.Vue/src/views/formsMulti/multil1Extension/table1.vue b/Vol.Vue/src/views/formsMulti/multil1Extension/table1.vue
@@ -51,10 +51,10 @@ export default {
     getRows() {
       let rows = this.$refs.table.getSelected();
       if (rows.length == 0) {
-        return this.$message.error("请先选中行1");
+        return this.$Message.error("请先选中行1");
       }
-      this.text = "当前选中的行数据：" + JSON.stringify(rows);
-      this.viewModel = true;
+      this.$Message.info("当前选中的行数据：" + JSON.stringify(rows));
+     // this.viewModel = true;
     }
   },
   created() {},

diff --git a/Vol.Vue/src/views/upload/formUpload.vue b/Vol.Vue/src/views/upload/formUpload.vue
@@ -183,7 +183,7 @@ export default {
             field: "file1",
             required: true,
             maxSize: 1, //最大1M文件
-            url: "http://127.0.0.1:9991/api/App_Appointment/Upload",
+            url: "/api/App_Appointment/Upload",
             type: "file"
           },
           {
@@ -192,7 +192,7 @@ export default {
             maxSize: 0.5, //最大0.5M文件
             multiple: true, //启用多文件
             maxFile: 2, //最多两个文件
-            url: "http://127.0.0.1:9991/api/App_Appointment/Upload",
+            url: "/api/App_Appointment/Upload",
             type: "excel"
           }
         ],
@@ -203,7 +203,7 @@ export default {
             field: "file3",
             maxSize: 1, //最大1M文件
             colSize: 12,
-            url: "http://127.0.0.1:9991/api/App_Appointment/Upload",
+            url: "/api/App_Appointment/Upload",
             type: "img"
           }
         ],
@@ -216,7 +216,7 @@ export default {
             multiple: true, //启用多文件
             maxFile: 3, //最多3个文件
             downLoad: true,
-            url: "http://127.0.0.1:9991/api/App_Appointment/Upload",
+            url: "/api/App_Appointment/Upload",
             type: "file",
             fileClick(index, file, files) {
               this.$Message.error(file.name);
@@ -230,7 +230,7 @@ export default {
             maxSize: 1, //最大1M文件
             multiple: true, //启用多文件
             maxFile: 3, //最多两个文件
-            url: "http://127.0.0.1:9991/api/App_Appointment/Upload",
+            url: "/api/App_Appointment/Upload",
             type: "img"
           }
         ]