工单类型

src/views/workOrder/basicConfiguration/orderType/index.vue

@@ -1,20 +1,20 @@
 <template>
-	<template-page ref="pageRef" :get-list="getList" :table-attributes="tableAttributes" :table-events="tableEvents" :operationColumnWidth="80"
-	  :options-evens-group="optionsEvensGroup" :moreParameters="moreParameters" :column-parsing="columnParsing"
-	  :operation="operation" :exportList="exportList">
-	  <el-dialog title="" width="500px" custom-class="diy-dialog" append-to-body :modal="true" :visible.sync="formDialog"
-	    :show-close="true" :close-on-click-modal="false" :modal-append-to-body="false" :before-close="formCancel">
-	    <zj-form-container ref="formRef" :form-data="formData" :styleSwitch="false">
-	      <zj-form-module :title="formDialogTitles[formDialogType]" label-width="100px" :showPackUp="false"
-	        :form-data="formData" :form-items="formItems" :disabled="formDialogType==2">
-	      </zj-form-module>
-	    </zj-form-container>
-	    <div slot="footer" class="dialog-footer">
-			<el-button size="mini" @click="formCancel">取 消</el-button>
-			<el-button size="mini" v-if="formDialogType !== 2" type="primary" @click="formConfirm()">确定</el-button>
-	    </div>
-	  </el-dialog>
-	</template-page>
+  <template-page ref="pageRef" :get-list="getList" :table-attributes="tableAttributes" :table-events="tableEvents"
+    :operationColumnWidth="80" :options-evens-group="optionsEvensGroup" :moreParameters="moreParameters"
+    :column-parsing="columnParsing" :operation="operation()" :exportList="exportList">
+    <el-dialog title="" width="500px" custom-class="diy-dialog" append-to-body :modal="true" :visible.sync="formDialog"
+      :show-close="true" :close-on-click-modal="false" :modal-append-to-body="false" :before-close="formCancel">
+      <zj-form-container ref="formRef" :form-data="formData" :styleSwitch="false">
+        <zj-form-module :title="formDialogTitles[formDialogType]" label-width="100px" :showPackUp="false"
+          :form-data="formData" :form-items="formItems" :disabled="formDialogType == 2">
+        </zj-form-module>
+      </zj-form-container>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="mini" @click="formCancel">取 消</el-button>
+        <el-button size="mini" v-if="formDialogType !== 2" type="primary" @click="formConfirm()">确定</el-button>
+      </div>
+    </el-dialog>
+  </template-page>
 </template>
 
 <script>
@@ -22,23 +22,13 @@ import TemplatePage from '@/components/template/template-page-1.vue'
 import import_mixin from '@/components/template/import_mixin.js'
 import ImageUpload from '@/components/file-upload'
 import { required, mobileRequired, mobile, httpUrl, email } from '@/components/template/rules_verify.js'
-import { listPageV2,pageExport, getDetail, save, del } from "@/api/workOrder/orderType";
+import { listPageV2, pageExport, getDetail, save, del } from "@/api/workOrder/orderType";
+import operation_mixin from '@/components/template/operation_mixin.js'
 export default {
   components: { TemplatePage, ImageUpload },
-  mixins: [import_mixin],
+  mixins: [import_mixin, operation_mixin],
   data() {
     return {
-      // 事件组合
-      optionsEvensGroup: [
-	  	[
-	  		[
-	  			{
-	  				name: '新建',
-	  				click: this.addData
-	  			}
-	  		],
-	  	],
-	  ],
       // 表格属性
       tableAttributes: {
         // 启用勾选列
@@ -52,19 +42,31 @@ export default {
       recordSelected: [],
       /** 表单变量 */
       formDialogType: 0,
-      formDialogTitles: ["新增","编辑", "详情"],
+      formDialogTitles: ["新增", "编辑", "详情"],
       formDialog: false,
       formData: {
-		companyName: JSON.parse(localStorage.getItem('greemall_user')).companyName,
-		orderSmallTypeText: '',
-		orderType: '',
-		status: true,
-		sortNum: '',
-		imgUrl: []
+        companyName: JSON.parse(localStorage.getItem('greemall_user')).companyName,
+        orderSmallTypeText: '',
+        orderType: '',
+        status: true,
+        sortNum: '',
+        imgUrl: []
       }
     }
   },
   computed: {
+    // 事件组合
+    optionsEvensGroup() {
+      return [
+        [
+          [
+            this.optionsEvensAuth("add", {
+              click: this.addData
+            })
+          ]
+        ]
+      ]
+    },
     // 更多参数
     moreParameters() {
       return []
@@ -84,7 +86,7 @@ export default {
         md: 24,
         isShow: true,
         name: 'el-select',
-		options: [{label: '安装',value: 'INSTALL'},{label: '维修',value: 'REPAIR'}],
+        options: [{ label: '安装', value: 'INSTALL' }, { label: '维修', value: 'REPAIR' }],
         attributes: { placeholder: '请选择' },
         formItemAttributes: {
           label: '所属业务线',
@@ -101,25 +103,25 @@ export default {
           prop: 'orderSmallTypeText',
           rules: [...required]
         }
-      },{
+      }, {
         md: 24,
         isShow: true,
         name: 'slot-component',
-        attributes: { },
+        attributes: {},
         formItemAttributes: {
           label: '状态',
           prop: 'status',
           rules: [...required]
         },
-		render: (h, { props, onInput }) => {
-			var { value } = props
-			return (
-				<el-radio-group v-model={this.formData.status}>
-				    <el-radio disabled={this.formDialogType==2} label={true}>启用</el-radio>
-				    <el-radio disabled={this.formDialogType==2} label={false}>禁用</el-radio>
-				</el-radio-group>
-			)
-		}
+        render: (h, { props, onInput }) => {
+          var { value } = props
+          return (
+            <el-radio-group v-model={this.formData.status}>
+              <el-radio disabled={this.formDialogType == 2} label={true}>启用</el-radio>
+              <el-radio disabled={this.formDialogType == 2} label={false}>禁用</el-radio>
+            </el-radio-group>
+          )
+        }
       }, {
         md: 24,
         isShow: true,
@@ -131,83 +133,80 @@ export default {
           rules: []
         }
       }, {
-		md: 24,
-		isShow: true,
-		name: 'slot-component',
-		formItemAttributes: {
-			label: '上传图片',
-			prop: 'imgUrl',
-			rules: [...required]
-		},
-		render: (h, { props, onInput }) => {
-			var { value } = props
-			return (
-				<div>
-					<ImageUpload fileList={this.formData.imgUrl} fileType={['image']} limit={1} isEdit={this.formDialogType !== 2} />
-					<div style="color: #EA8000">上传后在小程序首页自助服务展示</div>
-				</div>
-			)
-		}
-	}]
+        md: 24,
+        isShow: true,
+        name: 'slot-component',
+        formItemAttributes: {
+          label: '上传图片',
+          prop: 'imgUrl',
+          rules: [...required]
+        },
+        render: (h, { props, onInput }) => {
+          var { value } = props
+          return (
+            <div>
+              <ImageUpload fileList={this.formData.imgUrl} fileType={['image']} limit={1} isEdit={this.formDialogType !== 2} />
+              <div style="color: #EA8000">上传后在小程序首页自助服务展示</div>
+            </div>
+          )
+        }
+      }]
     }
   },
   methods: {
     // 列表请求函数
-	getList: listPageV2,
+    getList: listPageV2,
     // 列表导出函数
     exportList: pageExport,
     // 表格列解析渲染数据更改
     columnParsing(item, defaultData) {
-		if (item.jname === 'imgUrl') {
-		        defaultData.render = (h, { row, index, column }) => {
-		          return (
-		            <div style="padding:0 6px;cursor: pointer;">
-		              {row.imgUrl ? row.imgUrl.split(",").map(url => <el-image src={url} preview-src-list={[url]} fit="cover" style="width:80px;height:80px;" />) : null}
-		            </div>
-		          )
-		        }
-		      }
+      if (item.jname === 'imgUrl') {
+        defaultData.render = (h, { row, index, column }) => {
+          return (
+            <div style="padding:0 6px;cursor: pointer;">
+              {row.imgUrl ? row.imgUrl.split(",").map(url => <el-image src={url} preview-src-list={[url]} fit="cover" style="width:80px;height:80px;" />) : null}
+            </div>
+          )
+        }
+      }
       return defaultData
     },
     // 监听勾选变化
     selectionChange(data) {
       this.recordSelected = data
     },
-    // 表格操作列
-    operation(h, { row, index, column }) {
-      return (
-        <div class='operation-btns'>
-		  <el-button type="text" onClick={() => {
-		    getDetail({ id: row.id }).then(res => {
-		      Object.assign(this.formData, res.data,{
-				  imgUrl:res.data?.imgUrl?  res.data?.imgUrl?.split(",").map(item=>({url:item})) : []
-			  })
-			   console.log(this.formData)
-		      this.formDialogType = 1
-		      this.openForm()
-		    })
-		  }}>编辑</el-button>
-		  <el-button type="text" style="color: #FF0000" onClick={() => {
-			this.$confirm('请确认是否删除该数据, 是否继续?', '提示', {
-				confirmButtonText: '确定',
-				cancelButtonText: '取消',
-				type: 'warning'
-			}).then(() => {
-				del({
-					id: row.id
-				}).then(res => {
-					if (res.code == 200) {
-						this.$message({ type: 'success', message: '删除成功!' })
-						this.$refs.pageRef.refreshList()
-					} else {
-						this.$message.error(res.msg);
-					}
-				})
-			});
-		  }}>删除</el-button>
-        </div>
-      )
+
+    operation() {
+      return this.operationBtn({
+        edit: {
+          click: ({ row, index, column }) => {
+            getDetail({ id: row.id }).then(res => {
+              Object.assign(this.formData, res.data, {
+                imgUrl: res.data?.imgUrl ? res.data?.imgUrl?.split(",").map(item => ({ url: item })) : []
+              })
+              this.formDialogType = 1
+              this.openForm()
+            })
+          }
+        },
+        del: {
+          prompt: "请确认是否删除该数据, 是否继续?",
+          click: ({ row, index, column }) => {
+            del({
+              id: row.id
+            }).then(res => {
+              if (res.code == 200) {
+                this.$message({ type: 'success', message: '删除成功!' })
+                this.$refs.pageRef.refreshList()
+              } else {
+                this.$message.error(res.msg);
+              }
+            })
+          }
+        }
+      })
     },
+
     addData() {
       this.formDialogType = 0
       this.openForm()
@@ -224,9 +223,9 @@ export default {
       this.$refs.formRef.validate((valid, invalidFields, errLabels) => {
         if (valid) {
           (save)({
-			  ...this.formData,
-			  imgUrl:this.formData.imgUrl.map(item=>item.url).join(",")
-		  }).then(res => {
+            ...this.formData,
+            imgUrl: this.formData.imgUrl.map(item => item.url).join(",")
+          }).then(res => {
             this.$message({ type: 'success', message: `${this.formDialogTitles[this.formDialogType]}成功!` })
             this.formCancel()
             this.$refs.pageRef.refreshList()
@@ -239,7 +238,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-	.tab{
-		padding: 20px 20px 0 20px;
-	}
+.tab {
+  padding: 20px 20px 0 20px;
+}
 </style>