<template>
  <div :class="$style.searchdiv">
    <a-card style="margin-bottom:20px">
      <xm-log-info-component :expressions.sync="expressions" @lsexpressions="lsexpressions">
      </xm-log-info-component>
    </a-card>
    <a-card>
      <sd-data-table-ex
        ref="spicLogInfo"
        form-id="spicLogInfo"
        page-id="audit/spicloginfo/spicLogInfo"
        :columns="columns"
        :actions="actions"
        show-selection
        :search-fields="['jsonData']"
        :filter-expressions="expressions"
        :scroll="{ y: 480, x: 200 }"
      >
        <template v-slot:form="{ model }">
          <sd-form-item name="id" hidden />
          <sd-form-item name="sourceId" />
          <sd-form-item v-model="model.sourceSys" name="sourceSys" />
          <sd-form-item name="methodName" />
          <sd-form-item name="jsonData">
            <a-textarea v-model="model.jsonData"></a-textarea>
          </sd-form-item>
          <sd-form-item name="message">
            <a-textarea v-model="model.message"></a-textarea>
          </sd-form-item>
          <sd-form-item name="visitDate">
            {{ moment(model.visitDate).format('YYYY-MM-DD HH:mm:ss') }}
          </sd-form-item>
          <sd-form-item name="respDate">
            {{ moment(model.respDate).format('YYYY-MM-DD HH:mm:ss') }}
          </sd-form-item>
        </template>
      </sd-data-table-ex>
    </a-card>
  </div>
</template>

<script>
import { Modal, Message } from 'ant-design-vue'
import axios from '@/common/services/axios-instance'
import PageService from '@/common/services/page-service'
import TableColumnTypes from '@/common/services/table-column-types'
import TableActionTypes from '@/common/services/table-action-types'
import moment from 'moment'
import components from './_import-components/xm-log-info-import'

const columns = [
  {
    title: '源系统',
    dataIndex: 'sourceSys',
    sdClickable: true,
    width: '10%',
    sorter: true,
  },
  {
    title: '接口类型',
    dataIndex: 'methodName',
    sdClickable: false,
    width: '8%',
    sorter: true,
  },
  {
    title: '传入参数',
    dataIndex: 'jsonData',
    sdClickable: true,
    width: '35%',
  },
  {
    title: '返回信息',
    dataIndex: 'message',
    sdClickable: false,
    width: '30%',
  },
  {
    title: '请求成功',
    dataIndex: 'isRequestSuccess',
    sdClickable: false,
    width: '10%',
    sorter: true,
  },
  {
    title: '执行成功',
    dataIndex: 'isSuccess',
    sdClickable: false,
    width: '10%',
    sorter: true,
  },
  // {
  //   title: '重置成功',
  //   dataIndex: 'isRebuildSuccess',
  //   sdClickable: false,
  //   width: '10%',
  //   sorter: true,
  // },
  {
    title: '创建时间',
    dataIndex: 'visitDate',
    sdRender: TableColumnTypes.dateTime,
    sorter: true,
    width: '10%',
  },
]

export default {
  name: 'XmLogInfo',
  metaInfo: {
    title: '接口日志管理',
  },
  components,
  data() {
    return {
      showform: false,
      confirmLoading: false,
      columns,
      expand: false, // 默认搜索条件为展开状态
      expressions: [],
      actions: [
        // {
        //   label: '删除',
        //   id: 'delete',
        //   type: TableActionTypes.oa.delete, // 删除按钮，不需要回调，会自动处理（对sd-data-table无效）
        // },
        // {
        //   label: '创建待办',
        //   id: 'createTodo',
        //   type: TableActionTypes.inline, // 数据行内的按钮，回调参数为record, rowIndex
        //   permission: null,
        //   callback: this.createOATodo,
        // },
        // {
        //   label: '删除待办',
        //   id: 'deleteTodo',
        //   type: TableActionTypes.inline, // 数据行内的按钮，回调参数为record, rowIndex
        //   permission: null,
        //   callback: this.deleteOATodo,
        // },
        // {
        //   label: '创建已办',
        //   id: 'createDone',
        //   type: TableActionTypes.inline, // 数据行内的按钮，回调参数为record, rowIndex
        //   permission: null,
        //   callback: this.createOADone,
        // },
      ],
    }
  },
  mounted() {
    setTimeout(() => {
      const params = {
        startPosition: 0,
        maxResults: -1,
        expressions: [
          {
            dataType: 'str',
            name: 'deleted',
            op: 'eq',
            stringValue: '0',
          },
        ],
        formId: 'ngsjLogInfo',
        orderBy: 'id asc',
        columns: 'id,jsonData,message',
      }
      PageService.getList(params).then((res) => {
        this.categoryOpts = res.data.data.map((val) => {
          return {
            id: val.id,
            name: val.jsonData,
          }
        })
      })
    })
  },
  methods: {
    moment,
    changeexpand() {
      this.expand = !this.expand
    },
    lsexpressions(item) {
      this.expressions = item
    },

    // 创建待办
    createOATodo(record) {
      var methodName = record.methodName
      if (
        methodName === 'create-todo' ||
        methodName === 'create-toread' ||
        methodName === 'del-todo' ||
        methodName === 'del-toread'
      ) {
        Modal.confirm({
          title: '温馨提示',
          content: '请确认是否要将此数据创建待办？',
          onOk: () => {
            axios({
              url:
                'api/xcoa-mobile/v1/ngsjloginfo/createOrDelOATodo?id=' +
                record.id +
                '&action=create',
              method: 'post',
            })
              .then((res) => {
                if (res.data.isRequestSuccess === 'false') {
                  Message.error('创建待办接口调用失败')
                } else {
                  Message.success(res.data.message)
                }
              })
              .catch(() => {
                Message.error('服务异常')
              })
          },
          onCancel: () => {},
        })
      } else {
        Modal.warning({
          title: '提示',
          content: '当前接口类型暂不支持',
        })
      }
    },
    // 删除待办
    deleteOATodo(record) {
      var methodName = record.methodName
      if (
        methodName === 'create-todo' ||
        methodName === 'create-done' ||
        methodName === 'create-toread' ||
        methodName === 'del-todo' ||
        methodName === 'del-toread'
      ) {
        Modal.confirm({
          title: '温馨提示',
          content: '请确认是否要将此数据删除待办？',
          onOk: () => {
            axios({
              url:
                'api/xcoa-mobile/v1/ngsjloginfo/createOrDelOATodo?id=' +
                record.id +
                '&action=delete',
              method: 'post',
            })
              .then((res) => {
                debugger
                if (res.data.isRequestSuccess === 'false') {
                  Message.error('删除待办接口调用失败')
                } else {
                  Message.success(res.data.message)
                }
              })
              .catch(() => {
                Message.error('服务异常')
              })
          },
          onCancel: () => {},
        })
      } else {
        Modal.warning({
          title: '提示',
          content: '当前接口类型暂不支持',
        })
      }
    },
    // 创建已办
    createOADone(record) {
      var methodName = record.methodName
      if (
        methodName === 'create-todo' ||
        methodName === 'create-done' ||
        methodName === 'create-toread' ||
        methodName === 'del-todo' ||
        methodName === 'del-toread'
      ) {
        Modal.confirm({
          title: '温馨提示',
          content: '请确认是否要将此数据创建已办？',
          onOk: () => {
            axios({
              url:
                'api/xcoa-mobile/v1/ngsjloginfo/createOrDelOATodo?id=' + record.id + '&action=done',
              method: 'post',
            })
              .then((res) => {
                if (res.data.isRequestSuccess === 'false') {
                  Message.error('创建已办接口调用失败')
                } else {
                  Message.success(res.data.message)
                }
              })
              .catch(() => {
                Message.error('服务异常')
              })
          },
          onCancel: () => {},
        })
      } else {
        Modal.warning({
          title: '提示',
          content: '当前接口类型暂不支持',
        })
      }
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.filterbtn {
  float: left;
}
.expandicon {
  margin-left: 5px;
}
.searchform {
  // min-height: 43%;
}
.searchnoform {
  min-height: 9%;
}
.expand {
  min-height: 56%;
}
.searchdiv {
  height: 100%;
  .marginw {
    margin-bottom: 20px;
  }
  :global(.sd-has-table.ant-card) {
    min-height: 56%;
  }
  :global(.ant-card-body) {
    padding: 4px 16px;
  }
  // .search {
  //   margin-top: 30px;
  //   margin-left: 30px;
  // }
}
</style>
