页面修改

src/components/WebSet/WebSiteCustomer.vue

+<style>
+  .WebSiteCustomer .el-button.is-circle {
+    padding: 6px;
+  }
+
+  .WebSiteCustomer .preview {
+    color: #409eff;
+    text-decoration: underline
+  }
+
+</style>
 <template>
-  <!--自訂頁面(自订页面)-->
+  <!--自定义页面-->
   <div class="WebSiteCustomer">
-    自订页面
+    <div class="query-box">
+      <ul>
+        <li>
+          <label>名称</label>
+          <el-input v-model="msg.PageName" :placeholder="$t('system.ph_in')" @keyup.native.enter="getData" class="w210">
+          </el-input>
+        </li>
+        <li>
+          <input type="button" class="hollowFixedBtn" :value="$t('pub.searchBtn')"
+            @click="resetPageIndex(),getData()" />
+          <input type="button" class="normalBtn" @click="outerVisible=true,clearMsg()" value="新增頁面" />
+        </li>
+      </ul>
+    </div>
+    <div>
+      <el-table :data="dataList" style="width: 100%" v-loading="loading"
+        :default-sort="{prop: 'date', order: 'descending'}">
+        <el-table-column prop="PageName" label="頁面名稱" sortable>
+        </el-table-column>
+        <el-table-column prop="CreateByName" label="新增人員" sortable>
+        </el-table-column>
+        <el-table-column prop="UpdateTimeStr" label="最後更新時間" sortable>
+        </el-table-column>
+        <el-table-column prop="CreateTimeStr" label="新增時間" sortable>
+        </el-table-column>
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-tooltip class="item" effect="dark" :content="$t('system.table_edit')" placement="top-start">
+              <el-button type="primary" icon="el-icon-edit" circle @click="outerVisible = true,updateData(scope.row)">
+              </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="deleteData(scope.row)"></el-button>
+            </el-tooltip>
+          </template>
+        </el-table-column>
+      </el-table>
+      <el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage"
+        layout="total,prev, pager, next, jumper" :page-size='msg.pageSize' :total=total>
+      </el-pagination>
+    </div>
+
+    <el-dialog title="新增修改页面" :visible.sync="outerVisible" center width="400px">
+      <el-form :model="addMsg" ref="addMsg" label-width="120px">
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="页面名称">
+              <el-input type="text" v-model="addMsg.PageName" maxlength="50" placeholder="页面名称">
+              </el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </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">{{$t('pub.cancelBtn')}}</button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script>
   export default {
     data() {
       return {
-        obj: {}
-      };
+        loading: false,
+        msg: {
+          PageName: '', //名称
+          pageSize: 15,
+          pageIndex: 1,
+        },
+        total: 0,
+        currentPage: 1,
+        //弹窗
+        outerVisible: false,
+        dataList: [],
+        addMsg: {
+          Id: 0, //编号
+          IsOpen: 0, //状态(0-关闭，1-开启)
+          PageName: '', //档案名称
+          Url: '', //档案路劲
+        },
+      }
     },
     mounted() {
       this.getData();
@@ -17,8 +101,95 @@
     methods: {
       //获取配置
       getData() {
+        //获取现有线路列表
+        this.loading = true;
+        this.apipost(
+          "ws_get_GetPagePageList",
+          this.msg,
+          res => {
+            this.loading = false;
+            if (res.data.resultCode == 1) {
+              this.dataList = res.data.data.pageData;
+              this.total = res.data.data.count
+            } else {
+              this.loading = false;
+            }
+          },
+          err => {}
+        );
+      },
+      handleCurrentChange(val) {
+        //翻页功能按钮
+        this.msg.pageIndex = val;
+        this.getData();
+      },
+      resetPageIndex() {
+        //查询初始化页码
+        this.msg.pageIndex = 1;
+        this.currentPage = 1;
+      },
+      //修改
+      updateData(item) {
+        this.apipost(
+          "ws_post_GetPage", {
+            Id: item.Id,
+          },
+          res => {
+            if (res.data.resultCode == 1) {
+              var tempData = res.data.data;
+              this.addMsg.Id = tempData.Id;
+              this.addMsg.PageName = tempData.PageName;
+
+            } else {
+              this.Error(res.data.message);
+            }
+          },
+          err => {}
+        );
+      },
+      //删除
+      deleteData(item) {
+        var that = this;
+        that.Confirm("是否删除?", function () {
+          that.apipost(
+            "ws_post_RemovePage", {
+              Id: item.Id
+            },
+            res => {
+              if (res.data.resultCode == 1) {
+                that.Success(res.data.message);
+                that.getData();
+              } else {
+                that.Error(res.data.message);
+              }
+            },
+            null
+          );
+        });
+      },
+      //清空数据
+      clearMsg() {
+        this.addMsg.Id = 0;
+        this.addMsg.PageName = "";
+      },
+      //新增、修改广告
+      submitForm(addMsg) {
+        this.apipost(
+          "ws_post_SetPage", this.addMsg,
+          res => {
+            if (res.data.resultCode == 1) {
+              this.getData();
+              this.clearMsg();
+              this.Success(res.data.message);
+              this.outerVisible = false;
+            } else {
+              this.Error(res.data.message);
+            }
+          },
+          err => {}
+        );
+      },
 
-      }
     }
   }