water_affairs/packageA/workOrder/setNode.vue

<template>
    <view>
        <cu-custom id="custom"
            bgImage="https://yostest175549.obs.cn-east-2.myhuaweicloud.com:443/202306151686796745663B52544232.png"
            :isBack="true">
            <block slot="backText">返回</block>
            <block slot="content">
                工序
            </block>
        </cu-custom>
        <view class="header">
            <view class="title">
                {{ detail.workpresetjson.workname }}
            </view>
            <view class="detail-result">
                <view class="have-not-begun tag" v-if="detail.status == 0">
                    未开始
                </view>
                <block v-else>
                    <view class="time">{{ detail.changedate }}</view>
                    <block v-if="detail.status == 1">
                        <view class="done tag">
                            完成
                        </view>
                        <view class="underway tag">
                            {{ detail.finishby }}
                        </view>
                    </block>
                    <view class="underway tag" v-else>
                        进行中
                    </view>

                </block>
            </view>
        </view>
        <My_form ref="My_form" @onConfirm="onConfirm" :isReadOnly="isReadOnly" />
        <view class="but-box" v-if="detail.status != 1">
            <u-button type="primary" text="确定完成" color="#0054E1" :disabled="disabled" loadingText="执行中..."
                :loading="loading" @click="submit(1)" />
            <view style="height: 10px;" />
            <u-button type="primary" text="保存" color="#0054E1" loadingText="保存中..." :loading="loading1"
                @click="submit(0)" />
        </view>
        <view style="height: 50rpx;" />
    </view>
</template>

<script>
export default {
    data() {
        return {
            isReadOnly: false,
            detail: {
                workpresetjson: {
                    workname: ""
                },
                status: 0
            },
            loading: false,
            loading1: false,
            disabled: false
        }
    },
    onLoad(options) {
        if (options.isReadOnly) this.isReadOnly = true;
        this.sa_workorderid = options.sa_workorderid;
        this.sa_workorder_nodeid = options.sa_workorder_nodeid;
        this.w_deviceid = options.w_deviceid;
        this.getDetail();
    },
    methods: {
        getDetail() {
            this.$Http.basic({
                "id": 20230209091103,
                "content": {
                    "sa_workorderid": this.sa_workorderid,
                    "sa_workorder_nodeid": this.sa_workorder_nodeid,
                }
            }).then(res => {
                console.log("工单节点详情", res)
                if (this.cutoff(res.msg)) return;
                this.detail = res.data[0]
                this.isReadOnly = this.isReadOnly || this.detail.status == 1;
                try {
                    this.detail.params = this.detail.params[0];
                } catch (error) {
                    this.detail.params = {
                        value: [],
                        showList: []
                    };
                }
                let form = [{
                    label: "工序说明",//标题
                    disabled: true,//禁用
                    type: 'text',//类型
                    password: false,//是否密码类型
                    placeholder: "暂无说明",
                    value: this.detail.workpresetjson.remarks || '',
                    maxlength: -1,//最大长度
                    key: "gxsm",
                    required: false,//是否必填
                }]
                const workpresetjson = this.detail.workpresetjson;

                if (workpresetjson.textedit !== 0) form.push({
                    label: "文本信息",
                    disabled: false,//禁用
                    type: 'textarea',//类型
                    value: "",
                    key: 'textcontent',
                    maxlength: -1,//最大长度
                    required: workpresetjson.textedit == 11,//是否必填
                });

                if (workpresetjson.confirm !== 0) form.push({
                    label: "是否确认",
                    disabled: false,//禁用
                    type: 'radio',//类型
                    value: "是",
                    options: workpresetjson.confirm_options.map(v => {
                        return {
                            value: v
                        }
                    }),
                    showKey: 'value',//必传 唯一值
                    selectKey: "value",//传值key返回该key的值，不传返回整个选择数据
                    key: "confirm_value",
                    required: workpresetjson.confirm == 11,//是否必填
                });

                if (workpresetjson.fileupload !== 0) form.push({
                    label: "附件",
                    disabled: false,//禁用
                    type: 'file',//类型
                    isDelete: true,//是否可以删除附件
                    fileType: ["image", "video", "file"],//可上传类型
                    key: "attinfos",
                    value: [],
                    required: workpresetjson.fileupload == 11,//是否必填
                    aDeletion: true,//是否为异步删除
                });
                if (workpresetjson.positioncheck !== 0) {
                    this.detail.location = {
                        address: this.detail.address || '',
                        latitude: this.detail.latitude || '',
                        longitude: this.detail.longitude || '',
                        time: this.detail.signdate || '',
                    }
                    form.push({
                        label: "签到",
                        type: 'location',//类型
                        key: "location",
                        value: {},
                        required: workpresetjson.positioncheck == 11,//是否必填 
                    });
                }
                if (workpresetjson.paramcheck !== 0) form.push({
                    label: "设备点位",
                    type: 'route',//类型
                    disabled: false,
                    path: "/select/points",
                    showKey: "paramname",
                    idKey: 'w_dataparamid',
                    param: {
                        "id": 20230613091602,
                        "content": {
                            "ownertable": "w_device",
                            "ownerid": this.w_deviceid,
                            "where": { "condition": "" }
                        }
                    },
                    key: "params",
                    value: {
                        value: [],
                        showList: []
                    },
                    required: workpresetjson.paramcheck == 11,
                });

                form.push({
                    label: "备注",
                    disabled: false,//禁用
                    type: 'textarea',//类型
                    placeholder: "",
                    value: "",
                    key: 'remarks',
                    maxlength: -1,//最大长度
                    required: false,//是否必填
                });


                this.$refs.My_form.render(form, this.detail)
            })
        },
        submit(isconfirm) {
            let content = {
                "sa_workorderid": this.sa_workorderid,
                "sa_workorder_nodeid": this.sa_workorder_nodeid,
                isconfirm,
                ...this.$refs.My_form.onSubmit()
            }
            content = Object.assign(content, content.location);
            content.signdate = content.time || '';
            content.params = [content.params] || [];
            delete content.location;
            delete content.time;
            if (isconfirm == 1) {
                this.loading = true;
            } else {
                this.loading1 = true;
            }
            Promise.all([this.$refs.My_form.handleFileLink(content.attachmentids, "sa_workorder_node", this.sa_workorder_nodeid), this.$refs.My_form.handleDeteleFiles(content.linksids)]).then(s => {
                console.log("绑定附件回调", s)
                delete content.attinfos;
                this.$Http.basic({
                    "id": 20230209094203,
                    content
                }).then(res => {
                    console.log("保存工序", res)
                    this.loading = false;
                    this.loading1 = false;
                    if (this.cutoff(res.msg, isconfirm == 1 ? '确定完成工序成功' : '保存成功')) return;
                    this.getDetail(true)
                    console.log(this.$Http)
                    this.$Http.updateNodes && this.$Http.updateNodes(true)
                })
            })
        },
        onConfirm(bool) {
            this.disabled = bool;
        }
    },
}

</script>

<style lang="scss" scoped>
.header {
    position: relative;
    padding: 10px;
    width: 355px;
    margin: 10px auto;
    background: #fff;
    border-radius: 4px;
    box-sizing: border-box;

    .title {
        font-size: 16px;
        font-weight: bold;
    }


    .detail-result {
        margin-top: 4px;
        display: flex;
        align-items: center;

        .have-not-begun {
            background: #E34D59;
        }

        .done {
            background: #4BA574;
        }

        .underway {
            background: #2151D1;
        }

        .tag {
            font-size: 10px;
            padding: 4px;
            border-radius: 4px;
            color: #fff;
            margin-right: 6px;
        }

        .time {
            font-size: 14px;
            color: #999;
            margin-right: 6px;
        }
    }
}

.but-box {
    width: 355px;
    margin: 20px auto 0;

    /deep/ .u-button__text,
    /deep/.u-button__loading-text {
        font-size: 14px !important;
        font-weight: bold;
    }

    /deep/.u-loading-icon__spinner {
        width: 17.25px !important;
        height: 17.25px !important;
    }
}
</style>