123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819 |
- <template>
- <view class="page">
- <view class="vtitle">借用人信息</view>
- <view class="form_group">
- <view class="lable">扫码</view>
- <view class="tag" @click="sm=true">
- <text class="span" style="width: 90%;">{{ code }}</text>
- <text class="icon code"></text>
- </view>
- </view>
- <view class="form_group" v-if="op == '设备借用11'">
- <view class="lable">设备所属部门</view>
- <view class="tag">
- <view class="span">
- <picker @change="bindChange($event, 'dept')" :range="array1">
- <view class="picks">{{ item.dept ? item.dept : '选择2' }}</view>
- </picker>
- </view>
- <text class="icon more"></text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">借用人</view>
- <view class="tag">
- <input v-model="item.borrower" placeholder="输入借用人" />
- <text class="icon more"></text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">借用人部门</view>
- <view class="tag">
- <text class="span">{{ item.UNIT }}</text>
- <text class="icon more"></text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">手机号</view>
- <view class="tag">
- <input v-model="item.tel" placeholder="输入手机号" />
- <text class="icon more"></text>
- </view>
- </view>
- <view class="vtitle">借用设备信息</view>
- <view v-if="id">
- <view v-for="(item, index) in list" :key="index" class="item">
- <view class="form_group">
- <view class="lable">序号</view>
- <view class="tag">
- <text class="span">{{ index + 1 }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">计量编号</view>
- <view class="tag">
- <text class="span">{{ item.items.__9ahUISXb1tM05xyD8UZ.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">设备名称</view>
- <view class="tag">
- <text class="span">{{ item.items.__XrMyKpQJ7SfuTIhC0sk.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">型号规格</view>
- <view class="tag">
- <text class="span">{{ item.items.__u8C4lICfaKzYYXt29WH.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">测量范围</view>
- <view class="tag">
- <text class="span">{{ item.items.__aFNTBUh2rsvSMhRBU3Y.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">最大允许误差</view>
- <view class="tag">
- <text class="span">{{ item.items.__J7HDuFkewsz1IRUnFKD.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">内部编号</view>
- <view class="tag">
- <text class="span">{{ item.items.__F9KplKpwzKDy4ZQZMtI.value }}</text>
- </view>
- </view>
- <view class="form_group"><!-- <button class="btn del" @click="del(item)">移除</button> --></view>
- </view>
- </view>
- <view v-else>
- <view v-for="(item, index) in list" :key="index" class="item">
- <view class="form_group">
- <view class="lable">序号</view>
- <view class="tag">
- <text class="span">{{ index + 1 }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">计量编号</view>
- <view class="tag">
- <text class="span">{{ item.items.__b5UmDDfLaCJJdn5F4JF.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">设备名称</view>
- <view class="tag">
- <text class="span">{{ item.items.__FwAgiHdxI4bCZaKNs4A.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">型号规格</view>
- <view class="tag">
- <text class="span">{{ item.items.__drInpQcmkMf2iWseaRR.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">测量范围</view>
- <view class="tag">
- <text class="span">{{ item.items.__XcfZD8dzEQb5qURydpP.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">最大允许误差</view>
- <view class="tag">
- <text class="span">{{ item.items.__ARvSmuzLwNLg6TlB4tV.value }}</text>
- </view>
- </view>
- <view class="form_group">
- <view class="lable">内部编号</view>
- <view class="tag">
- <text class="span">{{ item.items.__BEViJOuGBdPWSxES5Z5.value }}</text>
- </view>
- </view>
- <view class="form_group"><button class="btn del" @click="del(item)">移除</button></view>
- </view>
- </view>
- <u-empty v-if="list.length == 0"></u-empty>
- <view class="footer">
- <view class="flex">
- <view class="f"><button class="btn br" @click="submission()">提交</button></view>
- <!-- <view class="f" v-if="state == 1"><button class="btn br back" @click="back()">回退</button></view>
- <view class="f"><button class="btn" @click="validate()">保存</button></view>-->
- </view>
- </view>
- <u-popup :show="show" mode="bottom" @close="show = false" closeable round="15">
- <view class="popup">
- <u-divider text="提交流程面板"></u-divider>
- <scroll-view scroll-y="true" style="height: 450rpx;">
- <view v-for="(item, index) in nextNodes" :key="index" class="bitem"
- @click="bselect(item, 'nextNodes')">
- <view class="icon select check" v-if="item.check"></view>
- <view class="icon select" v-else></view>
- <view class="title">{{ item.name }}</view>
- </view>
- <textarea placeholder="意见" style="height: 120px;" maxlength="200" v-model="itemt.attitude" />
- </scroll-view>
- <view class="confrim-btn"><button class="btn" @click="submit()">确定</button></view>
- </view>
- </u-popup>
- <u-popup :show="bshow" mode="bottom" @close="bshow = false" closeable round="15">
- <view class="popup">
- <u-divider text="回退流程面板"></u-divider>
- <scroll-view scroll-y="true" style="height: 450rpx;">
- <view v-for="(item, index) in backNodes" :key="index" class="bitem"
- @click="bselect(item, 'backNodes')">
- <view class="icon select check" v-if="item.check"></view>
- <view class="icon select" v-else></view>
- <view class="title">{{ item.name }}</view>
- </view>
- <textarea placeholder="意见" style="height: 120px;" maxlength="200" v-model="itemt.attitude" />
- </scroll-view>
- <view class="confrim-btn"><button class="btn" @click="workflowsback()">确定</button></view>
- </view>
- </u-popup>
- <mumu-get-qrcode @success="qrcodeSucess" @error="qrcodeError" v-if="sm"></mumu-get-qrcode>
- </view>
- </template>
- <script>
- import mumuGetQrcode from '@/uni_modules/mumu-getQrcode/components/mumu-getQrcode/mumu-getQrcode.vue';
- export default {
- components: {
- mumuGetQrcode
- },
- data() {
- return {
- sm: false, //扫码
- array1: ['类型1', '类型2', '类型3', '类型4'], //实验类型1
- bitem: {
- applicationId: '__gAPYBW4YxB3UePM3lqO',
- exparams: {},
- formId: '__0FLGNncOS1lz0T9jsFn',
- id: '__79Wtw03ya4dJUDGPyAN',
- isRelate: 'undefined',
- parentId: '',
- sign: '',
- subDocuments: [],
- templateForm: '',
- versions: '0'
- },
- btitem: {
- applicationId: '__gAPYBW4YxB3UePM3lqO',
- exparams: {},
- formId: '__0FLGNncOS1lz0T9jsFn',
- id: '__79Wtw03ya4dJUDGPyAN',
- isRelate: 'undefined',
- parentId: '',
- sign: '',
- subDocuments: [],
- templateForm: '',
- versions: '0'
- },
- geteq: {
- DEVID: '202209211603170016',
- allow: 'false',
- appId: '__gAPYBW4YxB3UePM3lqO',
- datetime: '1670485443880',
- detp: '',
- fieldid: '__iLwKGJTxD89ZKnFzo2Y',
- formId: '__w9J1gxcIWgXmNw6pE1F',
- isEdit: 'true',
- mutil: 'true',
- parentId: '__NYI0rVs0LXbiW21z6Nv',
- searchForm: 'false',
- selectOne: 'false',
- viewId: '__WLVxKX6e0Pq0cTwdNUQ'
- },
- item: {},
- op: '设备借用',
- current: 0,
- code: '',
- list: [],
- show: false,
- bshow: false,
- itemt: {},
- up: {},
- id: '',
- content: '标题',
- nextNodes: [],
- backNodes: [],
- items: {
- document: {
- items: {}
- }
- },
- runViewDialogConfirmScript: {
- docId: "__DIl607e1fsiknRgGRQj",
- document: {
- items: {
- group: "",
- depttool: "",
- UNIT: "柳工",
- borrower: "",
- tel: "",
- remarks: ""
- },
- },
- fieldId: "__0TQu1UrRbMZVX1UvtBL",
- formId: "__w9J1gxcIWgXmNw6pE1F",
- viewId: "__WLVxKX6e0Pq0cTwdNUQ",
- _selects: "__sIJiL5GlxEYoL095Vo9",
- },
- };
- },
- onLoad(e) {
- this.op = e.op;
- this.id = e.id;
- console.log('e=======:' + JSON.stringify(e));
-
- if (e.ste == 1) {
- /* this.http.request({
- url: this.http.urls.xxxx + e.id,
- success: res => {
- this.item = res.data.data;
- }
- }); */
- this.getDocuments();
- } else {
- this.empty();
- }
- //选中审批人员监听函数,其它类型的参考这个
- uni.$on('select', res => {
- });
- },
- onReady() {
- uni.setNavigationBarTitle({
- title: this.op
- });
- },
- methods: {
- //提交或回退
- bselect(e, tag) {
- this[tag].forEach(item => {
- item.check = false;
- });
- e.check = true;
- this.itemt.nextNodeIds = [];
- this.itemt.nextNodeIds.push(e.id);
- this.$forceUpdate();
- }, //详情
- qr() {
- // 调用uni提供的调用相机api
- uni.chooseImage({
- sizeType: ['original'],
- sourceType: ['camera'],
- count: 1,
- success: res => {
- const tempFilePaths = res.tempFilePaths[0]; // 获取到二维码图片的链接
- qrcode.decode(tempFilePaths); // 解析二维码图片
- qrcode.callback = r => {
- var r1 = r.split('*')[1]
- this.code = r1;
- if (!this.code) {
- uni.showModal({
- title: '提示',
- content: '该二维码无法识别!!',
- showCancel: false,
- success: res => {
- if (res.confirm) {
- // uni.navigateBack();
- }
- }
- });
- return;
- }
- this.geteq.DEVID = this.code;
- if (this.list.length == 0) {
- this.getEq();
- } else {
- this.list.forEach(item => {
- if (item.items.__2sfNVgOh5Bzq6lXRVuM.value == this.geteq
- .DEVID) {
- uni.showModal({
- title: '提示',
- content: '该设备已经选择过了',
- showCancel: false,
- success: res => {
- if (res.confirm) {
- // uni.navigateBack();
- }
- }
- });
- } else {
- this.getEq();
- }
- });
- }
- console.log('asd:' + r);
- this.$forceUpdate();
- };
- }
- });
- },
- //扫码成功
- qrcodeSucess(data) {
- this.sm = false;
- uni.showModal({
- title: '成功',
- content: data //识别的数据
- });
- var r1 = data.split('*')[1]
- this.code = r1;
- this.geteq.DEVID = this.code;
- if (this.list.length == 0) {
- this.getEq();
- } else {
- this.list.forEach(item => {
- if (item.items.__2sfNVgOh5Bzq6lXRVuM.value == this.geteq
- .DEVID) {
- uni.showModal({
- title: '提示',
- content: '该设备已经选择过了',
- showCancel: false,
- success: res => {
- if (res.confirm) {
- // uni.navigateBack();
- }
- }
- });
- } else {
- this.getEq();
- }
- });
- }
- },
- qrcodeError(err) {
- console.log(err);
- uni.showModal({
- title: '摄像头授权失败',
- content: '摄像头授权失败,请检测当前浏览器是否有摄像头权限。',
- success: res => {
- console.log('asd:' + JSON.stringify(res));
- this.sm = false;
- }
- });
- },
- //选择结果形式
- change(e) {
- this.current = e;
- console.log('aa:' + this.radio[this.current].name);
- },
- //选择实验类型
- bindChange(e, type) {
- this.item[type] = this.array1[e.target.value];
- this.$forceUpdate();
- },
- //选择审批人员
- select() {
- uni.navigateTo({
- url: '/pages/index/select'
- });
- },
- //查看借用详情
- getDocuments() {
- this.http.request({
- url: this.http.urls.documents + this.id,
- data: this.item,
- success: res => {
- this.item = res.data.data.items;
- //this.p = res.data.data;
- //console.log('res.data.data:' + JSON.stringify(res.data.data));
- this.boor_list();
- this.iteml = res.data.data;
- this.items.applicationId = '__gAPYBW4YxB3UePM3lqO';
- this.items.docId = this.iteml.id;
- this.items.id = this.iteml.id;
- this.items.formId = this.iteml.formid;
- this.items.parentId = '';
- this.items.subSelects = [];
- this.items.templateForm = '';
- this.items.viewId = '';
- this.items.document.items = this.item;
- this.items.document.applicationId = '__gAPYBW4YxB3UePM3lqO';
- this.items.document.exparams = {};
- this.items.document.formId = this.iteml.formid;
- this.items.document.id = this.iteml.id;
- this.items.document.parentId = '';
- this.items.document.sign = '';
- this.items.document.stateId = this.iteml.stateid;
- this.items.document.subDocuments = [];
- this.items.document.templateForm = '';
- this.items.document.versions = '0';
- }
- });
- },
- getEq() {
- this.http.request({
- url: this.http.urls.eq_list +
- 'parentId=' +
- this.geteq.parentid,
- data: this.geteq,
- method: 'POST',
- success: res => {
- //console.log('res2:' + JSON.stringify(res.data.data.data));
- if (res.data.errcode == 0) {
- if (res.data.data.data.length > 0) {
- res.data.data.data.forEach(item => {
- this.list.push(item);
- });
- } else {
- uni.showModal({
- title: '提示',
- content: '该设备不在该部门或者正在在借用中',
- showCancel: false,
- success: res => {
- if (res.confirm) {
- // uni.navigateBack();
- }
- }
- });
- }
- }
- }
- });
- },
- //查看详情时获取子表信息
- boor_list() {
- this.http.request({
- url: this.http.urls.boor_list +
- 'parentId=' +
- this.id,
- method: 'POST',
- success: res => {
- console.log('res2:' + JSON.stringify(res));
- if (res.data.errcode == 0) {
- res.data.data.data.forEach(item => {
- this.list.push(item);
- });
- }
- }
- });
- },
- //创建表单获取初始数据
- empty() {
- var url = '';
- if (this.op == '设备借用') {
- url = this.http.urls.borr_empty;
- } else {
- url = this.http.urls.return_empty;
- }
- this.http.request({
- url: url,
- data: this.item,
- success: res => {
- this.item = res.data.data.items;
- this.bitem.id = res.data.data.id;
- this.bitem.formId = res.data.data.formid;
- this.bitem.versions = res.data.data.versions;
- this.geteq.parentid = res.data.data.id;
- //创建时组建提交流程面板请求数据
- this.iteml = res.data.data;
- this.items.applicationId = '__gAPYBW4YxB3UePM3lqO';
- this.items.docId = this.iteml.id;
- this.items.id = this.iteml.id;
- this.items.formId = this.iteml.formid;
- this.items.parentId = '';
- this.items.subSelects = [];
- this.items.templateForm = '';
- this.items.viewId = '';
-
- this.items.document.items = this.item;
- this.items.document.applicationId = '__gAPYBW4YxB3UePM3lqO';
- this.items.document.exparams = {};
- this.items.document.formId = this.iteml.formid;
- this.items.document.id = this.iteml.id;
- this.items.document.parentId = '';
- this.items.document.sign = '';
- this.items.document.stateId = this.iteml.stateid;
- this.items.document.subDocuments = [];
- this.items.document.templateForm = '';
- this.items.document.versions = '0';
- //console.log('res2:' + JSON.stringify(res.data.data));
- }
- });
- },
- //移除借用设备信息
- del(item) {
- this.list.splice(this.list.indexOf(item), 1);
- },
- tool_borrowing_empty() {
- this.list.forEach(item => {
- this.http.request({
- url: this.http.urls.tool_borrowing_empty,
- data: this.item,
- success: res => {
- console.log('tool_borrowing_empty:' + JSON.stringify(res));
- //this.item = res.data.data.items;
- console.log('this.bitem:' + JSON.stringify(this.bitem));
- this.btitem.id = res.data.data.id;
- this.btitem.formId = res.data.data.formid;
- this.btitem.versions = res.data.data.versions;
- this.btitem.parentId = this.bitem.id;
- //this.btitem.parent=this.bitem.id;
- this.btitem.items = res.data.data.items;
- this.btitem.items.HERST = item.items.__SH6ZSHZMqHeGHDFLAaO.value; //
- this.btitem.items.TYPBZ = item.items.__drInpQcmkMf2iWseaRR.value; //
- this.btitem.items.EQKTX = item.items.__FwAgiHdxI4bCZaKNs4A.value; //
- this.btitem.items.FBL = item.items.__Tyyw12PleIHLPjjJWsV.value; //
- this.btitem.items.TPLNR = item.items.__a7cgJzxvCbcNNH0KjCn.value; //
-
- this.btitem.items.EQUNR = item.items.__b5UmDDfLaCJJdn5F4JF.value; //
- this.btitem.items.NUMBER = item.items.__2sfNVgOh5Bzq6lXRVuM.value;
- this.btitem.items.CLFW = item.items.__XcfZD8dzEQb5qURydpP.value; //
- this.btitem.items.borrowing_date = this.util.getDate('time'); //借用日期
- this.btitem.items.ZQDDJ = item.items.__Rhr5ihIebMolSIr8CKn.value; //
- this.btitem.items.ZDYXWC = item.items.__ARvSmuzLwNLg6TlB4tV.value; //
- this.btitem.items.STTXU = item.items.__SBtfwetYprHFQ5J2MAn.value; //
- this.btitem.items.SERGE = item.items.__qyobrAFN4PtseWXiY5A.value; //
- this.btitem.items.INTNUM = item.items.__BEViJOuGBdPWSxES5Z5.value; //
- this.btitem.items.NPLDA = item.items.__R8QpJNSHAVFaYwHnVCo.value; //
- //this.btitem.items.toolstate=0;//借用日期
- this.btitem.items.DEVID = item.items.__2sfNVgOh5Bzq6lXRVuM.value;
- console.log('this.btitem1:' + JSON.stringify(this.btitem));
- this.validate();
- console.log('保存子表数据========:' + JSON.stringify(res.data.data));
- }
- });
- });
- },
- //提交
- validate() {
- this.http.request({
- url: this.http.urls.validate +
- '?parentId=' +
- this.btitem.parentId,
- data: this.btitem,
- method: 'POST',
- success: res => {
- console.log('validate101:' + JSON.stringify(res));
- this.updateparent(this.btitem.parentId, res.data.data.id);
- }
- });
- },
- updateparent(parent, id) {
- this.http.request({
- url: this.http.urls.update_parent + 'parent=' + parent + '&id=' + id +
- '&table=tlk_tool_borrowing',
- method: 'POST',
- success: res => {
- console.log('validate102:' + JSON.stringify(res));
- }
- });
- },
- //提交流程面板
- submission() {
- //this.validate();
- this.http.request({
- url: this.http.urls.documents + this.bitem.id + '/panels/submission',
- data: this.items,
- method: 'POST',
- success: res => {
- //this.item=res.data.data;
- //console.log('zx22:' + JSON.stringify(res));
- this.show = true;
- this.title = res.data.data.name;
- this.nextNodes = res.data.data.nextNodes;
- this.itemt.flowId = res.data.data.flowId;
- this.itemt.flowType = '80';
- this.itemt.currentNodeId = res.data.data.currentNodeId;
- this.itemt.attitude = '';
- this.itemt.signature = '';
- this.itemt.submitTo = '';
- this.itemt.circulatorInfo = '';
- this.itemt.subFlowApproverInfo = '';
- this.itemt.subFlowApproverInfoAll = '';
- this.itemt.document = this.items.document;
- //this.content=res.data.data.formname;
- }
- });
- }, //提交流程
- submit() {
- //this.itemt.document.items.purpose="试验目的5656";
- //this.itemt.document.items.title="标题5656";
- if (this.itemt.document.items.borrower == '' || this.itemt.document.items.borrower == null) {
- uni.showModal({
- title: '提示',
- content: '请填写借用人',
- showCancel: false,
- success: res => {
- if (res.confirm) {
- //uni.navigateBack();
- }
- }
- });
- return;
- }
- if (this.itemt.document.items.tel == '' || this.itemt.document.items.tel == null) {
- uni.showModal({
- title: '提示',
- content: '请填写手机号',
- showCancel: false,
- success: res => {
- if (res.confirm) {
- //uni.navigateBack();
- }
- }
- });
- return;
- }
- this.tool_borrowing_empty();
- this.itemt.applicationId = '__gAPYBW4YxB3UePM3lqO';
- this.itemt.docId = this.iteml.id;
- this.itemt.id = this.iteml.id;
- this.itemt.formId = this.iteml.formid;
- this.itemt.parentId = '';
- this.itemt.subFlowApprover = [];
- this.itemt.subSelects = [];
- this.itemt.submitTo = [];
- this.itemt.templateForm = '';
- this.itemt.viewId = '';
- this.http.request({
- url: this.http.urls.documents + this.id + '/workflows/submit',
- data: this.itemt,
- method: 'PUT',
- success: res => {
- //this.item=res.data.data;
- console.log('zx22:' + JSON.stringify(res));
- if (res.data.errcode == 0) {
- uni.showModal({
- title: '提示',
- content: res.data.data,
- showCancel: false,
- success: res => {
- if (res.confirm) {
- uni.navigateBack();
- }
- }
- });
- //if (this.id == null) {
- //this.tool_borrowing_empty();
- //}
- } else {
- uni.showModal({
- title: '提示',
- content: res.data.errmsg,
- showCancel: false,
- success: res => {
- if (res.confirm) {
- //uni.navigateBack();
- }
- }
- });
- }
- this.show = false;
- this.title = res.data.data.name;
- this.nextNodes = res.data.data.nextNodes;
- }
- });
- }, //刷新数据
- //提交
- add() {
- this.http.request({
- url: this.http.urls.user_task_add,
- data: this.item,
- method: 'POST',
- success: res => {
- uni.showModal({
- title: '提示',
- content: '提交成功',
- showCancel: false,
- success: res => {
- if (res.confirm) {
- uni.navigateBack();
- }
- }
- });
- }
- });
- }
- }
- };
- </script>
- <style lang="scss">
- .page {
- padding-bottom: 80px;
- }
- .item {
- margin-bottom: 10px;
- }
- .del {
- width: 70%;
- background-color: #e64340;
- }
- </style>
|