123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245 |
- <template>
- <a-card :bordered="false" class="task-list">
- <!-- 查询区域 -->
- <div class="table-page-search-wrapper">
- <a-form layout="inline">
- <a-row :gutter="24">
- <a-col :md="6" :sm="8">
- <a-form-item label="任务名称">
- <a-input placeholder="请输入任务名称" v-model="queryParam.jobName"></a-input>
- </a-form-item>
- </a-col>
- <a-col :md="6" :sm="8">
- <a-form-item label="状态">
- <!-- <a-input placeholder="请输入状态" v-model="queryParam.status"></a-input> -->
- <a-select v-model="queryParam.status" allowClear>
- <a-select-option value="1">可用</a-select-option>
- <a-select-option value="2">任务中</a-select-option>
- <a-select-option value="3">不可用</a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
- <a-col :md="6" :sm="8">
- <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
- <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
- <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
- </span>
- </a-col>
- </a-row>
- </a-form>
- </div>
- <!-- table区域-begin -->
- <div>
- <a-table
- ref="table"
- size="middle"
- bordered
- rowKey="id"
- :columns="columns"
- :dataSource="dataSource"
- :pagination="ipagination"
- :loading="loading"
- @change="handleTableChange"
- @expand="expand"
- >
- <span slot="status" slot-scope="status">{{ status | showStatus }}</span>
- <span slot="action" slot-scope="text, record">
- <a @click="start(record)">开始执行</a>
- </span>
- </a-table>
- </div>
- <!-- table区域-end -->
- <a-modal title="执行设备" :visible="visible" @ok="handleOk" @cancel="handleCancel">
- <!-- dataList -->
- <a-form :form="form">
- <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="快手账号选择">
- <a-select
- v-decorator="[
- 'accountId', // 给表单赋值或拉取表单时,该input对应的key
- { rules: [{ required: true, message: '请选择快手账号选择!' }] }
- ]"
- >
- <a-select-option :value="item.id" v-for="item of dataList" :key="item.id">
- {{ item.accountName }}
- </a-select-option>
- </a-select>
- </a-form-item>
- <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="创意名称">
- <a-input
- placeholder="请输入创意名称"
- v-decorator="[
- 'creativeName', // 给表单赋值或拉取表单时,该input对应的key
- { rules: [{ required: true, message: '请输入创意名称!' }] }
- ]"
- />
- </a-form-item>
- <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="发布人名称">
- <a-input
- placeholder="请输入发布人名称"
- v-decorator="[
- 'publishName', // 给表单赋值或拉取表单时,该input对应的key
- { rules: [{ required: true, message: '请输入发布人名称!' }] }
- ]"
- />
- </a-form-item>
- <a-form-item :label-col="labelCol" :wrapper-col="wrapperCol" label="执行次数">
- <a-input-number
- :min="1"
- v-decorator="[
- 'num', // 给表单赋值或拉取表单时,该input对应的key
- { rules: [{ required: true, message: '请选择执行次数!' }] }
- ]"
- />
- </a-form-item>
- </a-form>
- </a-modal>
- <!-- 表单区域 -->
- <appiumTask-modal ref="modalForm" @ok="modalFormOk"></appiumTask-modal>
- <appiumTask-item-modal ref="modalItemForm" @ok="modalFormOk"></appiumTask-item-modal>
- </a-card>
- </template>
- <script>
- import AppiumTaskModal from './modules/AppiumTaskModal'
- import AppiumTaskItemModal from './modules/AppiumTaskItemModal'
- import { JeecgListMixin } from '@/mixins/JeecgListMixin'
- import { getAction, postAction } from '@/api/manage'
- import { transformTozTreeFormat } from '@/utils/util.js'
- export default {
- name: 'AppiumTaskList',
- mixins: [JeecgListMixin],
- components: {
- AppiumTaskModal,
- AppiumTaskItemModal
- },
- data() {
- return {
- description: '任务表管理页面',
- // 表头
- visible: false,
- detail: null,
- labelCol: {
- xs: { span: 24 },
- sm: { span: 6 }
- },
- wrapperCol: {
- xs: { span: 24 },
- sm: { span: 18 }
- },
- columns: [
- {
- title: '任务名称',
- align: 'center',
- dataIndex: 'jobName'
- },
- {
- title: '状态',
- align: 'center',
- dataIndex: 'status',
- scopedSlots: { customRender: 'status' }
- },
- {
- title: '操作',
- dataIndex: 'action',
- align: 'center',
- scopedSlots: { customRender: 'action' }
- }
- ],
- url: {
- list: '/ctop/appiumJob/list',
- delete: '/appium/appiumTask/delete',
- deleteBatch: '/appium/appiumTask/deleteBatch',
- exportXlsUrl: 'appium/appiumTask/exportXls',
- importExcelUrl: 'appium/appiumTask/importExcel'
- },
- run: '/appium/crawler/startJob',
- appiumDevice: '/ctop/bindAccountLogin/list',
- dataList: [],
- value: null,
- form: this.$form.createForm(this),
- jobId: ''
- }
- },
- computed: {
- importExcelUrl: function() {
- return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
- }
- },
- filters: {
- showStatus: function(value) {
- var status = {
- 1: '可用',
- 2: '任务中',
- 3: '不可用'
- }
- return status[value]
- }
- },
- methods: {
- lookDetail(item) {
- this.$refs.modalItemForm.edit(item)
- this.$refs.modalItemForm.title = '编辑'
- this.$refs.modalItemForm.disableSubmit = false
- },
- handleOk() {
- var that = this
- this.form.validateFieldsAndScroll((err, values) => {
- if (err) {
- // 这里做逻辑处理
- } else {
- var params = values
- params.jobId = that.jobId
- console.log(params)
- postAction(this.run, params).then(res => {
- console.log(res)
- that.visible = false
- this.form.resetFields()
- })
- }
- })
- },
- handleCancel() {
- this.value = null
- this.detail = null
- this.visible = false
- },
- start(item) {
- this.form.resetFields()
- this.visible = true
- this.jobId = item.id
- this.value = null
- var param = {}
- param.pageNo = 1
- param.pageSize = 100
- param.loginType = 'kuaishou'
- getAction(this.appiumDevice, param).then(res => {
- console.log(res.result.records)
- if (res.code == 0) {
- this.dataList = res.result.records
- }
- })
- },
- handleChange(value) {
- // this.value = value
- },
- filterOption(input, option) {
- return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
- }
- },
- mounted() {
- this.$nextTick(() => {})
- }
- }
- </script>
- <style scoped>
- @import '~@assets/less/common.less';
- </style>
- <style>
- .task-list .ant-table-middle tr.ant-table-expanded-row td > .ant-table-wrapper {
- margin: 0;
- }
- .task-list tr.ant-table-expanded-row td > .ant-table-wrapper {
- margin: 0;
- }
- </style>
|