1

src/components/scenicSpot/TicketClassification.vue

+<style>
+.foodClassification .query_box {
+  font-size: 12px;
+  padding: 29px 0;
+  padding-right: 30px;
+  display: flex;
+  justify-content: space-between;
+}
+.foodClassification .query_box label {
+  display: inline-block;
+  margin-right: 25px;
+  width: 80px;
+  text-align: right;
+}
+.foodClassification .addCompany {
+  width: 440px;
+  max-height: 600px;
+}
+.foodClassification .addCompany .el-dialog__body {
+  padding-bottom: 0;
+}
+.foodClassification .el-switch.is-checked .el-switch__core {
+  border-color: #4bca81;
+  background-color: #4bca81;
+}
+.noData {
+  text-align: center;
+  padding: 20px;
+}
+.foodClassification .city_box {
+  width: 100%;
+  display: flex;
+  justify-content: center;
+}
+.foodClassification .city_box .el-input {
+  width: 88%;
+}
+.foodClassification .city_box .el-input input {
+  width: 100%;
+}
+.foodClassification .query_box li label {
+  display: inline-block;
+  min-width: 80px;
+  text-align: right;
+  font-style: normal;
+  margin: 0 20px 0 0;
+}
+</style>
+<template>
+  <div class="flexOne foodClassification">
+       <div class="query-box">
+            <ul>
+                <li>
+                    <span>
+                        <em>名称</em>
+                        <el-input v-model="msg.Name" :placeholder="$t('system.ph_in')" @keyup.enter.native="getList" class="w210"></el-input> 
+                    </span>
+                </li>
+                <li>
+                    <input type="button" class="hollowFixedBtn" value="查询" @click="resetPageIndex(),getList()" />
+                    <input type="button" class="normalBtn" value="新增" @click="outerVisible = true,dialogTitle='新增'" />
+                </li>
+            </ul>
+       </div>
+       <table class="singeRowTable" border="0" cellspacing="0" cellpadding="0" v-loading="loading">
+			<tr>
+				<th width="">编号</th>
+				<th width="">名称</th>
+				<th>父级名称</th>
+        <th>排序</th>
+				<th>操作人</th>
+
+				<th width="200">{{$t('system.table_operation')}}</th>
+			</tr>
+			<tr v-for="(item,index) in DataList" :key="index">
+				<td>{{item.ID}}</td>
+				<td>{{item.Name}}</td>
+        <td>{{item.ParentName?item.ParentName:'无'}}</td>
+        <td>{{item.Sort}}</td>
+        <td>{{item.UpdateName}}</td>
+				<td style="position: relative;">    
+          <el-row>
+                <el-tooltip class="item" effect="dark" :content="$t('system.table_edit')" placement="top-start">
+                        <el-button type="primary" icon="el-icon-edit" circle @click="updateData(item)"></el-button>
+                        </el-tooltip>
+                        <el-tooltip class="item" effect="dark" :content="$t('system.table_delete')" placement="top-start">
+						    <el-button type="danger" icon="el-icon-delete" circle @click="deleteFoodClass(item.ID)"></el-button>
+						</el-tooltip>	                        					
+					</el-row>
+				</td>
+			</tr>
+		</table>
+        <div class="noData" v-show="noData">
+            {{$t('system.content_noData')}}
+        </div>
+        <el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage" layout="total,prev, pager, next, jumper" :page-size=msg.pageSize :total=total>
+		</el-pagination>
+      <el-dialog custom-class='addCompany' :title="dialogTitle" :visible.sync="outerVisible" center :before-close="closeChangeMachie">			
+			<el-form :model="addMsg" :rules="rules" ref="addMsg" label-width="100px" >
+                <el-form-item label="分类名称" prop="Name">
+                   <el-input type="text" v-model="addMsg.Name" placeholder="请填写分类名称" class="w210"></el-input>
+                </el-form-item>
+                <el-form-item label="父级" prop="ParentID">
+                    <el-select v-model="addMsg.ParentID" filterable placeholder="请选择父级" class="w210">
+                        <el-option label="不限" :value="0"></el-option>
+                        <el-option v-for='item in ParentList'
+                                :key="item.ID" 
+                                :label="item.Name"
+                                :value="item.ID">
+                        </el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="排序" prop="Sort">
+                   <el-input type="number" v-model.number="addMsg.Sort" class="w210" placeholder="请填写排序"></el-input>
+                </el-form-item>
+			</el-form>
+			<div slot="footer" class="dialog-footer">
+				<button class="normalBtn" type="primary" @click="submitForm('addMsg')">{{$t('pub.saveBtn')}}</button> &nbsp;
+				<button class="hollowFixedBtn" @click="outerVisible = false,resetForm('addMsg')">{{$t('pub.cancelBtn')}}</button>
+			</div>
+		</el-dialog>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+      ParentList: [],
+      msg: {
+        pageIndex: 1,
+        pageSize: 15,
+        Name: "",
+        Status: "0",
+        ClassType:1
+      },
+      addMsg: {
+        Name:"",
+        ParentID:0,
+        Sort:0,
+        ID:0,
+        ClassType:1
+      },
+      DataList: [],
+      loading: true,
+      total: 0,
+      currentPage: 1,
+      outerVisible: false,
+      noData: false,
+      dialogTitle: "",
+      rules: {
+        Name: [
+          { required: true, message: "请填写分类名称", trigger: "change" }
+        ],
+        ParentID: [
+          { required: true, message: "请选择父级", trigger: "change" }
+        ],
+        Sort: [
+          { required: true, message: "请填写排序", trigger: "change" }
+        ],
+      }
+    };
+  },
+  methods: {
+    getList() {
+      //获取数据分页
+      this.loading = true;
+      this.apipost(
+        "foodtype_post_GetList",
+        this.msg,
+        res => {
+          this.loading = false;
+          if (res.data.resultCode == 1) {
+            this.total = res.data.data.count;
+            this.DataList = res.data.data.pageData;
+            this.noData = !this.total > 0;
+          } else {
+            this.Error(res.data.message);
+          }
+        },
+        err => {}
+      );
+    },
+    //获取父级下拉列表
+    getParentList() {
+      let msg = {
+        ParentID:this.addMsg.ParentID,
+        ClassType:1
+      };
+      this.apipost(
+        "foodtype_post_GetDropDownFoodType",
+        msg,
+        res => {
+          this.ParentList = res.data.data;
+        },
+        err => {}
+      );
+    },
+
+    updateData(row) {
+      if(row){
+        this.addMsg={
+          Name:row.Name,
+          ParentID:row.ParentID,
+          Sort:row.Sort,
+          ID:row.ID
+        }
+      }
+      this.outerVisible = true
+      this.dialogTitle='修改'
+    },
+    //新增/修改
+    saveSet(){
+      this.apipost(
+        "foodtype_post_Set",
+        this.addMsg,
+        res => {
+          if (res.data.resultCode == 1) {
+            this.outerVisible = false;
+            this.getList();
+            this.Success(res.data.message);
+          }else{
+            this.Error(res.data.message)
+          }
+        },
+        err => {}
+      );
+    },
+    //删除
+    deleteFoodClass(ID) {
+      var that = this;
+      this.Confirm("是否删除?", function() {
+        var msg = {
+          ID: ID
+        };
+        that.apipost(
+          "foodtype_post_Remove",
+          msg,
+          res => {
+            if (res.data.resultCode == 1) {
+              that.Success("删除成功");
+              that.getList();
+            }else{
+              that.Error(res.data.message)
+            }
+          },
+          null
+        );
+      });
+    },
+    handleCurrentChange(val) {
+      //翻页功能按钮
+      this.msg.pageIndex = val;
+      this.getList();
+    },
+    submitForm(addMsg) {
+      //提交创建、修改表单
+      let that = this;
+      that.$refs[addMsg].validate(valid => {
+        if (valid) {
+          that.saveSet();
+        } else {
+          return false;
+        }
+      });
+    },
+    initAddMsg() {
+      //初始化查询数据
+      let newMsg = {
+        Name:"",
+        ParentID:0,
+        Sort:0,
+        ID:0,
+      };
+      this.addMsg = newMsg;
+    },
+    resetPageIndex() {
+      //查询初始化页码
+      this.msg.pageIndex = 1;
+      this.currentPage = 1;
+    },
+    closeChangeMachie(done) {
+      done();
+      this.resetForm("addMsg");
+      this.getParentList();
+    },
+    resetForm(formName) {
+      this.initAddMsg();
+      this.$refs[formName].resetFields();
+    }
+  },
+  mounted() {
+    this.getList();
+    this.getParentList();
+  }
+};
+</script>