<template>
    <div>
      <div class="app-container">
        <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
          <el-form-item label="服务编号" prop="serverId">
            <el-input
              v-model="queryParams.orderIndex"
              placeholder="请输入服务编号"
              clearable
              size="small"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="服务主题" prop="serverId">
          <el-input
            v-model="queryParams.gname"
            placeholder="请输入服务主题"
            clearable
            size="small"
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>

          <el-form-item label="服务类型" prop="categoryName">
            <el-cascader
              v-model="queryParams.categoryName"
              :options="serverOptions"
              :props="{ value: 'categoryName',label: 'categoryName'}"

            ></el-cascader>
          </el-form-item>


          <el-form-item label="服务人员手机号" prop="serverId">
            <el-input
              v-model="queryParams.serverPhone"
              placeholder="请输入服务人员手机号"
              clearable
              size="small"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="服务人员姓名" prop="serverId">
            <el-input
              v-model="queryParams.serverName"
              placeholder="请输入服务人员姓名"
              clearable
              size="small"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="顾客手机号" prop="serverId">
            <el-input
              v-model="queryParams.memberPhone"
              placeholder="请输入顾客手机号"
              clearable
              size="small"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="是否追加服务" prop="serverId">
            <el-select v-model="queryParams.addCount">
              <el-option
               v-for="item in addStatusOptions"
                :key="item.value"
              :label="item.label"
              :value="item.value">

              </el-option>

            </el-select>


          </el-form-item>
          <el-form-item label="状态" prop="serverId">
           <el-select v-model="queryParams.orderState" placeholder="请选择">
               <el-option
                 v-for="item in statusOptions"
                 :key="item.decodeValue"
                 :label="item.decodeValue"
                 :value="item.decodeId">
               </el-option>
           </el-select>
          </el-form-item>



          <el-form-item label="下单日期" prop="createTime">
            <el-date-picker
              v-model="dateRange"
              type="daterange"
              value-format="yyyy-MM-dd"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期">
            </el-date-picker>
          </el-form-item>




          <el-form-item>
            <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
            <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
          </el-form-item>
        </el-form>
        <el-row :gutter="10" class="mb8">
          <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
        </el-row>

        <el-table v-loading="loading" :data="orderList" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55" align="center"  />
          <el-table-column label="订单ID" align="center" prop="orderId"  fixed="fixed"/>
          <el-table-column label="服务ID" align="center" prop="orderIndex" />
          <el-table-column label="服务主题" align="center" prop="gname" width="80px" />
          <el-table-column label="服务类型" align="center" prop="categoryName"  width="80px" />
          <el-table-column label="单价" align="center" prop="price"  width="80px" />
          <el-table-column label="数量" align="center" prop="goodsCounts"  width="80px" />
          <el-table-column label="支付金额" align="center" prop="totalAmount"  width="80px" />
          <el-table-column label="订单金额" align="center" prop="orderAmount"  width="80px" />
          <el-table-column label="服务人员手机号" align="center" prop="serverPhone"  width="120px"/>
          <el-table-column label="服务人员姓名" align="center" prop="serverName" width="120px"/>
          <el-table-column label="顾客手机号" align="center" prop="memberPhone"  width="120px"/>
          <el-table-column label="上门时间 " align="center" prop="serviceStartTime" />
          <el-table-column label="下单时间 " align="center" prop="createTime" />
          <el-table-column label="是否追加服务 " align="center" prop="column1" />
          <el-table-column label="状态 " align="center" prop="column2" />
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" >
            <template slot-scope="scope">
              <el-button  size="mini" type="text" icon="el-icon-edit" @click="toSee(scope.row)" v-hasPermi="['system:order:edit']"
              >查看</el-button>
              <div v-if="scope.row.orderState=='000'" >
                <el-button size="mini" type="text" icon="el-icon-edit" @click="toUpdatePrice(scope.row)" v-hasPermi="['system:order:edit']">修改单价</el-button>
              </div>


              <div v-if="scope.row.orderState=='001'" >
                <el-button size="mini" type="text" icon="el-icon-edit" @click="editRefund(scope.row)" v-hasPermi="['system:order:edit']">退款</el-button>
                <el-button  size="mini" type="text" icon="el-icon-edit" @click="updateServiceTime(scope.row)" v-hasPermi="['system:order:edit']">修改上门时间</el-button>
              </div>
              <div v-if="scope.row.orderState=='002'">
                <el-button size="mini" type="text" icon="el-icon-edit" @click="editRefund(scope.row)" v-hasPermi="['system:order:edit']">退款</el-button>
              </div>
              <div v-if="scope.row.orderState=='003'||scope.row.orderState=='004'||scope.row.orderState=='007'">
                <el-button size="mini" type="text" icon="el-icon-edit" @click="editRefund(scope.row)" v-hasPermi="['system:order:edit']">退款</el-button>
              </div>

            </template>
          </el-table-column>
        </el-table>

        <pagination
          v-show="total>0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          @pagination="getList"
        />
    </div>

      <el-dialog title="修改单价" :visible.sync="open" width="600px" append-to-body="">
        <el-row>
          <el-col>
             <el-input v-model="form.price">

             </el-input>
          </el-col>
          <el-col>
            <el-button @click="updatePrice">保存</el-button>
          </el-col>
        </el-row>
      </el-dialog>

      <el-dialog title="修改上门时间" :visible.sync="timeOpen" width="600px">

        <el-row>
          <el-col v-for=""></el-col>
        </el-row>

        <el-button @click="query">测试</el-button>

      </el-dialog>


      <el-dialog title="退款" :visible.sync="refundOpen" width="600px">

        <el-form  :model="refundParams" label-width="68px" ref="queryForm" :inline="true" label-position="left" style="margin-left: 100px" :rules="rules">
          <el-form-item>
            <el-row>
              <el-col>
                退款金额：<el-input v-model="refundParams.refundMoney"></el-input>
              </el-col>

              <el-col>
                退款原因：<el-input v-model="refundParams.refundReason"></el-input>
              </el-col>
            </el-row>
          </el-form-item>
        </el-form>
        <el-button @click="UpdateRefund">保存</el-button>
        <el-button @click="refundCancel">取消</el-button>

      </el-dialog>




    </div>
</template>

<script>
  import { listOrder, getOrder, delOrder, addOrder, updateOrder, exportOrder } from "@/api/system/order";
  import { listCode } from '../../api/system/dict/code'
  import { getTime, listTime } from '../../api/system/serverTime'
  import { listRefund, updateRefund } from '../../api/system/orderRefund'
  import { categoryList, queryCategoryList } from '../../api/basic/category'
    export default {
        name: "order",
      data(){
          return{
            // 日期范围
            dateRange: "",
            //服务类别筛选框
            serviceOptions:[],
            //服务状态筛选框
            statusOptions:[],
            // 遮罩层
            loading: true,
            // 导出遮罩层
            exportLoading: false,
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // 订单主表格数据
            orderList: [],
            // 弹出层标题
            title: "",
            // 是否显示弹出层
            open: false,
            // 查询参数
            queryParams: {
              pageNum: 1,
              pageSize: 10,
              orderIndex: null,
              memberId: null,
              merchantId: null,
              merchantName: null,
              orderType: null,
              orderState: null,
              appointmentStartTime: null,
              appointmentEndTime: null,
              serviceStartTime: null,
              serviceEndTime: null,
              serviceLongitude: null,
              serviceLatitude: null,
              shopAmount: null,
              isSettle: null,
              orderAmount: null,
              beanAmount: null,
              memberCouponId: null,
              couponAmount: null,
              totalAmount: null,
              payWay: null,
              memo: null,
              loginIp: null,
              loginDate: null,
              column1: null,
              column2: null,
              column3: null,
              Gname:null,
              goodsUnit :null,
              otherUnit:null,
              memberPhone:null,
              categoryName:null,
              goodsCounts:null,
              serverName :null,
              serverPhone :null,
              price:null,
              addCount:null,
              refStatus:null,
              serverId:null,
              gname:null,

          },
            // 表单参数
            form: {},
            // 表单校验
            rules: {
              memberId: [
                { required: true, message: "用户ID不能为空", trigger: "blur" }
              ],
              merchantId: [
                { required: true, message: "商户ID不能为空", trigger: "blur" }
              ],
              orderType: [
                { required: true, message: "订单类型 code不能为空", trigger: "change" }
              ],
              orderState: [
                { required: true, message: "订单状态 code不能为空", trigger: "blur" }
              ],
              isSettle: [
                { required: true, message: "是否已结算不能为空", trigger: "blur" }
              ],
              orderAmount: [
                { required: true, message: "订单金额不能为空", trigger: "blur" }
              ],
              totalAmount: [
                { required: true, message: "实付总价不能为空", trigger: "blur" }
              ],
              delFlag: [
                { required: true, message: "删除标志不能为空", trigger: "blur" }
              ],
              refundMoney: [
                { required: true, message: "退款金额不能为空", trigger: "blur" }
              ],
            },
            refStatusOptions:[],
            timeForm:{
              serverId:null,
            },
            timeOpen:false,
            timeOptions:[],
            //追加服务选择框
            addStatusOptions:[
              {
                label:'是',
                value:'1'
              },
              {
                label:'否',
                value:'2'
              },
              {
                label:'全部',
                value:''
              }
            ],
            refundParams:{
              refundMoney:'',
              refundReason:''
            },
            refundOpen:false,
            serverOptions:[],

          }

      },
      created() {
        this.getStatus();
        this.getRefStatus();
        this.getList();
        this.queryCategory();
      },
      mounted(){

      },
      methods:{
        /** 填充服务类型*/
        queryCategory(){
          queryCategoryList().then(res=>{
          this.serverOptions=res.rows
            console.log(this.serverOptions)
          })
        },
          /** 获取当前服务 服务人员时间安排*/
        query(row){
          listTime(this.timeForm).then(res=>{
            console.log(row)
          })

        },

        updateServiceTime(row){
          row.column1=null;
          row.column2=null;
          this.timeOpen=true;
          listTime(row).then(res=>{
            console.log(res)
          })


        },

          //修改单价
        toUpdatePrice(row){
          this.form=row;
          this.open=true
        },
        updatePrice(){
          this.form.column1=null;
          this.form.column2=null;


          updateOrder(this.form).then(res=>{
          if(res.code=='200'){

            this.$modal.msgSuccess("修改成功");
            this.open = false;
            this.getList();

          }
          else{
            this.$modal.msgError("修改失败，请联系管理员处理");
            this.open = false;
          }
          })
        },
          //详情页面跳转
          toSee(row){
          this.$router.push({path:'/order/details',query:{Order:row}})
        },
        /** 获取订单状态*/
        getStatus(){
          let param={
            codeValue:'订单状态'
          }
          listCode(param).then(res=>{
            this.statusOptions=res.rows
          })
        },
        /** 获取订单退款子状态*/
        getRefStatus(){
          let param={
            codeValue:'退款状态'
          }
          listCode(param).then(res=>{
            this.refStatusOptions=res.rows
          })
        },
        /** 查询订单主列表 */
        getList() {
          this.loading = true;
          if( this.queryParams.categoryName!=null){
            this.queryParams.categoryName=this.queryParams.categoryName[0].toString()
          }

          listOrder(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
            this.orderList = response.rows;
            //追加服务标注
            for(let i in this.orderList){
              if(this.orderList[i].addCount!==''&&this.orderList[i].addCount!==null&&this.orderList[i].addCount!==undefined&&this.orderList[i].addCount!=='0'){
                this.orderList[i].column1='是';
                this.orderList[i].goodsCounts=parseInt(this.orderList[i].goodsCounts)+parseInt(this.orderList[i].addCount);
              }
              else{
                this.orderList[i].column1='否';
              }
            if(this.orderList[i].orderState!=='005'){
              for(let j in this.statusOptions){
                //订单未退款
                if(this.orderList[i].orderState==this.statusOptions[j].decodeId){
                  this.orderList[i].column2=this.statusOptions[j].decodeValue
                }
              }
            }
            else{
              for(let jj in this.refStatusOptions){
                if(this.orderList[i].refStatus==this.refStatusOptions[jj].decodeId){
                  this.orderList[i].column2=this.refStatusOptions[jj].decodeValue

                }
              }
            }
            }
            // 备注：单价为改价后的数据，数量、订单金额、支付金额包括追加服务后的数据。
            // 订单金额、支付金额包括后续收取的维修费/配件费。
              for(let index in this.orderList){
                //如果有追加服务，对数量以及单价做处理
                if(this.orderList[index].column1=='是') {
                  this.orderList[index].goodsCounts = parseInt(this.orderList[index].goodsCounts) + parseInt(this.orderList[index].addCount)
                  this.orderList[index].price = parseInt(this.orderList[index].price) + parseInt(this.orderList[index].addAmount)
                }
                //如果有维修费，对金额做处理
                this.orderList[index].orderAmount=this.orderList[index].goodsCounts*this.orderList[index].price
                if(this.orderList[index].maintenanceAmount!==''&&this.orderList[index].maintenanceAmount!==null&&this.orderList[index].maintenanceAmount!==undefined){
                  this.orderList[index].orderAmount+=parseInt(this.orderList[index].maintenanceAmount)
                }
                this.orderList[index].totalAmount=this.orderList[index].orderAmount
                //优金豆折扣
                if(this.orderList[index].beanAmount!==''&&this.orderList[index].beanAmount!==null&&this.orderList[index].beanAmount!==undefined ){
                  this.orderList[index].totalAmount=this.orderList[index].totalAmount-this.orderList[index].beanAmount;
                }
                //优惠金额折扣
                if(this.orderList[index].couponAmount!==''&&this.orderList[index].couponAmount!==null&&this.orderList[index].couponAmount!==undefined ){
                  this.orderList[index].totalAmount=this.orderList[index].totalAmount-this.orderList[index].couponAmount;
                }
              }
            this.total = response.total;
            this.loading = false;
          });
        },
        // 取消按钮
        cancel() {
          this.open = false;
          this.reset();
        },
        // 表单重置
        reset() {
          this.form = {
            orderId: null,
            orderIndex: null,
            memberId: null,
            merchantId: null,
            merchantName: null,
            orderType: null,
            orderState: null,
            appointmentStartTime: null,
            appointmentEndTime: null,
            serviceStartTime: null,
            serviceEndTime: null,
            serviceLongitude: null,
            serviceLatitude: null,
            shopAmount: null,
            isSettle: null,
            orderAmount: null,
            beanAmount: null,
            memberCouponId: null,
            couponAmount: null,
            totalAmount: null,
            payWay: null,
            memo: null,
            delFlag: null,
            loginIp: null,
            loginDate: null,
            createBy: null,
            createTime: null,
            updateBy: null,
            updateTime: null,
            column1: null,
            column2: null,
            column3: null
          };
          this.resetForm("form");
        },
        /** 搜索按钮操作 */
        handleQuery() {
          this.queryParams.pageNum = 1;
          this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
          this.resetForm("queryForm");
          this.queryParams.orderState=null;
          this.queryParams.addCount=null;
          this.handleQuery();
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
          this.ids = selection.map(item => item.orderId)
          this.single = selection.length!==1
          this.multiple = !selection.length
        },
        /** 新增按钮操作 */
        handleAdd() {
          this.reset();
          this.open = true;
          this.title = "添加订单主";
        },
        /** 修改按钮操作 */
        handleUpdate(row) {
          this.reset();
          const orderId = row.orderId || this.ids
          getOrder(orderId).then(response => {
            this.form = response.data;
            this.open = true;
            this.title = "修改订单主";
          });
        },
        /** 提交按钮 */
        submitForm() {
          this.$refs["form"].validate(valid => {
            if (valid) {
              if (this.form.orderId != null) {
                updateOrder(this.form).then(response => {
                  this.$modal.msgSuccess("修改成功");
                  this.open = false;
                  this.getList();
                });
              } else {
                addOrder(this.form).then(response => {
                  this.$modal.msgSuccess("新增成功");
                  this.open = false;
                  this.getList();
                });
              }
            }
          });
        },
        /** 删除按钮操作 */
        handleDelete(row) {
          const orderIds = row.orderId || this.ids;
          this.$modal.confirm('是否确认删除订单主编号为"' + orderIds + '"的数据项？').then(function() {
            return delOrder(orderIds);
          }).then(() => {
            this.getList();
            this.$modal.msgSuccess("删除成功");
          }).catch(() => {});
        },
        editRefund(row){

          let param={
            orderId:row.orderId
          }
          listRefund(param).then(res=>{
            console.log(res)
            this.refundParams=res.rows[0];
          })
          this.refundOpen=true;


        },
        UpdateRefund(){
          updateRefund(this.refundParams).then(res=>{
            console.log(res)
          })
        },
        refundCancel(){
          this.refundOpen=false
        }
      }

    }
</script>

<style scoped>



</style>
