zoukankan      html  css  js  c++  java
  • 全是没见过的

    <template>
      <!-- 我的工单 -->
      <div>
        <!-- 顶部的按钮 -->
        <el-button type="primary" @click="goCreat()" style="margin-bottom:20px">创建工单</el-button>
        <!-- 查询表单 -->
        <el-form :inline="true" :model="searchForm">
          <el-form-item label="患者">
            <el-input v-model="searchForm.usernameplaceholder="患者姓名"></el-input>
          </el-form-item>
          <el-form-item label="工单类型">
            <el-select v-model="searchForm.typeplaceholder="选择工单类型">
              <el-option v-for="item in paifaType" :key="item.key" :label="item.name" :value="item.key"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="工单状态">
            <el-select v-model="searchForm.statusplaceholder="选择工单状态">
              <el-option
                v-for="item in paifaType1"
                :key="item.key"
                :label="item.name"
                :value="item.key"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-row>
            <el-form-item label="工单号">
              <el-input v-model="searchForm.uuidplaceholder="工单号"></el-input>
            </el-form-item>
            <!-- <div class="dis_flex">
              <div style="line-height:20px;">工单日期:</div>
              <el-form>
                <el-form-item>
                  <el-date-picker
                    v-model="searchForm.time"
                    type="datetimerange"
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    align="right"
                  ></el-date-picker>
                </el-form-item>
              </el-form>
            </div>-->
            <el-form-item style="float:right;margin-right:24%;">
              <el-button type="primary" @click="search">查询</el-button>
            </el-form-item>
          </el-row>
        </el-form>
        <!-- table表单 -->
        <el-table :data="tableDataborder style=" 100%;margin-top:50px;">
          <el-table-column fixed prop="base.uuid" label="订单号" width="130" align="center"></el-table-column>
          <el-table-column fixed prop="base.createTime" label="申请日期" width="130" align="center"></el-table-column>
          <!-- <el-table-column fixed prop="base.type" label="服务类型" width="110" align="center"></el-table-column> -->

          <el-table-column align="center" label="服务类型" width="110">
            <template slot-scope="scope">{{fuwuType(scope.row).text}}</template>
          </el-table-column>
          <el-table-column prop="base.username" label="患者" width="100" align="center"></el-table-column>
          <el-table-column label="性别" width="60" align="center">
            <template slot-scope="scope">{{sexType(scope.row).text}}</template>
          </el-table-column>

          <el-table-column prop="user.age" label="年龄" width="90" align="center"></el-table-column>
          <el-table-column prop="base.regPhone" label="联系电话" width="110" align="center"></el-table-column>
          <el-table-column label="订单状态" width="100" align="center">
            <template slot-scope="scope">{{orderStatus(scope.row).text}}</template>
          </el-table-column>
          <el-table-column fixed="right" label="操作" align="center">
            <template slot-scope="scope">
              <el-button @click="handleClick(scope.row)" type="text" size="small">详情 &nbsp;&nbsp;</el-button>
              <el-button
                type="text"
                size="small"
                :disabled="scope.row.base.status == 100"
                @click="gochangeOrder(scope.row)"
              >转单 &nbsp;&nbsp;</el-button>
              <el-button
                type="text"
                size="small"
                :disabled="scope.row.base.status == 100"
              >关闭 &nbsp;&nbsp;</el-button>
              <el-button
                type="text"
                size="small"
                :disabled="scope.row.base.status == 100"
                @click="goManage()"
              >去处理</el-button>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页 -->
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage"
          :page-size="pageParams.size"
          layout="total, prev, pager, next"
          :total="pageParams.totalCount"
        ></el-pagination>
      </div>
    </template>
    <script>
    import queryString from "querystring";
    import page from "data/page";
    export default {
      name: "orderOption",
      mixins: [page],
      data() {
        return {
          tableData: [], //table数据
          currentPage: 1//当前页数
          paifaType: [],
          paifaType1: [
            { key: "0"name: "初始化,提交,冻结" },
            { key: "10"name: "已经开始、进行中" },
            { key: "100"name: "成功" },
            { key: "110"name: "待评价" },
            { key: "200"name: "失败" },
            { key: "300"name: "取消" }
          ],
          searchForm: {
            username: "",
            type: "",
            status: "",
            uuid: ""
          }
        };
      },

      mounted() {
        //获取table数据
        this.search();
      },
      methods: {
        // 查询
        search() {
          this.searchForm.page = this.currentPage - 1;
          this.searchForm.size = 20;
          this.axios
            .post("/work/list/Page"this.searchForm)
            .then(res => {
              if (res.data.code == 200) {
                if (!res.datareturn;
                this.tableData = res.data.data.list;

                console.log("this.tableData"this.tableData);

                this.setPage(res.data.data);
              }
            })
            .catch(err => {
              this.$message(err.message);
            });
        },
        // 服务类型下拉框
        fuwuType(item) {
          let type = item.base.type;
          console.log("type"type);
          let res = { num: typetext: "" };
          switch (type) {
            case 580:
              res.text = "急速医生";
              break;
            case 660:
              res.text = "工单";
              break;
          }
          return res;
        },
        // 性别
        sexType(item) {
          let sex = item.base.sex;
          console.log("sex"sex);
          let res = { num: sextext: "" };
          switch (sex) {
            case 0:
              res.text = "男";
              break;
            case 1:
              res.text = "女";
              break;
          }
          return res;
        },
        // 订单状态
        orderStatus(item) {
          let status = item.base.status;
          console.log("status"status);
          let res = { num: statustext: "" };
          switch (status) {
            case 0:
              res.text = "初始化,提交,冻结";
              break;
            case 10:
              res.text = "已经开始、进行中";
              break;
            case 100:
              res.text = "成功";
              break;
            case 110:
              res.text = "待评价";
              break;
            case 200:
              res.text = "失败";
              break;
            case 300:
              res.text = "取消";
              break;
          }
          return res;
        },
        // 去转单 传一个uuid
        gochangeOrder(item) {
          console.log("我会我的工单item",item);
          this.$router.push({
            name: "changeorder",
            params: {
              id: item.base.uuid
            }
          });
        },
        //去创建页面
        goCreat() {
          this.$router.push({
            name: "creat"
          });
        }
      }
    };
    </script>
    <style lang="less">
    .el-row {
      margin-bottom20px;
      &:last-child {
        margin-bottom0;
      }
    }
    .dis_flex {
      displayflex;
      font-displayrow;
      align-itemscenter;
    }
    </style>
  • 相关阅读:
    单词统计-续
    “帮你APP”团队冲刺10
    软件工程周总结15
    梦断代码阅读笔记03
    个人课程总结
    梦断代码阅读笔记02
    梦断代码阅读笔记01
    软件工程周总结14
    计算最长英语单词链
    软件工程周总结13
  • 原文地址:https://www.cnblogs.com/ylblogs/p/11913007.html
Copyright © 2011-2022 走看看